Kaan Uyar
  • Anasayfa
  • Özgeçmiş
  • Araştırma
  • Yayınlar
  • Dersler
  • english language selection, ingilizce dil secimi

MOD006 Web Tasarımı ve Programlama


Ders Tanımı

İnternet tarihi. Temel renk teorisi. Web grafikleri. Erişebilirlik. HyperText Markup Language (HTML). HTML5. Cascading Style Sheets (CSS). CSS3. Javascript. Sayfa düzenlemesi. Tasarım konuları. Uyumlu web tasarım.

Önkoşul: Çoklu ortam Dizgeleri, Programlama dersi

Hedefler
  • İnternetin tarihi ve temelleri hakkında bilgi vermek
  • HTML kodlama uygulamalarında kapsamlı bir ustalık kazandırmak
  • Basamaklı stil sayfası (CSS), Uyumlu Web Tasarım prensiplerini ve Javascript kullanımı öğretmek
  • Web sitesi tasarlama, geliştirme ve sürdürme aşamalarını öğretmek
Ders Çıktıları

Bu dersin sonunda öğrenci,

  1. bağlamsal faktörleri ve etik, mantıksal ve kültürel boyutları göz önünde bulundurarak mevcut web tabanlı teknolojileri keşfeder, değerlendirir, tartışır ve deneyim kazanır.
  2. tasarım ilkelerini; tipografi, renk, düzen, içerik, yapılandırma, gezinme ve erişilebilirlik kapsamında anlar ve uygular.
  3. yazılı, sözlü ve görsel iletişime yardımcı olmak amacıyla mevcut teknolojileri web sitesi tasarlama, kodlama, test etme, hata ayıklama, ve belgelemede kullanır.
  4. web sunucusu yönetimini anlar.
Değerlendirme Yöntemi
Ödevler 40%
Proje 60%
Kurallar/Uyarılar
  • Öğrenciler dersle ilgili mesajlarlarını/ödevlerini/vb. "ydu.mod006@gmail.com" eposta adresine göndermelidir.
  • Herhangi bir sebepten ödev zamanında teslim edemeyecekse benimle önceden görüşülmeli ya da mesajlaşmalıdır. İznim dahilinde olmadan zamanında teslim edilmeyen ödevler kabul edilmeyecektir.
  • Derse girmesinizde o derste işlenen konulardan ve verilen ödevlerden yine de sorumlusunuz.
  • Öğrenciler, sınıfta ve/veya internet ortamında yapılan duyuruları/değişiklikleri takip etmelidir. Sorumluluk öğrenciye aittir.
  • Kopya çekilmesi yasaktır.
  • Dönem sonunda ders notu, YDÜ Lisans Eğitim-Öğretim Yönetmeliği Madde 11'de belirtildiği şekilde belirlenir.
  • Üniversite'nin sunucuları ile bu sitedeki kaynaklara yönelik saldırılar kesinlikle yasaktır.
Kaynaklar

Ders Kitapları:

  • Morris T., Web Development and Design Foundations with HTML5, Global Edition, 8/E, Pearson, 2017
  • Connolly R., Hoar, R., Fundamentals of Web Development, Pearson, 2014.
  • Robbins J. N., Learning Web Design, A Beginner's Guide to (X)HTML, StyleSheets, and Web Graphics, 4th Edition, O'Reilly, 2012

Yardımcı Kitaplar:

  • Uğur Gelişken, A'dan Z'ye Yeni Nesil Tekniklerle Web Tasarımı ve Web Programlama Profesyonel Olmak İsteyenlere..., Level Kitap, 2016
  • Erol Mesut Gün, Her Yönüyle HTML, Kodlab, 2017
  • İbrahim Kavakli, Adim Adim SEO, Kodlab, 2016
  • Burak Tokak, Responsive Web Tasarımı ve Uygulamaları, Dikeyeksen, 2016
Ders Planı
Hafta Konu Okuma
1 Giriş (Introduction) Okunacaklar
   Morris, Chapter 1
   Robbins, Chapters: 1, 2, 3, 21, 22
   Connolly, Chapter 1
Bağlantılar
  • Web browsers
    • Mozilla Firefox
    • Chrome
    • Internet Explorer
    • Safari
    • Opera
    • WebbIE
  • Editors
    • Notepad++ (Windows only)
    • Vim (Window, MAC, Linux)
    • TextPad (Windows only)
    • Sublime Text (Window, MAC, Linux)
    • Coda by Panic (Macintosh only)
    • TextMate by MacroMates (Macintosh only)
    • BBEdit by Bare Bones Software (Macintosh only)
    • Dreamweaver
  • Image editing and drawing software
    • GIMP (Window, MAC, Linux)
    • Adobe Photoshop (Windows, MAC)
    • Adobe Fireworks (Windows, MAC)
    • Adobe Illustrator (Windows, MAC)
    • Pixelmator (Macintosh only)
    • Inkscape (Window, MAC, Linux)
    • Corel Paint Shop Pro Photo (Windows only)
  • File-transfer program (FTP)
    • Filezilla (Window, MAC, Linux)
    • WS_FTP (Windows only)
    • CuteFTP (Windows, MAC)
    • AceFTP (Windows only)
    • Transmit (Macintosh only)
    • Cyberduck (Windows, MAC)
    • Fetch (Macintosh only)
  • Accessibility
    • WAVE web evaluation tool
    • Colorblind Web Page Filter
    • Web Site Optimization
    • Basic Color Theory
    • Colors in Different Cultures
    • Desiging for the Color-Blind
    • Accessibility Color Wheel
    • How to Improve the Accessibility of Your Website
    •   Screen readers
    • BRLTTY
    • Emacspeak
    • NVDA
    • Orca
    • VoiceOver
  • Other useful links
    • w3schools
    • Responsinator
2 HTML genel bakış (HTML Basics) Felke-Morris, Chapter 2
Ödev #1 teslimi
3 CSS ile Renk ve Metin Yapılandırma (Configuring Color and Text with CSS) Felke-Morris, Chapter 3
Ödev #2 teslimi
4 Görsel Elemanlar ve Grafikler (Visual Elements and Graphics) Felke-Morris, Chapter 4
Ödev #3 teslimi
5 Web Tasarımı (Web Design) Felke-Morris, Chapter 5
Ödev #4 teslimi
Proje: Konu seçimi onayı
6 CSS ile Sayfa Düzeni (Page Layout with CSS) Felke-Morris, Chapter 6
Ödev #5 teslimi
Proje: Planlanma
7 Bağlantılar, Listeler ve Düzen hakkında daha fazla bilgi(More on Links, Lists, and Layout) Felke-Morris, Chapter 7
Ödev #6 teslimi
8 Ara Sınav Haftası / Ders yok Ödev #7 teslimi
Proje: web sayfasının mobil cihazlar için konfigürasyonu
9 Tablolar (Tables) Felke-Morris, Chapter 8
Ödev #8 teslimi
10 Formlar (Forms) Felke-Morris, Chapter 9
Ödev #9 teslimi
11 Web Sitesi Geliştirme (Web Site Development) Felke-Morris, Chapter 10
Proje: Güncelleme 1
12 Web Multimedya ve Etkileşim Web Multimedia and Interactivity Felke-Morris, Chapter 11
13 E-Ticarete Genel Bakış (E-Commerce Overview) Felke-Morris, Chapter 12
Ödev #10 teslimi
14 Web Geliştiricileri için Promosyon (Promotion for Web Developers) Felke-Morris, Chapter 13
15 JavaScript'e giriş, Dönem konularını gözden geçirme (Introduction to JavaScript, Review) Felke-Morris, Chapter 14
Proje: Güncelleme 2
16 Dönem Sonu Sınav Haftası/ Proje Sunumu  
  • Güncelleme: 19/02/2019