http://www.volkside.com/tools/wirify/ Tool creates wireframes from any web page
http://www.volkside.com/articles/project-worksheet/ They also have a great project worksheet for clients [download RTF]
http://www.w3schools.com/html/html_doctype.a Explanation of doctypes
http://www.w3.org/QA/2002/04/valid-dtd-list.html Explanation of doctypes
http://www.alistapart.com/articles/doctype/ Explanation of doctypes. Old article, but still good info
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">OR
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">OR
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">OR
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
http://www.quirksmode.org/ Read about Quirks Mode
<html lang="en" >
OR
<html xml:lang="en" >
http://webdesign.about.com/od/localization/a/aa043007.htm Read about language declarations
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
This specifies the encoding of symbols and special characters [UTF-8 is the default]. The World Wide Web Consortium (W3C) highly recommends the use of UTF-8 wherever possible. UTF-8 can be used for all languages and is the recommended charset on the Internet.
http://www.webheadstart.org/xhtml/encoding/index.html Explains xhtml encoding in UT-8
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <!-- add the DOCTYPE --> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <!-- declare language[s] and xml name space -->
[use <html> ONLY if you are not including text that needs translation into another language] <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" / > <!-- declare character encoding ----> <title>Page Title Here <!-- add the page title --> <meta name="keywords" content="internationalization, language HTML, language XHTML, localization of Web pages, language of Web pages"> <!-- use key words for search engines--> <meta name="description" content="When you specify the language of your XHTML documents, you are making your Web pages more useful to many different applications. This article examines the W3C's Internationalization Best Practices, and gives suggestions for how to implement them in your HTML and XHTML documents."> <!-- describe content for search engines--> </head>
http://html.comsci.us/examples/blank.html Full list of examples of Doctypes for HTML and XHTML
http://www.quirksmode.org/css/quirksmode.html Quirks mode: how the browser displays a page if the DOC TYPE is missing
http://www.synergycons.com/Tutorials/xhtml2.asp XHTML file template
http://green-beast.com/blog/?p=109 Basics for a new CSS file [but we are using the zencss selectors]
http://jessey.net/simon/articles/003.html Visual example of the box model
http://css-tricks.com/the-css-box-model/ The box model
http://www.456bereastreet.com/archive/200612/internet_explorer_and_the_css_box_model/ CSS box model and differences between W3 and Internet Explorer box models
http://www.brainjar.com/css/positioning/ Guide to CSS positioning
http://css.maxdesign.com.au/listamatic/about-boxmodel.htm The IE box model and Doctype modes
http://www.maxdesign.com.au/presentation/process/index.htm This is the CSS page-building technique we will use this semester
http://www.brainjar.com/css/using/ Overview of CSS Style Sheets; including review of selectors
http://browsersize.googlelabs.com/ Google tool to analyze optimum browser sizes
http://www.colorschemer.com/blog/2007/07/24/140-named-colors/ 140 Named colors
http://www.bigbaer.com/reference/colors/named_colors.htm Named colors
http://www.somacon.com/cgi/colorchart.pl/hex colors Chart of hex colors
http://green-beast.com/blog/?p=199 Units of calculation in pixels, % and EMs
http://www.barelyfitz.com/screencast/html-training/css/positioning/ Tutorial on positioning
http://www.webdesignfromscratch.com/html-css/css-block-and-inline.php Block vs. Inline elements [div vs. span]
http://www.mattryall.net/blog/2008/08/css-layout-fundamentals-block-and-inline-boxes Block vs. Inline elements [div vs. span]
http://wd.onepotcooking.com/2009/07/15/class-3-block-vs-inline-elements Block vs. Inline tags
http://www.seifi.org/css/understanding-taming-collapsing-margins-in-css.html Block vs. inline boxes, collapsing margins
http://www.w3schools.com/css/pr_background-image.asp CSS background property
http://www.w3schools.com/css/css_background.asp CSS background property
http://www.webdesignerwall.com/tutorials/how-to-css-large-background/ Inserting large background images
http://css-tricks.com/nine-techniques-for-css-image-replacement/ List of Image Replacement techniques
http://www.mezzoblue.com/tests/revised-image-replacement/ List of Image Replacement techniques
http://css-discuss.incutio.com/?page=ImageReplacement See IMAGE REPLACEMENT; also a good general reference for positioning
http://www.w3.org/TR/css3-content/#inserting3 Image Replacement using the content tag in CSS3. Doesn't work in Firefox.
http://brucelawson.co.uk/tests/css3-image-replacement.htm Image Replacement using the content tag in CSS3. Doesn't work in Firefox.
http://my.opera.com/ODIN/blog/css-3-image-replacement Image Replacement using the content tag in CSS3. Doesn't work in Firefox.
http://www.sitepoint.com/article/image-replacement-state-scope/ Image Replacement technique using a little JS
http://particletree.com/features/css-rules-for-image-replacement/ Image Replacement technique also using a little JS
http://www.htmldog.com/examples/ List of properties for HTML and CSS; look at LAYOUT examples
http://blog.html.it/layoutgala/ 2 and 3-column layouts
http://www.dynamicdrive.com/style/layouts/category/C10/ various layouts
http://matthewjamestaylor.com/blog/perfect-2-column-left-menu.htm 2-column layouts [uses floats]
http://www.456bereastreet.com/lab/developing_with_web_standards/csslayout/2-col/ 2-column layouts [uses floats]
http://www.tjkdesign.com/articles/challenge/3cols/default.asp Negative Margin Layouts
http://css-tricks.com/snippets/css/font-stacks/ Code Snippets for CSS and HTML: quick find for addons [also see 'downloads' and 'videos']