Web sitelerinin hazırlanmasında kullanılan diller, teknolojiler ve yöntemler geçtiğimiz 10 yıl içerisinde büyük değişimlere uğradı. Bir yandan gelişen teknolojinin sunduğu olanaklar, diğer yandan daha çok insana daha etkin şekilde ulaşma zorunluluğunun yarattığı zorluklar bu alanı başlı başına bir uzmanlık konusu haline getirdi. Ayrıca aynı teknolojilerin her alanda hizmet veren web uygulamalarında ve mobil uygulamalarda da yaygınlaşması konuya gösterilen ilgiyi büyük ölçüde arttırdı. Hem grafik tasarımını yapabilecek sanatsal becerilere hem de bu tasarımı uygulayabilecek teknik becerilere sahip olan insan sayısının azlığı web tasarımında çalışmak isteyenler için ciddi olanaklar yaratan bir boşluk olarak dikkat çekiyor. Bu program grafik tasarım eğitimi almış insanları sanatsal ve teknik açıdan çift yönlü çalışabilecek elemanlar haline getirmeyi hedefliyor. Katılımcılardan temel bilgisayar becerileri dışında herhangi bir teknik birikim beklenmiyor ve ''programlama'' değil ''betimleme'' üzerine kurulu içerik ve etkinliklerden oluşuyor.
1. Giriş: Web tasarımında modern ilkeler,
hedefler, sorunlar.
2. Bileşenler: Temel içerik (HTML) ve biçim
(CSS) kavramları ve öğeleri.
3. Semantik İçerik: HTML dilinin semantik
kullanımının önemi, standartlarda bu
yöndeki gelişmeler ve eğilimler.
4. Stil Kuralları: Stil kurallarının içerik
elemanlarıyla ilişkilendirilmesi.
5. Boyutlandırma: CSS kutu modeli,
elemanların boyutlarının, iç ve dış
boşluklarının ayarlanması. Değişken
boyutlar için tasarıma giriş (responsivedesign).
6. Mizanpaj: CSS dilinin sayfa yerleştirmeye
yönelik olarak sunduğu olanaklar (flexbox ve grid), ortam sorguları (media queries).
7. Yazı Tipleri: Yazı tiplerinin seçiminde ve
uygulanmasında kullanılabilecek yöntemler ve bunların karşılaştırılması,web yazı tipleri, sistem yazı tiplerine erişim.
8. Renk Modelleri: Bilgisayarda renklerin nasıl
modellendiği, değişik renk modellerinin
güçlü ve zayıf yönleri.
9. Resimler: Resim dosyası formatlarının
güçlü ve zayıf yönleriyle tanıtılması, WebP,
AVIF ve JPEG-XL gibi modern resim dosyası
formatları, HTML ve CSS dillerinde resim
dosyalarının değişik ekran boylarına göre
uygun ve etkin şekilde kullanımı.
10. Vektör Resimler: Vektör resim
formatlarının avantajları ve kullanım
alanları, SVG vektör resim formatı, HTML
ve CSS dillerinde kullanımı.
11. Erişilebilirlik: Engelli kullanıcılara yönelik
olarak tasarımda gözönüne alınması
gereken noktalar, ARIA standardı, karanlık
tema ve az hareket gibi kullanıcı tercihlerinin tasarımda desteklenmesi.
12. Stil Yönetimi: CSS kural öncelikleri,
tarayıcılar arasındaki farklılıklar ve bunların
giderilmesi (CSS resets), CSS değişkenleri
(custom properties).13. CSS Dilindeki Yenilikler: Yakın zamanda CSS diline eklenmiş özellikler (logical properties, container queries vs.)
14. CSS Araçları: Büyük CSS anaçatıları
(Bootstrap v.b.), hafif CSS anaçatıları, ikon
setleri, simge yazı tipleri, CSS işleyiciler (SASS).
15. Formlar: Kullanıcı etkileşimi için arayüz elemanları (metin kutuları, seçim kutuları,düğmeler vs.)
16. Örnek Tasarım Değerlendirmeleri ve Uygulamaları
17. Yayımlama: Site yayımlama seçenekleri,
seçeneklerin değerlendirme ölçütleri,
WordPress’in güçlü ve zayıf yanları, statik
site üreteçleri (Eleventy, Jekyll, Hugo v.b.),
içerik dağıtım ağları (CDN).
18. Statik Site Üretimi: Örnek bir statik site
üreteci, şablonlar, Markdown içerik dili.
19. Servisler: Dışarıdan kullanılabilecek
servisler (yorumlar, ziyaretçi istatistikleri,
formlar v.b.), servislerin değerlendirme
ölçütleri (ziyaretçi mahremiyeti v.b.).
20. JavaScript Seçenekleri: JavaScript’in gerekli
olduğu ve olmadığı noktalar, JavaScript
anaçatılarının karşılaştırılması (React, Angular, Vue, Next, Svelte, HTMX vs.)
21. HTMX: HTMX anaçatısının tanıtımı ve ufak
bir uygulama geliştirilmesi.
NOT: Grafik tasarımcılara yönelik bir eğitimdir.
Beşiktaş Yerleşkesi
