| Kodu | Dersin Adı | Yarıyıl | Süresi(T+U) | Kredisi | AKTS Kredisi |
|---|---|---|---|---|---|
| YEM334 | WEB TASARIMI | 6 | 4 | 3 | 7 |
DERS BİLGİLERİ |
|
|---|---|
| Dersin Öğretim Dili : | Türkçe |
| Dersin Düzeyi | LİSANS, TYY: + 6.Düzey, EQF-LLL: 6.Düzey, QF-EHEA: 1.Düzey |
| Dersin Türü | Zorunlu |
| Dersin Veriliş Şekli | - |
| Dersin Koordinatörü | Doç.Dr. TAYLAN MARAL |
| Dersi Veren Öğretim Üyesi/Öğretim Görevlisi | |
| Ders Ön Koşulu | Yok |
AMAÇ VE İÇERİK |
|
|---|---|
| Amaç: | Bu dersin amacı; öğrencilerin HTML kodlarını çözümleyebilmelerini, web sitesi için gerekli temel program ve bilgileri öğrenebilmelerini, html ve CSS kodlarıyla kendi özgün web sitelerini tasarlayabilmelerini sağlamaktır. |
| İçerik: | Bu ders; web tasarım pratikleri, CSS ve HTML kodlama sistemleri ve güncel kodlama editörleriniin kullanımını içermektedir. |
DERSİN ÖĞRENME ÇIKTILARI (Öğrenciler, bu dersi başarı ile tamamladıklarında aşağıda belirtilen bilgi, beceri ve/veya yetkinlikleri gösterirler.) |
|---|
| Web tasarımının prensiplerini sıralayabilme |
| HTML ve CSS kodlama sistemi pratiklerini uygulayabilme |
| Kendi özgün web sitesini tasarlayabilme |
| Metin, ses, görüntü ve video dosyalarını web sitesinde kullanabilme |
HAFTALIK DERS KONULARI VE ÖNGÖRÜLEN HAZIRLIK ÇALIŞMALARI |
|||
|---|---|---|---|
| Hafta | Ön Hazırlık | Konular | Yöntem |
| 1 | Örnek hazırlama, Literatür Tarama | HTML'e giriş ve HTML kavramları. Temel HTML etiketleri-1 (Head, Body) | Anlatım-Uygulama, Tartışma |
| 2 | Örnek hazırlama, Literatür Tarama | Html geliştirme ortamının hazırlanması. Temel HTML Etiketleri-2 (Başlık, paragraf ve metin biçimlendirme) | Anlatım-Uygulama, Tartışma |
| 3 | Örnek hazırlama, Literatür Tarama | Temel HTML etiketleri-3 (Sıralı ve sırasız listeler, Iframe, link) | Anlatım-Uygulama, Tartışma |
| 4 | Örnek hazırlama, Literatür Tarama | Temel HTML etiketleri-4 (Images, Formlar) | Anlatım-Uygulama, Tartışma |
| 5 | Örnek hazırlama, Literatür Tarama | Temel HTML etiketleri-5 (Tablolar) | Anlatım-Uygulama, Tartışma |
| 6 | Örnek hazırlama, Literatür Tarama | Temel HTML etiketleri-6 (Div, span) CSS'e giriş ve temel CSS kavramları. CSS yazım türleri-1 (internal css ) | Anlatım-Uygulama, Tartışma |
| 7 | Örnek hazırlama, Literatür Tarama | CSS yazım türleri-2 (inline css) CSS yazım türleri-3 (external css) CSS Id ve Class yapısı. | Anlatım-Uygulama, Tartışma |
| 8 | - | ARA SINAV | - |
| 9 | Örnek hazırlama, Literatür Tarama | CSS seçiciler-1 (Attribute selectors) | Anlatım-Uygulama, Tartışma |
| 10 | Örnek hazırlama, Literatür Tarama | CSS seçiciler-2 (Group selectors) CSS seçiciler-3 (Pesudo selectors) | Anlatım-Uygulama, Tartışma |
| 11 | Örnek hazırlama, Literatür Tarama | CSS margin, padding, border, box sizing kavramları. | Anlatım-Uygulama, Tartışma |
| 12 | Örnek hazırlama, Literatür Tarama | CSS boz-shadow, transitions, position kavramları. CSS ve HTML ile açılır yatay menü uygulaması | Anlatım-Uygulama, Tartışma |
| 13 | Örnek hazırlama, Literatür Tarama | CSS text biçimlendirme. Javascript temel kavramları. Modern JavaScript Frameworkleri (JQuery-Angular-React) | Anlatım-Uygulama, Tartışma |
| 14 | Örnek hazırlama, Literatür Tarama | CSS ve HTML kodları ile web sitesi uygulaması | Anlatım-Uygulama, Tartışma |
| 15 | Örnek hazırlama, Literatür Tarama | CSS ve HTML kodları ile web sitesi uygulaması | Anlatım-Uygulama, Tartışma |
| 16 | - | FİNAL | - |
| 17 | - | FİNAL | - |
KAYNAKLAR |
|---|
| Duckett, Jon (2017). HTML-CSS-Web Siteleri Tasarlamak ve Oluşturmak (Çev. Hasan Dağ , Songül Varlı Albayrak). İstanbul: Nobel Yaşam |
| Canay, Özkan (2016). Web Tasarımı Ve Ön Yüz Web Teknolojileri. İstanbul: Değişim Yayınları. |
| Erdinç, Fahrettin. Yeni Başlayanlar için HTML5 & CSS3. Pusula Yayınları, Epub, Barkod: 1230003799161. |
| Mesut Gün, Erol Her Yönüyle HTML, Kodlab Yayınları,2017 |
ÖLÇME VE DEĞERLENDİRME |
|||
|---|---|---|---|
| Yarıyıl İçi Yapılan Çalışmaların Ölçme ve Değerlendirmesi | Etkinlik Sayısı | Katkı Yüzdesi | Açıklama |
| (0) Etkisiz | (1) En Düşük | (2) Düşük | (3) Orta | (4) İyi | (5) Çok İyi |
|---|---|---|---|---|---|
| 0 | 1 | 2 | 3 | 4 | 5 |
| KNOWLEDGE | |||||||
|---|---|---|---|---|---|---|---|
| Theoretical | |||||||
| Program Yeterlilikleri/Çıktıları | Katkı Düzeyi | ||||||
| 0 | 1 | 2 | 3 | 4 | 5 | ||
| 1 |
List the history of communication, mass media, communication theories and leading theorists.
|
0 | |||||
| 2 |
List the historical, social and cultural types of communication and explain the related concepts.
|
0 | |||||
| 3 |
Define the important points of the history and theories of communication through daily life practices and social life.
|
0 | |||||
| KNOWLEDGE | |||||||
|---|---|---|---|---|---|---|---|
| Factual | |||||||
| Program Yeterlilikleri/Çıktıları | Katkı Düzeyi | ||||||
| 0 | 1 | 2 | 3 | 4 | 5 | ||
| 1 |
Compare the traditional media and new media economic policies.
|
1 | |||||
| 2 |
Interpret digital culture with constantly updated and self-renewing topics.
|
1 | |||||
| 3 |
Interpret the technical, socio-political and legal aspects of cyber security issues in the field of new media.
|
1 | |||||
| SKILLS | |||||||
|---|---|---|---|---|---|---|---|
| Cognitive | |||||||
| Program Yeterlilikleri/Çıktıları | Katkı Düzeyi | ||||||
| 0 | 1 | 2 | 3 | 4 | 5 | ||
| 1 |
Define the basic concepts of communication history, communication theories, traditional and new media channels.
|
2 | |||||
| SKILLS | |||||||
|---|---|---|---|---|---|---|---|
| Practical | |||||||
| Program Yeterlilikleri/Çıktıları | Katkı Düzeyi | ||||||
| 0 | 1 | 2 | 3 | 4 | 5 | ||
| 1 |
Prepare web pages with CSS codes.
|
5 | |||||
| 2 |
Produce creative content in new media environments, create an image and sound and practical studies about programming.
|
5 | |||||
| 3 |
Analyze the sub-texts and their semantics of the studies presented to the society by mass media.
|
2 | |||||
| 4 |
Use qualitative and quantitative elements to construct arguments on studies in the field of communication.
|
1 | |||||
| OCCUPATIONAL | |||||||
|---|---|---|---|---|---|---|---|
| Autonomy & Responsibility | |||||||
| Program Yeterlilikleri/Çıktıları | Katkı Düzeyi | ||||||
| 0 | 1 | 2 | 3 | 4 | 5 | ||
| 1 |
Manage social media accounts of brands, corporate firms and public institutions thanks to its advanced knowledge in content production and user experience.
|
4 | |||||
| OCCUPATIONAL | |||||||
|---|---|---|---|---|---|---|---|
| Learning to Learn | |||||||
| Program Yeterlilikleri/Çıktıları | Katkı Düzeyi | ||||||
| 0 | 1 | 2 | 3 | 4 | 5 | ||
| 1 |
Review local and foreign studies in the field of New Media.
Creates innovative works in his/her field.
|
3 | |||||
| 2 |
Criticize the effects of social media activities on socio-political field.
|
1 | |||||
| OCCUPATIONAL | |||||||
|---|---|---|---|---|---|---|---|
| Communication & Social | |||||||
| Program Yeterlilikleri/Çıktıları | Katkı Düzeyi | ||||||
| 0 | 1 | 2 | 3 | 4 | 5 | ||
| 1 |
Plan scientific studies in any area that can be encountered in different disciplines and transfer them to people from different disciplines.
|
3 | |||||
| 2 |
Determine how much of the content produced by the media is right and wrong.
|
3 | |||||
| OCCUPATIONAL | |||||||
|---|---|---|---|---|---|---|---|
| Occupational and/or Vocational | |||||||
| Program Yeterlilikleri/Çıktıları | Katkı Düzeyi | ||||||
| 0 | 1 | 2 | 3 | 4 | 5 | ||
| 1 |
Follows the developments that have begun to guide the present and the future such as "Software".
Produce various software products for different sectors.
|
4 | |||||
| 2 |
Design using new architectures of big data processing systems.
|
4 | |||||
| 3 |
Determine the logic of operation of artificial intelligence algorithms and determines the possible effects on media and indirectly society.
|
3 | |||||
DERSİN İŞ YÜKÜ VE AKTS KREDİSİ |
|||
|---|---|---|---|
| Öğrenme-Öğretme Etkinlikleri İş Yükü | |||
| Öğrenme-Öğretme Etkinlikleri | Etkinlik(hafta sayısı) | Süresi(saat sayısı) | Toplam İş Yükü |
| Ders | 14 | 3 | 42 |
| Derse Ön Hazırlık ve Ders Sonrası Pekiştirme | 13 | 6 | 78 |
| Arazi Çalışması | 0 | 0 | 0 |
| Grup Çalışması / Ödevi | 0 | 0 | 0 |
| Laboratuvar | 0 | 0 | 0 |
| Okuma | 0 | 0 | 0 |
| Ödev | 0 | 0 | 0 |
| Proje Hazırlama | 0 | 0 | 0 |
| Seminer | 0 | 0 | 0 |
| Staj | 0 | 0 | 0 |
| Teknik Gezi | 0 | 0 | 0 |
| Web Tab. Öğrenme | 0 | 0 | 0 |
| Uygulama | 0 | 0 | 0 |
| Yerinde Uygulama | 0 | 0 | 0 |
| Mesleki Faaliyet | 0 | 0 | 0 |
| Sosyal Faaliyet | 0 | 0 | 0 |
| Tez Hazırlama | 0 | 0 | 0 |
| Alan Çalışması | 0 | 0 | 0 |
| Rapor Yazma | 0 | 0 | 0 |
| Final Sınavı | 1 | 1 | 1 |
| Final Sınavı Hazırlığı | 1 | 40 | 40 |
| Ara Sınav | 1 | 1 | 1 |
| Ara Sınav Hazırlığı | 1 | 20 | 20 |
| Kısa Sınav | 0 | 0 | 0 |
| Kısa Sınav Hazırlığı | 0 | 0 | 0 |
| TOPLAM | 31 | 0 | 182 |
| Genel Toplam | 182 | ||
| Toplam İş Yükü / 25.5 | 7,1 | ||
| Dersin AKTS(ECTS) Kredisi | 7,0 |