Web Design I -- IMED 1316/1416 -- Section 8501
Resources
Validators
Template for creating a new XHTML 1.0 Transitional HTML document:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>An XHTML 1.0 Transitional standard template</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
</head>
<body>
<!-- Your HTML content goes here -->
</body>
</html>
Template for creating a new XHTML 1.0 FRAMESET document:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>An XHTML 1.0 Frameset standard template</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
</head>
<frameset>
<!-- Your FRAMESET content here -->
</frameset>
</html>
FTP Information
Online File Storage
Running Apps from Portable Storage
The Instructor's Assignment Site
Greeking Source
Student Discounts on Software:
Web Page Design Software and HTML Editors
- Dreamweaver is the best overall WYSIWYG HTML editor. You may use Dreamweaver in "Code" mode for this course, but not in "Design" mode. Cost: About $200 at JourneyEd.com.
- HomeSite is probably the best HTML and CSS editor available. It is a text-only editor but it does have a "browse/preview" mode. Cost: About $100 at Adobe.com.
- HTML-Kit is a great full-featured editor with excellent search and tag-matching capabilities. It is a text-only editor but it does have a "browse/preview" mode. It is FREE.
- Notepad comes with every Windows XP installation. It is a very limited editor but it does a good job if you have none of the other text editors available. You can find it in the "All Programs", "Accessories" section of the main Start menu, or you can type Notepad into the "Run" box and press <Enter>.
FTP Clients
- CuteFTP Home is an excellent low-cost FTP client. Cost: About $40 at Globalscape.com.
- WS_FTP Home is also an excellent FTP Client. Cost: About $40 at ipswitch.com.
- Filezilla is another excellent FTP Client, and it is FREE! Make sure that you download the Filezilla Client, not the server.
- Fetch for Mac supports the FTPES protocol that the school server uses. It is free for students. You will need to apply at their site for an educational license.
Image-Editing Software and Image-Optimizing Services
- Photoshop is a premier, top-of-the-line image editor. The current version, CS3, is available for about $285 at JourneyEd.
- Mapedit is a very nice image map (hot-spot) editor. It creates HTML code that validates in the W3C's XHTML validator, even. It is available for $15.00 (after a 30-day free trial period) from http://www.boutell.com/mapedit/.
-
The GIMP is just as
powerful as PhotoShop and it is FREE! It also includes an image map
hot-spot editor.
Make sure you download the Installer for Windows 2000 and above. - Paint comes with every Windows XP installation. It is limited in much the same way that Notepad is limited as a text editor, but it does a decent job in a pinch! You can find it in the "All Programs", "Accessories" section of the main Start menu, or you can type Pbrush into the "Run" box and press <Enter>.
- IcoFX is a FREE, very nice ICON CREATOR application. The Help section of this application even tells you how you can use the icon file as a SHORTCUT ICON for your Web site.
-
One way to keep your page file size small is to optimize the images
on the page. You can use your graphics program to do the job, or
you can use some online services such as these to optimize GIF or
JPG images:
- http://www.spinwave.com (GIF and JPG Crunchers)
HTML Information and References
- W3Schools -- HTML reference
- W3Schools -- "Reserved Characters in HTML" page
- W3Schools -- "HTML Symbol Entities" page
- Blooberry -- HTML and CSS reference
- Blooberry -- Lists of Character Entities
- Project Cool -- HTML and CSS reference
- Practical Web Design Magazine
- JavaScript Color Table
- Blooberry's "Colors in HTML and CSS" page
- Color charts at www.visibone.com. I think their "pinwheel" chart is the most helpful, but look around yourself and see what you find!
- Lorem Ipsum generator
- MIME Types
Cascading Style Sheet Information and References
- W3Schools -- CSS Reference
- Blooberry -- CSS and HTML Reference
- Project Cool -- CSS and HTML Reference
- CSS Zen Garden -- Lots of style sheets to look at and learn from
- Web Designs Group's CSS Info
- W3C's Main CSS Page
- w3schools.com CSS Tutorial, Samples, and Reference
- CSS Editing tools
- CSS1 Spec
- CSS2 Spec
General Information
- Handy Hints
- My Fall 2007 class developed a "Good Design List" that includes a fairly comprehensive list of good things that you can do to make a good web site. This list is a positive response to the two "Does Your Web Site Suck?" checklists at the http://www.webpagesthatsuck.com/ web site.