Information
Code | GZS328 |
Name | WEB DESIGN |
Term | 2024-2025 Academic Year |
Semester | 6. Semester |
Duration (T+A) | 1-2 (T-A) (17 Week) |
ECTS | 4 ECTS |
National Credit | 2 National Credit |
Teaching Language | Türkçe |
Level | Lisans Dersi |
Type | Normal |
Label | E Elective |
Mode of study | Yüz Yüze Öğretim |
Catalog Information Coordinator | Doç. Dr. SEVDA ÜNAL |
Course Instructor |
Doç. Dr. SEVDA ÜNAL
(A Group)
(Ins. in Charge)
|
Course Goal / Objective
The aim of the Web Design course is to provide students with the ability to create effective and user-friendly websites using the basic principles, tools and technologies of modern web design.
Course Content
Creating the structure of web pages with HTML, creating style and layout with CSS, adding interactivity with JavaScript, creating websites compatible with different devices with responsive design techniques, and applying accessibility and SEO principles will be covered.
Course Precondition
There are no prerequisites for the course.
Resources
Aydemir, M. (2009). Web tasarım rehberi. Kodlab.Balaban, Erkan. (2011) Web Tasarım Kılavuzu. İstanbul: Pusula Yayınları.
Notes
Duckett,Jon. (2011). HTML and CSS: Design and Build Websites. USA: John Wiley & Sons.
Course Learning Outcomes
Order | Course Learning Outcomes |
---|---|
LO01 | Designs web pages at a basic level through HTML and CSS. |
LO02 | Organises the pages visually. |
LO03 | Adds interactive elements (e.g. form validation, animations) to web pages with JavaScript. |
LO04 | Develops websites compatible with different devices using responsive design techniques. |
LO05 | Applies the principles of accessibility in web design. |
LO06 | Applies the basic principles of SEO (Search Engine Optimisation) to web pages. |
LO07 | Optimises search engines. |
LO08 | Uses the basic tools needed in web design (e.g. text editors, browser developer tools) effectively. |
LO09 | Web tasarım sürecinde karşılaşılan sorunlara çözüm üretir. |
Relation with Program Learning Outcome
Order | Type | Program Learning Outcomes | Level |
---|---|---|---|
PLO01 | Bilgi - Kuramsal, Olgusal | Defines the concepts and professional rules related to the profession and field of journalism. | |
PLO02 | Bilgi - Kuramsal, Olgusal | Defines news production, consumption and distribution processes, news sources, news / media text types. | |
PLO03 | Bilgi - Kuramsal, Olgusal | List the theories, models and approaches related to media and communication systems. | |
PLO04 | Bilgi - Kuramsal, Olgusal | Outlines the legal framework of journalism in Turkey and internationally, the legal rights of journalists, press professional principles, and ethical codes. | |
PLO05 | Beceriler - Bilişsel, Uygulamalı | Designs scientific research in the field of social sciences and humanities, especially communication and media. | |
PLO06 | Beceriler - Bilişsel, Uygulamalı | Compares traditional and new/digital communication technologies, computers and information systems. | 5 |
PLO07 | Beceriler - Bilişsel, Uygulamalı | Prepares written, visual and audio content for traditional and digital journalism/media environments. | 5 |
PLO08 | Beceriler - Bilişsel, Uygulamalı | Discusses the concepts/areas of society, culture and communication. | |
PLO09 | Beceriler - Bilişsel, Uygulamalı | Apply democratic rules, human rights and communication rights to promote social reconciliation and peace. | |
PLO10 | Yetkinlikler - Bağımsız Çalışabilme ve Sorumluluk Alabilme Yetkinliği | Supports individual and collective work in professional life. | 4 |
PLO11 | Yetkinlikler - Öğrenme Yetkinliği | Critically discusses the agenda and innovations of local, regional, national and international media with new perspectives. | |
PLO12 | Yetkinlikler - Öğrenme Yetkinliği | Examines traditional and digital media contents with critical approaches with media literacy competence. | 4 |
PLO13 | Yetkinlikler - Öğrenme Yetkinliği | Describe the professional, commercial and legal processes of journalism and media organizations, current and emerging business models. | |
PLO14 | Yetkinlikler - İletişim ve Sosyal Yetkinlik | Criticizes otherizing, discriminatory and hateful discourses in the media and society. | |
PLO15 | Yetkinlikler - İletişim ve Sosyal Yetkinlik | Through theoretical and practical knowledge, he/she supports decision-making mechanisms both in the media organization where he/she works and in the society where he/she lives. | |
PLO16 | Yetkinlikler - İletişim ve Sosyal Yetkinlik | Supports cultural, artistic and scientific activities related to the field. | |
PLO17 | Yetkinlikler - Alana Özgü Yetkinlik | Design solutions to problems in the functioning of journalism/media organizations. | |
PLO18 | Yetkinlikler - Alana Özgü Yetkinlik | Applies new generation journalism technologies. | 5 |
PLO19 | Yetkinlikler - Alana Özgü Yetkinlik | Performs duties such as press consultancy, communication coordination, press advisory, and communication management in various institutions and organizations. | |
PLO20 | Yetkinlikler - Alana Özgü Yetkinlik | Supports work and worker safety within the framework of laws and regulations. |
Week Plan
Week | Topic | Preparation | Methods |
---|---|---|---|
1 | Course content and resource presentation | Reading course information pack | Öğretim Yöntemleri: Soru-Cevap |
2 | Introduction to Web Design: Basic Concepts, Overview of Web Technologies | Doing a general research about web design and basic technologies. | Öğretim Yöntemleri: Anlatım, Soru-Cevap, Örnek Olay |
3 | HTML Basics: Tags, Structural Elements, Text Formatting | Reading about HTML basic tags. | Öğretim Yöntemleri: Alıştırma ve Uygulama, Anlatım |
4 | HTML: Lists, Tables, Forms | Preparation of preliminary work on HTML lists, tables and forms. | Öğretim Yöntemleri: Alıştırma ve Uygulama, Anlatım |
5 | CSS Basics: Selectors, Colours, Fonts, Box Model | Reading about the basic concepts of CSS. | Öğretim Yöntemleri: Alıştırma ve Uygulama, Anlatım |
6 | CSS : Flexbox, Grid Layout, Positioning | Preliminary study about Flexbox and Grid Layout. | Öğretim Yöntemleri: Alıştırma ve Uygulama, Bireysel Çalışma |
7 | Responsive Design: Media Queries, Mobile Compatible Design | Reading about responsive design principles. | Öğretim Yöntemleri: Gösterip Yaptırma |
8 | Mid-Term Exam | Review of all topics | Ölçme Yöntemleri: Yazılı Sınav |
9 | JavaScript Basics:Variables, Conditions, Loops, Functions | Preliminary study about the basic concepts of JavaScript. | Öğretim Yöntemleri: Alıştırma ve Uygulama, Anlatım |
10 | DOM Manipulation with JavaScript: Element Selection, Event Management | Reading about DOM and event management. | Öğretim Yöntemleri: Alıştırma ve Uygulama |
11 | Accessibility in Web Design: WAI-ARIA, Semantic HTML | Accessibility in Web Design: WAI-ARIA, Semantic HTML | Öğretim Yöntemleri: Anlatım, Grup Çalışması |
12 | SEO (Search Engine Optimisation): Basic Principles and Practices | Reading about the basic principles of SEO. | Öğretim Yöntemleri: Anlatım, Soru-Cevap, Gösterip Yaptırma |
13 | Web Design Tools: Text Editors | Preliminary study about web design tools. | Öğretim Yöntemleri: Alıştırma ve Uygulama |
14 | Web Design Tools: Browser Developer Tools | Preliminary study about web design tools. | Öğretim Yöntemleri: Alıştırma ve Uygulama |
15 | Project Development: A Complete Website Using HTML, CSS, JavaScript | Completion of the necessary research and planning for the project. | Öğretim Yöntemleri: Alıştırma ve Uygulama, Grup Çalışması |
16 | Term Exams | Final Project Presentations and Evaluation | Ölçme Yöntemleri: Proje / Tasarım |
17 | Term Exams | Final Project Presentations and Evaluation | Ölçme Yöntemleri: Proje / Tasarım |
Student Workload - ECTS
Works | Number | Time (Hour) | Workload (Hour) |
---|---|---|---|
Course Related Works | |||
Class Time (Exam weeks are excluded) | 14 | 3 | 42 |
Out of Class Study (Preliminary Work, Practice) | 14 | 3 | 42 |
Assesment Related Works | |||
Homeworks, Projects, Others | 0 | 0 | 0 |
Mid-term Exams (Written, Oral, etc.) | 1 | 7 | 7 |
Final Exam | 1 | 18 | 18 |
Total Workload (Hour) | 109 | ||
Total Workload / 25 (h) | 4,36 | ||
ECTS | 4 ECTS |