If you’re new to web design, here are some resources to get you started:
SOFTWARE
Adobe Dreamweaver is a web design and development software platform available in all campus labs, including the department’s G-26 computer lab.
For basic tutorials, see Adobe TV - Learn Dreamweaver
Tips:
—Encourage students to design their websites in “split view,” writing their own HTML and CSS in the coding window and watching how it renders visually in design window.
—If students are using a USB drive to host their local website files and designing on multiple computers, they will need to export their server settings as a Dreamweaver .ste file (details here).
Recommended Open Source alternatives include KompoZer and Aptana Studio.
HTML TUTORIALS
W3Schools - HTML5 Tutorial and Tag Reference
HTML Dog - HTML Beginner / Intermediate / Advanced
CSS TUTORIALS
W3Schools - CSS Tutorial and Examples
HTML Dog - CSS Beginner / Intermediate / Advanced
Tizag - CSS Tutorial
CODE VALIDATION
W3C - XHTML / HTML5 (experimental) Validation
W3C - CSS Validation
WEB FONTS AND COLORS
Typetester: an online application for comparison of the fonts for the screen
Color Picker: hexidecimal codes for web colors
Colors on the Web: color theory for web design, with a Color Wizard for matching
IMAGE OPTIMIZATION
How to Optimize JPEG Photos for the Web: Photoshop video tutorial
WORDPRESS CMS
As an alternative to “from-scratch” web design, the WordPress platform allows students to create a basic site for use in blogging exercises or as a portfolio of written and multimedia work using customizable templates.
The following tutorials offer a comprehensive overview of how to start your own WordPress site:
Sign up for WordPress Username (for multiple authors on a single class blog)
Sign up for WordPress Username and Blog (for individual student sites)