COURSE OUTLINE

*subject to change

Textbooks

HTML & CSS Guidebook by Josiah Spence (free online resource)

https://htmlandcssguidebook.com/

COURSE DESCRIPTION

Catalog Description:

WECM description: Instruction in web page design and related graphic design issues including markup languages, websites, and browsers.

VisCom description: Instruction in designing and building websites, essential HTML5 and CSS3, responsive design, and related visual design and web content issues.

Course Prerequisites:

There are no prerequisite courses.

Students enrolled in this course should have general familiarity with their computer and its operating system, including how to efficiently use the mouse, standard menus, and keyboard commands, as well as how to use the file system to create and edit files and folders.

Students should be ready to work at a fast pace during the 10-week summer session. 

COURSE RATIONALE/OBJECTIVES

Instruction in best practices for building responsive websites that adapt to different devices and user behaviors. Responsive design topics to be covered include: HTML5; CSS3; semantic HTML; code frameworks; designing with fluid grids; creating layouts which incorporate typography and fluid media; using CSS media queries; responsive web typography; color; templates; hosting; web apps; web services. Students are then prepared to 1) evaluate whether or not responsive web design is a viable career option for them, and 2) pursue more advanced study in web, interaction, and UX design if they choose to do so.

COURSE SNAPSHOT

In this class you’ll learn how to code HTML and CSS, the coding languages used to create web pages. I focus on best practices for structuring the content of your webpages with HTML and then styling the content with CSS.

Once you have the basics under your belt, you'll move on to real-world page layout. You’ll learn text and link styles, centered page layout, background images, CSS-based navigation, forms, uploading files via FTP, and much more. I will provide you with content and prepared images for use in these projects but this training will give you hands-on practice coding websites from scratch all the way through uploading them to make them live.

What you’ll learn to do by the end of this course:

• Coding Basics: HTML Syntax

• Creating Links: Text, Images, Email, & Named Anchors

• Adding Images

• Cascading Style Sheets (CSS)

• Div Tag & Basic Page Formatting

• Using Browser Developer Tools

• HTML5 Semantic Elements

• Fluid Layout & Max-Width

• Real World Layouts

• The Box Model

• Floats & Images

• Styling Links

• Styling the Navigation

• HTML & CSS Wireframe

• CSS Background Images

• Google Fonts

• CSS Buttons & Floats

• Hi-Res Images

• Uploading to a Live Website via FTP

• Form Basics