GİT423

Mimarlık ve Tasarım Fakültesi \ Görsel İletişim Tasarımı

3

6

Zorunlu

Türkçe

yok

Görsel İletişim Tasarımı Lisans Programı

Her öğrencinin bireysel olarak yürüteceği HTML ve CSS tabanlı görsel iletişim web tasarımı projesini geliştirmesi beklenir. Öğrencilerin kendi belirleyeceği konu bağlamında tasarladıkları web sitesin arayüz görsellerinin hazırlanması ve kodlarının yazılması beklenmektedir. Belirlenen süre içerisinde projeyi başarılı olarak tamamlayabilmek bu dersin gereksinimlerindendir.

1. Jennifer Niederst Robbins – Learning Web Design: A Beginner's Guide to HTML, CSS, JavaScript, and Web Graphics
2. Jon Duckett – HTML and CSS: Design and Build Websites
3. Jeffrey Zeldman – Designing with Web Standards
4. Ethan Marcotte – Responsive Web Design
5. Steve Krug – Don't Make Me Think: A Common Sense Approach to Web Usability
6. Dan Cederholm – CSS3 for Web Designers
7. Jeremy Keith – HTML5 for Web Designers
8. Rachel Andrew – The New CSS Layout
9. Vitaly Friedman – Smashing Book: Modern Web Design and Development
10. Luke Wroblewski – Mobile First

Web Tasarımı dersi, kullanıcı deneyimi (UX) ve arayüz tasarımı (UI) prensipleri doğrultusunda estetik ve işlevsel web siteleri oluşturmayı amaçlar. Öğrencilerin, görsel hiyerarşi, tipografi, renk kullanımı ve erişilebilirlik gibi temel tasarım unsurlarını öğrenerek, modern ve kullanıcı dostu web arayüzleri tasarlamaları hedeflenmektedir.

1. Web ortamının teknik altyapısını, tarayıcı dinamiklerini ve dijital medya formatlarının web üzerindeki çalışma prensiplerini kavrar.
2. Arayüz tasarımı (UI) ve web geliştirme süreçleri için gerekli endüstri standardı yazılımları ve araçları etkin kullanır.
3. Kullanıcı deneyimini (UX) merkeze alarak, estetik ve işlevsel web arayüzleri tasarlar.
4. Bir web sitesi projesini tel kafes (wireframe), bilgi mimarisi ve prototipleme aşamalarıyla planlayarak baştan sona yönetir.

*Aşağıdaki haftalık plan dersin yılı ve dönemine göre farklılık gösterebilir:
1. & 2. & 3. HAFTA
HTML KODLAMA STANDARTLARI
HTML & CSS ne demektir? Neden önemlidir?
Web sitelerinde HTML ve CSS altyapısı kullanım yöntemleri nelerdir?
Yazılım geliştirme editörleri ve kullanım yöntemleri
HTML Kodlama Standartları
HTML etiketleri ve kullanım özellikleri
HTML interaktif form kullanımları

4. HAFTA
ÖDEV
ÖDEV 1: SUNUM
HTML etiketleri ve özelliklerini kullanarak temel özelliklere sahip çok sayfalı bir web sitesi geliştiriniz. Geliştirme esnasında Visual Studio Code editörünün özelliklerinden yararlanılarak, uyumlu ek (plug-in) ile sunucu simülasyonundan faydalanınız.
HTML ödevleri minimum 3, maksimum 5 HTML sayfadan oluşmalıdır.
ÖDEV 2: HTML Site
HTML etiketlerini kullanarak font, renk seçimleri ile tablo etiketleri ile yerleşim temellerini kullanın. Sayfalar arasında geçiş yapmak için link verme etiklerinin özelliklerini inceleyiniz.
Sayfanızı fotoğraf, video ve vektörel öğelerle zenginleştiriniz.

5. HAFTA
ÖDEV 3: HTML ETİKETLERİ İLE YAPILACAK TEMEL WEB SİTESİNİN TAMAMLANMASI
Ödevler HTML dosyaları ve onlara bağlı görsel öğelerin olduğu bir klasörü sıkıştırarak E-Posta yoluyla gönderilmesi gerekmektedir.
CSS GİRİŞ
CSS Yazım Kuralları
Yorum Satırı Kullanımı
CSS Seçiciler (class, identity)
Stil tanıma öncelikleri
Shorthand kodlama standartları

6. HAFTA
CSS ÖZELLİKLERİ
Background kullanımı
Metin özellikleri
Font Özellikleri Kullanımı
Google Font entegrasyonu

7. HAFTA
CSS TASARIM ÖĞELERİ
Margin - Padding Kullanım
Outline tanımlamaları
İleri Düzey Font Özellikleri Kullanımı
Display Yöntemi
Position ve katman kullanımı

8. HAFTA
CSS ANİMASYON
Float - Clear Kullanımı
CSS Seçicileri ileri düzey kullanımı
Transition basit animasyon kullanımı
2D ve 3D Transform kullanım

9. HAFTA
CSS YERLEŞİM YÖNTEMLERİ
Flex Kullanımı
Prefix (Tarayıcı uyumluluğu) Kontrolleri
Grid Kullanımı

10. HAFTA
CSS CİHAZ ODAKLI TASARIM YÖNTEMLERİ
Responsive ve Adaptive cihaz odaklı tasarım mantıkları
ÖDEV 1: HTML ve CSS Site
Daha önce hazırlanmış olan HTML ödevinin öğrenilen CSS özellikleri ile beraber zenginleştirimesi. Ödevler minimum 3, maksimum 5 HTML sayfadan oluşmalıdır. CSS dosyası ayrı bir klasörde bulunmalıdır.

11. HAFTA
ÖDEV 2: HTML VE CSS ÖZELLİKLERİ KULLANILARAK YAPILACAK TEMEL WEB SİTESİNİN TAMAMLANMASI
Ödevler HTML dosyaları ve onlara bağlı görsel öğelerin olduğu bir klasörü sıkıştırarak E-Posta yoluyla gönderilmesi gerekmektedir.

12. HAFTA
FİNAL PROJESİ