Final Project (Website)

Today I handed out the final website project. The PDF explains the various stages and deadlines for the project, along with a detailed process for building out HTML pages.

Wireframes

Today we’re looking at one of the last planning phases of a website, wireframes. We’ll learn how and why we build them, walk through an example, and then in lab each student will build a wireframe for the Ginger Restaurant site.

Dreamweaver Quiz

Today we are having a Dreamweaver Quiz to test all of your newly aquired skills: creating HTML documents, inserting images, typing text, and creating various forms of links. We’ll use supplied files to go with the quiz handout.

Creating Links in Dreamweaver

Today we are learning how to create Links in Dreamweaver. We will look at basic text links and image links between files within a website, external links to webpages in other sites, email links, links to files, named anchors used to link to areas on a single page, and image maps.

Document Info & Adding Content in Dreamweaver

Today we’re looking at some critical elements for your upcoming website. I’m showing you a sample Job Folder structure (based on how I approach web jobs) and how it relates to your site root folder. Then we’ll look at creating New HTML Documents and file DocTypes. Finally we’ll walk through inserting images and text in HTML files, as well as Meta Tags. All of this is summarized in the tutorial PDF.

Web File Structure & Dreamweaver Site Control

Today’s class showed how to organize the File/Folder Structure for a website on your local computer, which is mirrored on the webserver. I then introduced how to setup Site Control in Dreamweaver both for a new and an existing site. This allows Dreamweaver to manage your image and file linking for you.

Don’t forget that your three moodboards are due on Thursday, Feb. 26th! I’ll want your layered PSD files (copied to the file server).

Dreamweaver Interface

Today we are introducing the Dreamweaver Interface. Once we’ve covered that we’ll have a long lab time for you to work on your moodboards (due one week from today).

Internet File Types/File Naming Conventions

The attached PDF is a glossary of website related file types (XHTML, CSS, XML, DHTML, Javascript) as well as file naming conventions.

Design Do’s and Don’ts

I just came across a short series on Graphic Design Do’s and Don’ts for 2008 that is pretty entertaining, as well as having some real truths. Watch out for some of these overused techniques and elements. The series consists of:

1. Top 7 Most Overused Techniques and Elements in Graphic Design
2. Top 7 Most Overused Icons/Shapes in Graphic Design
3. Top 7 Fonts Used by Professionals in Graphic Design
4. Top 7 Most Overused Stock Images Used in Web Design
5. Top 7 Most Overused Concepts Used in Graphic & Web Design
6. Top 7 Most Overused Clichés in Logo Design

Not that I agree with everything in these lists, but I also found a few other interesting ones:

Typefaces no one gets fired for using

America’s Most Fonted: The 7 Worst Fonts

30 Fonts That All Designers Must Know & Should Own

Typobituaries

Site Maps

Today’s class will be on Site Maps. There are three primary items in web design that all use the name “site map”: a webpage that serves as a Table of Contents or Index for the site, a specific datafile utilized by Google and other search engines to crawl your site, and a planning tool (similar to a flowchart) showing a site’s pages. We’ll cover each of these.

A new lab/homework assignment is in the PDF above. You need to create a (flowchart style) site map for the supplied web link. This can be hand-drawn or created on the computer. We’ll also be continuing with the Moodboards assignment during lab.