GERİ DÖN
Ders Öğretim Planı
| Dersin Kodu | Dersin Adı | Dersin Türü | Yıl | Yarıyıl | AKTS | Kredi |
|---|---|---|---|---|---|---|
| OIAT104 | Web Tasarım | Ders | 1 | 2 | 4.00 | 3.00 |
Dersin Seviyesi
Önlisans
Dersin Sunulduğu Dil
Türkçe
Dersin Amacı
Bu dersin amacı, öğrencilere HTML, CSS, Bootstrap ve JavaScript bilgisi kazandırarak web teknolojilerinin temellerini öğretmek ve modern standartlara uygun web siteleri tasarlayabilmelerini sağlamaktır.
Dersi Veren Öğretim GörevlisiGörevlileri
Öğr. Gör. Büşra POLAT
Öğrenme Çıktıları
| 1 | Bu dersin sonunda öğrenciler web teknolojilerinin temel kavramlarını açıklar. |
| 2 | Bu dersin sonunda öğrenciler HTML ile semantik yapıda sayfalar oluştururlar. |
| 3 | Bu dersin sonunda öğrenciler CSS kullanarak web sayfalarını biçimlendirirler. |
| 4 | Bu dersin sonunda öğrenciler Bootstrap ile mobil uyumlu (responsive) tasarımlar geliştirirler. |
| 5 | Bu dersin sonunda öğrenciler JavaScript ile dinamik web sayfaları oluştururlar. |
| 6 | Bu dersin sonunda öğrenciler temel seviyede bir web sitesini baştan sona geliştirirler. |
Öğrenim Türü
Birinci Öğretim
Dersin Ön Koşulu Olan Dersler
Dersin ön koşulu bulunmamaktadır.
Ders İçin Önerilen Diğer Hususlar
-
Dersin İçeriği
Bu ders, HTML, CSS, Bootstrap ve JavaScript kullanarak temel web sitesi geliştirmeyi kapsamaktadır.
Haftalık Ayrıntılı Ders İçeriği
| Hafta | Teorik | Uygulama | [OgretimYontemVeTeknikleri] | [OnHazirlik] |
|---|---|---|---|---|
| 1 | Web teknolojilerine giriş, temel kavramlar | Basit web tarayıcı incelemesi, örnek gösterim | Anlatım, tartışma | |
| 2 | HTML’in yapısı, Temel etiketler | Basit HTML sayfası kodlama | Anlatım, Soru-cevap | |
| 3 | HTML ile semantik sayfalar | Semantik HTML sayfası oluşturma | Gösterip yaptırma, Soru-Cevap | |
| 4 | Formlar, tablolar ve çoklu sayfa yapısı | Form ve tablo içeren HTML sayfası oluşturma | Gösterip yaptırma, Soru-Cevap | |
| 5 | CSS’e giriş, seçiciler, renkler, metin biçimlendirme | Basit CSS örnekleri uygulama | Anlatım, Soru-Cevap | |
| 6 | CSS ile sayfa düzeni, kutu modeli | Kutu modeli kullanarak sayfa tasarımı | Gösterip yaptırma, Soru-Cevap | |
| 7 | CSS ile konumlandırma ve düzen (float, flex, grid) | Flexbox ve grid ile düzenleme uygulamaları | Anlatım, Soru-Cevap, uygulamalı gösterim | |
| 8 | CSS ile konumlandırma ve düzen (float, flex, grid) Bootstrap’e giriş | Flexbox ve grid ile düzenleme uygulamaları Bootstrap grid sistemi ile sayfa tasarımı | Anlatım, Soru-Cevap, uygulamalı gösterim | |
| 9 | Vize Sınavı | Bireysel değerlendirme | Yazılı sınav | HTML ve CSS konularını tekrar etme |
| 10 | Bootstrap ile responsive tasarımlar | Mobil uyumlu sayfa geliştirme | Gösterip yaptırma, Soru-Cevap | |
| 11 | Bootstrap ile responsive tasarımlar | Mobil uyumlu sayfa geliştirme | Gösterip yaptırma, Soru-Cevap | |
| 12 | JavaScript’e giriş, temel sözdizimi | Basit JS örnekleri | Anlatım, Soru-Cevap | |
| 13 | JavaScript ile etkileşimli öğeler ve dinamik web sayfaları | JS ile buton ve form uygulamaları | Gösterip yaptırma, Soru-Cevap | |
| 14 | Temel bir web sitesi projesi geliştirme | Proje geliştirme çalışması | Uygulamalı öğretim, bireysel danışmanlık | |
| 15 | Proje sunumları ve genel değerlendirme | Proje sunumu ve sınıf değerlendirmesi | Sunum, tartışma | |
| 16 | Final Sınavı | Bireysel değerlendirme | Yazılı sınav | HTML, CSS, Boostrap ve JS konularını tekrar etme |
Ders Kitabı Malzemesi Önerilen Kaynaklar
İleri Web Tasarım Teknikleri - Halil İbrahim Azak (KODLAB)
Planlanan Öğrenme Aktiviteleri ve Metodları
Anlatım (ders sunumu) -Uygulamalı laboratuvar çalışmaları -Kodlama egzersizleri -Proje tabanlı öğrenme -Grup çalışmaları ve tartışmalar -Ödev ve sunumlar
Değerlendirme
| Yarıyıl (Yıl) İçi Etkinlikleri | Adet | Değer |
|---|---|---|
| Ara Sınav | 1 | 60 |
| Proje Hazırlama | 1 | 40 |
| Toplam | 100 | |
| Yarıyıl (Yıl) Sonu Etkinlikleri | Adet | Değer |
| Final Sınavı | 1 | 100 |
| Toplam | 100 | |
| Yarıyıl (Yıl) İçi Etkinlikleri | 40 | |
| Yarıyıl (Yıl) Sonu Etkinlikleri | 60 | |
Staj Durumu
İş Yükü Hesaplaması
| Etkinlikler | Sayısı | Süresi (saat) | Toplam İş Yükü (saat) |
|---|---|---|---|
| Ara Sınav | 1 | 1 | 1 |
| Final Sınavı | 1 | 1 | 1 |
| Uygulama/Pratik | 1 | 40 | 40 |
| Proje Hazırlama | 2 | 10 | 20 |
| Ara Sınav İçin Bireysel Çalışma | 1 | 15 | 15 |
| Final Sınavı içiin Bireysel Çalışma | 1 | 20 | 20 |
| Toplam İş Yükü (saat) | 97 | ||
Program ve Öğrenme Çıktıları İlişkisi
| PÇ 1 | PÇ 2 | PÇ 3 | PÇ 4 | PÇ 5 | PÇ 6 | PÇ 7 | PÇ 8 | PÇ 9 | |
| ÖÇ 1 | 3 | 5 | 5 | 3 | 4 | 1 | 3 | 3 | 2 |
| ÖÇ 2 | 3 | 5 | 5 | 3 | 4 | 1 | 3 | 3 | 2 |
| ÖÇ 3 | 3 | 5 | 5 | 3 | 4 | 1 | 3 | 3 | 2 |
| ÖÇ 4 | 3 | 5 | 5 | 3 | 4 | 1 | 3 | 3 | 2 |
| ÖÇ 5 | 3 | 5 | 5 | 3 | 4 | 1 | 3 | 3 | 2 |
| ÖÇ 6 | 3 | 5 | 5 | 3 | 4 | 1 | 3 | 3 | 2 |
* Katkı Düzeyi : 1 Çok düşük 2 Düşük 3 Orta 4 Yüksek 5 Çok yüksek