WEB TASARIM EĞİTİMİ
Web Tasarım Eğitimi her sayfayı tek tek çizmek yerine tutarlı bir tasarım sistemi üzerine kurmayı öğretir. Katılımcılar grid, tipografi ve renk kararlarını rastlantıdan çıkarıp belirli kurallara bağlar.
Eğitim sonunda katılımcılar masaüstünden mobile uzanan, erişilebilirliği gözeten arayüzler tasarlar ve tasarımı koda taşıma akışını uçtan uca kavrar. Web standartları konusunda açık web teknolojileri belgeleri başvuru noktasıdır.
Katılımcı Profili
Web tasarımı yapan profillere yöneliktir:
- UI/UX Tasarımcıları: Figma ile arayüz tasarımı ve prototyping yapar
- Web Tasarımcıları: Landing page, kurumsal site ve e-ticaret tasarlar
- Front-end Geliştiriciler: Tasarımı koda dönüştürür ve handoff yönetir
- Tasarım Stüdyoları: Çoklu müşteri web projesi teslim eder
- Freelance Tasarımcılar: Portföy ve client work üretir
Ön Gereklilikler
Aşağıdaki temellerin oturmuş olması eğitimden alacağınız verimi artırır:
- Bilgisayarda dosya yönetimi ve klasör mantığında rahatlık
- Tarayıcı kullanımında akıcılık ve temel internet kavramları
- HTML etiketlerini bir kez görmüş olmak
- CSS seçicilere giriş seviyesi farkındalık
- VS Code benzeri bir kod editörü kullanmaya açık olmak
Süresi ve Tarihi
Süre: 3 gün. Bu süre standart program içindir; ek modüllere ve hedefe göre süre özelleştirilebilir.
Eğitim tarihleri ve saatleri, katılımcı grubunun uygunluğuna göre birlikte planlanır.
Kazanımlar
Eğitim sonunda web arayüzü tasarımı daha sistematik bir karar alma sürecine kavuşur:
- Sayfa hiyerarşisini kullanıcı hedeflerine göre kurgular
- Grid, flex ve boşluk yönetimiyle tutarlı düzen kurar
- Responsive kırılımları planlayarak taşmaları azaltır
- Erişilebilirlik ilkelerini bileşen seviyesinde uygular
- Tipografi ve renk kullanımında okunabilirlik standardı oluşturur
- DevTools ile stil, layout ve performans sorunlarını ölçer
- Tasarım sistemi yaklaşımıyla yeniden kullanılabilir bileşenler tanımlar
- SEO ve içerik yapısını sayfa tasarımına doğru entegre eder
Web Tasarım Eğitimi Konuları
1. UX/UI Temelleri ve Tasarım Prensipleri
- UX ve UI arasındaki fark ve ortak alan
- Gestalt prensipleri: proximity, similarity, closure
- Hick's Law, Fitts' Law, Jakob's Law
- Cognitive load ve simplicity
- Visual hierarchy ve scanning patterns
2. Bilgi Mimarisi (IA) ve Wireframe
- Sitemap ve content inventory
- User flow ve task flow ayrımı
- Card sorting ve tree testing
- Low-fi wireframe ve mid-fi mockup
- Whimsical, Balsamiq, Figma araçları
3. Renk Teorisi ve Palette Üretimi
- Color wheel, complementary, analogous
- HSL ve HEX renk sistemleri
- Primary, secondary, accent palette
- 60-30-10 renk kuralı
- Coolors, Adobe Color, Realtime Colors araçları
4. Tipografi ve Web Font'lar
- Serif, sans-serif, monospace family
- Type scale: modular, golden ratio
- Google Fonts ve Adobe Fonts kullanımı
- Variable font ve performans
- Line-height, letter-spacing, x-height
5. 12-Column Grid ve Responsive Layout
- 12-column grid sistemi
- Gutter, margin, container ayarları
- F-pattern ve Z-pattern okuma yönü
- Whitespace ve breathing room
- CSS Grid ve Flexbox layout farkı
6. Component Design ve Tasarım Sistemleri
- Atomic Design: atoms, molecules, organisms
- Button, input, card component standardizasyonu
- Material Design, Apple HIG, Carbon
- Token tabanlı tasarım sistemi
- Storybook ile component documentation
7. Responsive ve Mobile-First Yaklaşım
- Mobile-first vs desktop-first
- Breakpoint stratejisi: 640, 768, 1024, 1280
- Fluid typography ve clamp()
- Touch target boyutu (44x44 px min)
- Container query ile component responsive
8. Erişilebilirlik (WCAG 2.1)
- WCAG 2.1 AA/AAA seviyeleri
- Color contrast: 4.5:1 ve 7:1 oranı
- Keyboard navigation ve focus management
- Screen reader ve semantic HTML
- WAVE, axe DevTools ile audit
9. Figma ile Tasarım Üretimi
- Figma arayüzü: frame, group, component
- Auto Layout ile responsive component
- Variants ve component properties
- Styles: color, text, effect, grid
- Variables ve tema yönetimi
10. Prototyping ve Interactive Demo
- Figma Prototype: interaction ve animation
- Smart Animate ve transition
- Overlay ve modal flow
- Hover, press, click state'leri
- Framer, ProtoPie alternatifleri
11. Design Handoff ve Developer Communication
- Figma Dev Mode ile inspect
- Zeplin ve Avocode alternatifleri
- Asset export: SVG, PNG, WebP
- Design token export: Style Dictionary
- Annotation ve spec sharing
12. Web Performance ve LCP, CLS
- Core Web Vitals: LCP, INP, CLS
- Image optimization: WebP, AVIF, lazy loading
- Font loading stratejisi: swap, optional
- Critical CSS ve render blocking kaynaklar
- Lighthouse ve PageSpeed Insights
13. SEO Friendly Tasarım Pratikleri
- Semantic HTML ve heading hierarchy
- Image alt text ve descriptive filename
- İç link yapısı ve breadcrumb
- Above-the-fold içerik önceliği
- Schema.org markup ile structured data
14. Design Critique ve Test Yöntemleri
- Design review oturumu yönetimi
- Heuristic evaluation (Nielsen 10 kuralı)
- Usability testing: moderated ve unmoderated
- A/B test ve multivariate test
- Hotjar, Microsoft Clarity ile heatmap
Web Tasarım Eğitimi ile İlgili
Sıkça Sorulan Sorular ve Cevapları
Web Tasarım eğitimini kurumumuza özel planlayabilir miyiz?
Evet. Web Tasarım eğitiminin içeriği ve süresi sabit değildir; firmanızın öncelikleri ve katılımcı profiliniz doğrultusunda programı birlikte kurgular, tamamen kurumunuza özel olarak ilerleriz.
Web Tasarım eğitimini hangi şehirlerde veriyorsunuz?
Web Tasarım eğitimini İstanbul, Ankara ve İzmir başta olmak üzere Türkiye'nin tüm illerinde yerinde veriyoruz; isteyen kurumlara eğitim canlı online olarak da sunulur, dünyanın her yerinden katılım mümkündür.
Web Tasarım eğitimini online veriyor musunuz?
Evet, Web Tasarım eğitimini canlı online olarak da veriyoruz; uygulamalı oturumlarla Türkiye'nin ve dünyanın neresinde olursanız olun katılabilirsiniz. Program kurumunuzun ihtiyacına göre belirlenir.
Web Tasarım eğitimi çalışanlarımızın seviyesine göre uyarlanıyor mu?
Evet. Web Tasarım eğitiminin başında katılımcıların seviyesi değerlendirilir ve içerik buna göre ayarlanır; sıfırdan başlanabileceği gibi ileri konulara da odaklanılabilir.
Web Tasarım eğitimi projemiz üzerinden ilerleyebilir mi?
Eğitim, kendi web projeniz veya uygulamanız üzerinden ilerleyebilir. Bunun için teklif öncesinde projenizi bize iletmeniz ya da tarif etmeniz gerekmektedir; böylece eğitimi gerçek işinize göre kurgularız.
Web Tasarım eğitmenleriniz hakkında bilgi alabilir miyiz?
Eğitmenlerimiz web ve yazılım geliştirme alanında sahada deneyimli, Web Tasarım'i gerçek projelerde kullanan uzmanlardır. İhtiyacınıza ve hedefinize en uygun eğitmeni sizinle eşleştiriyoruz.
Katılımcılarımıza sertifika veriliyor mu?
Evet. Eğitim sonunda katılımcılarımıza katılım sertifikası veriyoruz; sertifikada eğitimin kapsamı ve katılımcı bilgileri yer alır, kurumunuzun tercihine göre dijital ya da basılı hazırlanır.
Web Tasarım eğitiminin fiyatı ne kadar?
Sabit bir Web Tasarım eğitimi ücreti yoktur; fiyat, katılımcı sayısı, kapsam ve süreye göre belirlenir. İhtiyacınızı dinleyip kurumunuza özel bir teklif sunarız.
Web tasarım programını netleştirelim, tarih seçeneklerini planlayalım.
0 212 951 07 08 · Kurumsal teklif
