GİT423

Web Design

Faculty \ Department
School of Architecture and Design \ Visual Communication Design
Course Credit
ECTS Credit
Course Type
Instructional Language
3
6
Compulsory
Turkish
Prerequisites
yok
Programs that can take the course
Visual Communication Design
Course Description
In this course, each student is expected to individually develop a visual communication web design project using HTML and CSS. Students will select a topic of their choice, design the visual interface, and write the necessary code to build a functional website. Successfully completing the project within the given timeframe is a core requirement of the course.
Textbook and / or References
"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"
Course Objectives
This course aims to equip students with the knowledge and experience needed to digitally implement a visual communication design project. Through research, development, presentation, and adaptation for digital platforms, students will gain essential skills to design, develop, and present web-based visual communication projects.
Course Outcomes
1. Understands the technical infrastructure of the web environment, browser dynamics, and the working principles of digital media formats on the web.
2. Effectively uses industry-standard software and tools required for user interface (UI) design and web development processes.
3. Designs aesthetic and functional web interfaces by focusing on user experience (UX).
4. Plans and manages a website project from beginning to end through the stages of wireframing, information architecture, and prototyping.
Tentative Course Plan
*The following weekly plan may vary depending on the year and semester of the course:

WEEKS 1 & 2 & 3

HTML CODING STANDARDS

What do HTML and CSS mean? Why are they important?
What are the methods of using HTML and CSS infrastructure on websites?
Software development editors and methods of use
HTML coding standards
HTML tags and their usage features
Use of interactive HTML forms

WEEK 4

ASSIGNMENT

ASSIGNMENT 1: PRESENTATION

Develop a multi-page website with basic features by using HTML tags and their properties. During the development process, make use of the features of the Visual Studio Code editor and benefit from server simulation through a compatible plug-in.

HTML assignments must consist of a minimum of 3 and a maximum of 5 HTML pages.

ASSIGNMENT 2: HTML Website

Using HTML tags, apply font and color choices, and use table tags for the basics of layout. Examine the properties of link tags in order to navigate between pages.

Enrich your page with photographs, videos, and vector elements.

WEEK 5

ASSIGNMENT 3: COMPLETION OF THE BASIC WEBSITE TO BE CREATED WITH HTML TAGS

Assignments must be submitted by compressing the HTML files and the folder containing the related visual elements, and sending them via e-mail.

INTRODUCTION TO CSS

CSS syntax rules
Use of comments
CSS selectors: class and identity
Style priority rules
Shorthand coding standards

WEEK 6

CSS PROPERTIES

Use of backgrounds
Text properties
Use of font properties
Google Fonts integration

WEEK 7

CSS DESIGN ELEMENTS

Use of margin and padding
Outline definitions
Use of advanced font properties
Display method
Use of position and layers

WEEK 8

CSS ANIMATION

Use of float and clear
Advanced use of CSS selectors
Use of transition for simple animation
Use of 2D and 3D transform

WEEK 9

CSS LAYOUT METHODS

Use of Flex
Prefix controls for browser compatibility
Use of Grid

WEEK 10

CSS DEVICE-ORIENTED DESIGN METHODS

Responsive and adaptive device-oriented design principles

ASSIGNMENT 1: HTML and CSS Website

Enriching the previously prepared HTML assignment with the CSS properties learned in the course. Assignments must consist of a minimum of 3 and a maximum of 5 HTML pages. The CSS file must be located in a separate folder.

WEEK 11

ASSIGNMENT 2: COMPLETION OF THE BASIC WEBSITE TO BE CREATED USING HTML AND CSS PROPERTIES

Assignments must be submitted by compressing the HTML files and the folder containing the related visual elements, and sending them via e-mail.

WEEK 12

FINAL PROJECT
Tentative Assesment Methods
Activities Number Weight (%)
Course Attendance/Participation - -
Laboratory - -
Application - -
Homework 2 60%
Project 1 40%
Presentation - -
Field Work - -
Internship - -
Course Boards - -
Quiz - -
Midterm Exam - -
Final Exam - -
Total 100%

Tentative ECTS-Workload Table
Activities Number/Weeks Duration (Hours) Workload
Course Hours (first 6 weeks) 6 4 24
Course Hours (last 6 weeks) 6 4 24
Laboratory - - -
Application - - -
Homework 2 36 72
Project 1 48 48
Presentation - - -
Field Work - - -
Internship - - -
Course Boards - - -
Preparation for Quiz - - -
Preparation for Midterm Exam - - -
Final Exam - - -
Preparation for Final Exam - - -
Study Hours Out of Class (preliminary work, reinforcement, etc.) - - -
Total Workload 168
Total Workload / 30 168 / 30
ECTS Credits of the Course 6
Program Outcome **
1 2 3 4 5 6 7 8 9 10 11 12 13 14
Course Outcome
1
2
3
4