Web Design Basics

Fred Murhammer   •  

Homework

Check this page each week.

Week 1

Recommended Reading
Yale Web Style Manaul: PROCESS — Before you begin

Week 2

Assignment 1: Markup a text document with HMTL
The text can come from a document that you have written up or from any online source such as Wikipedia. The page should be at least the length of the winternesting.html page from our in-class exercises. It should have heads, body copy, and a list. Examples of text documents are your bio/resumé or a history on someone you admire, an article about a hobby or an activity that you enjoy, or a news feature of a project or cause. This text page can be a page that will be part of your final project website.

Be sure your name is on the HTML document like so: lastname-firstname-filename.html

Compress the file into a zip archive and then upload via canvas.

Optional Video Tutorial
Employing an HTML Editor's Color Coding

Week 3

Recommended Reading
Relative URLs

Week 4

Recommended Reading 
Developing a Website Specification

Week 5

Assignment 2: Basic Page Layout, Typesetting, and Linking Site Pages
Create a home page and two more HTML pages (can use the page you created for Assignment 1 as one of these pages). The home page should have content that introduces site visitors to your website. Place all pages into a well organized site folder. Add a navigational bar via a list to all of your pages. Write relative hyperlinks to connect all of your pages together. Connect each page to an external style sheet that provides a basic page layout and sets your site's typography. These pages can be pages that will be part of your final project website.

Be sure your name is on the site folder like so: lastname-firstname-sitefoldername.

Compress the site folder into a zip archive and then upload via canvas.

Week 6

Optional Video Tutorial
CSS Redundancies

Week 7

Optional Video Tutorial
Refined Image Searches and Downloading Images

Week 8

Assignment 3: Adding Images to HTML pages and External Links
Continuing from Assignment 2, add at least one image to two of your site's pages. You can insert as many images as you want. There should be one instance of aligning text with an image. There should also be two links to external websites. These pages can be pages that will be part of your final project website.

Be sure your name is on the site folder like so: lastname-firstname-sitefoldername.

Compress the site folder into a zip archive and then upload via canvas.

Week 9

Recommended Reading 
Site Diagrams: Mapping Your Website

Week 10

Recommended Reading
speckyboy: Wireframes
Wikipedia: Website Wireframes

Final Project
For this class and all the remaining classes student should bring their website project to class.

Week 11

Optional Video Tutorial
Embedding Videos from YouTube

Week 12

No outside work. Students should work on their Final Projects.

Week 13

Notice
Students need to bring their final project web site to the next class. Time will be set aside for students to work individuality on their project. The instructor will be available to help with any technical issues.

Week 14

Notice
Students' finished Final Projects are due in the next and final class. Remember your website must be uploaded to and accessible from a web server.