Photos to purchase

Places to find photos for web/etc.:

iStockPhoto.com
(many cool photos in their dollar bin)

http://fotolia.com

Web Designer Wall

Lots of great examples, blogs, etc. with lots of design ideas to check out!

(And this blog definitely needs some good design moves to improve it!!!)

Free images to use

Microsoft -- can't use in logo but ok otherwise.

www.dreamstime.com
-- royalty free images and a small free image section. They don't have a lot of free images (6 pages of fish), but their images are very cheap (under $10.00 for a big image).

http://us.fotolia.com/
-- royalty free images that you can download for $1.00. (check dreamstime first - they have some of the same images for less)

Resources:
http://desktoppub.about.com/od/freeclipart/Free_Clip_Art.htm

Logo design

Logo design resources:
http://justcreativedesign.com/2008/12/02/logo-design-resources/#inspiration

Before and After:
A very interesting site about web/logo/graphic design and ideas that can make a huge difference ("before" vs "after")...
http://www.mcwade.com/DesignTalk/

CSS Drop Down Menus

Browser Version Market Share
http://marketshare.hitslink.com/report.aspx?qprid=2
Click this link to see how many people are using different brands and versions of browsers. You may want to bookmark this one or add it to your favorites to keep up with trends.

Browser Version Trend
http://marketshare.hitslink.com/report.aspx?qprid=3
Speaking of trends, this page shows market share of browser brands and trends over time. This is another good candidate for your bookmarks or favorites.

CSSPlay List of Menus
http://www.cssplay.co.uk/menus/
Here you'll find a huge collection of pure CSS horizontal and vertical menus by Stu Nichols.

The Ultimate CSS Only Drop-down Menu
http://www.cssplay.co.uk/menus/final_drop.html
Click this link for Stu Nichols' ultimate horizontal drop-down menu example.

A Flyout Menu With Four Sublevels
http://www.cssplay.co.uk/menus/flyout_4level.html
Here's another complex example from the king of CSS menus, Stu Nichols.

CSS Drop-Down Menu Tutorial Code
http://www.tanfa.co.uk/css/examples/menu/
Check out these tutorials on creating vertical and horizontal menus.

How to Create a Drop-Down Menu in Dreamweaver
http://webdesign.about.com/od/dreamweaverhowtos/ig/Dreamweaver-Drop-Down-Menus/index.htm
This link offers an alternative approach to creating drop-down menus for Dreamweaver users.

Drop-Down, Flyout, Pop-Up Navigation Menus With CSS
http://websitetips.com/css/tutorials/menus/#popupnav
Click this link for a large collection of links to different methods of creating pure CSS menus and pop-ups.

Son of Suckerfish Dropdowns
http://www.htmldog.com/articles/suckerfish/dropdowns/
Still more drop-down menus from the folks at HTML Dog

CSS Lists and Navigation Bars

Listutorial
http://css.maxdesign.com.au/listutorial/index.htm
Click this link for many tutorials on working with lists. The navigation bar at the top is the first one shown in Chapter 1 of this lesson.

Turning a List Into a Navigation Bar
http://www.456bereastreet.com/archive/200501/turning_a_list_into_a_navigation_bar/
This link takes you to a site that shows the second navbar example in Chapter 1. The article also describes how the author created his navbar.

Wildly Useful Free Web Development Programs
http://c82.net/article.php?ID=19
I've included this link so you could try out the third navbar example from Chapter 1. However, the site doesn't contain any description of how the author created the navigation bar.

Standards and Accessibility - Navigation Lists
http://www.brucelawson.co.uk/index.php/2005/navigation-lists/
This page is the reason why most sites use unordered lists for navigation bars these days.

CSS Design: Taming Lists
http://alistapart.com/articles/taminglists/
Here you'll find a great tutorial on styling lists with CSS.

Links, Menus, Navigation, and Rollovers
http://websitetips.com/css/tutorials/menus/#csslists
There are links to many tutorials dealing with lists, menus, navigation, and rollovers on this site.

Setting the Current Menu State With CSS
http://www.456bereastreet.com/archive/200503/setting_the_current_menu_state_with_css/
Here's an alternative way to identify the current page in a navbar, using the "body" tag rather than a class inside the navbar.

Elastic Design
http://www.alistapart.com/articles/elastic/
You'll find a few tips and tricks for creating elastic layouts here.

Dynamic Drive CSS Library
http://www.dynamicdrive.com/style/
Here's where you'll find many sample navbars. Unfortunately, most aren't elastic. Many do nothing when you change the text size in your browser.

Professional Horizontal Series
http://www.cssplay.co.uk/menus/pro_horizontal.html#nogo
Use this link to discover some advanced horizontal navbars. The code is woefully complex and would be difficult to elasticize. You can really see the problems by pressing CTRL + + and CTRL + - while viewing the page in Firefox or a similar browser.

CSS Positioning

Pixel
http://en.wikipedia.org/wiki/Pixel
Click this link for Wikipedia's encyclopedic description of pixels.

Mountaintop Corners
http://www.alistapart.com/articles/mountaintop/
This page describes a simple method of rounding the corners of graphic images by coloring a few pixels at the corners.

Visual Formatting Model
http://www.w3.org/TR/CSS21/visuren.html
Here's the full scoop on CSS positioning and floats as defined in the official (and woefully technical) W3C specifications.

CSS Positioning: Static, Relative, Absolute, and Float
http://www.christian-web-masters.com/articles/web_CSS-positioning-tutorial__page_1.html
This page offers a quick tutorial on CSS positioning and floats.

Relatively Absolute
http://www.autisticcuckoo.net/archive.php?id=2004/12/07/relatively-absolute
This site has a brief but useful description of CSS positioning.

Learn CSS Positioning in Ten Steps
http://www.barelyfitz.com/screencast/html-training/css/positioning/
Here you'll find a quick tutorial on CSS positioning.

CSS Positioning
http://www.w3schools.com/css/css_positioning.asp
Try this site for more useful information on CSS positioning, including techniques for handling overflow content.

CSS Semantic Markup and Planning

Guide to Semantic Markup
http://www.blue-anvil.com/archives/guide-to-semantic-mark-up
Click this link for a quick, no-nonsense guide to semantic markup.

Semantics, HTML, XHTML, and Structure
http://brainstormsandraves.com/articles/semantics/structure/
Here's another page that provides a good overview of semantic markup and using the right tags in the right places.

Lorem Ipsum
http://en.wikipedia.org/wiki/Lorem_ipsum
This is Wikipedia's encyclopedic description of the history and purpose of Lorem ipsum text.

CSS Reference
http://www.javascriptkit.com/dhtmltutors/cssreference.shtml
Here's a very brief CSS Properties reference that has an Inherited column that tells whether or not the style is inherited by descendant elements in the document tree.

CSS Properties
http://comptechdoc.org/independent/web/html/guide/htmlcssprop.html
Here you'll find another brief CSS Properties reference that tells you which properties are inherited and which aren't.

CSS: Use Descendant Selectors
http://www.websiteoptimization.com/speed/tweak/descendant/
Click this link for tips on making the most of descendant selectors in your style rules.

Defining and Using Descendant Selectors
http://www.adobe.com/devnet/dreamweaver/articles/css_best_practices_pt6.html
This page covers creating and using descendant selectors in Dreamweaver.

Descendant Selectors
http://www.westciv.com/style_master/academy/css_tutorial/selectors/descendant_selectors.html
More useful information on using descendant selectors in your Web designs.

CSS: Group Selectors and Declarations
http://www.websiteoptimization.com/speed/tweak/grouping/
This site gives information on using multiple selectors in a style rule.

CSS Background Images and Floats

FloatTutorial
http://css.maxdesign.com.au/floatutorial/index.htm
Here is a great resource for anyone looking to get a better understanding of floats. You'll also find examples of using floats to display graphic images in a tabular format without using tables.

CSS Float Property
http://www.w3schools.com/css/pr_class_float.asp
You'll find a brief but useful description of the CSS float property along with some examples in this site.

Floats
http://www.w3.org/TR/CSS21/visuren.html#floats
Here's the full story on floats from the W3C.

**** Color Palette Generator ****
http://jrm.cc/color-palette-generator/index.php?image=rec%2Flandscape-07.jpg&steps=5
Do you already have a background image in mind for a site? Wondering exactly what colors it contains? Send the picture to this site to find out.

Genopal Online
http://genopal.com/online.php
If you're looking for a quick and easy way to find colors that go well together, make sure you check out this site.

CSS Background
http://www.w3schools.com/css/css_background.asp
Click this link for some great examples and reference materials on using background images.

CSS Background Image Guide - CSS tutorial
http://www.tutorialhero.com/tutorial-52-css_background_image_guide.php
Check this link out for a quick tutorial on using background images.

Background-image
http://webdesign.about.com/od/beginningcss/p/aacss7bg.htm
This page provides some good information on using background images.

Working With Background Images and CSS
http://www.adobe.com/devnet/dreamweaver/articles/css_bgimages.html
Here you'll find tips and techniques for using CSS background images in Dreamweaver 8.

Colors and Backgrounds
http://www.w3.org/TR/CSS21/colors.html#propdef-background-attachment
This link takes you to a W3C page of all the CSS properties concerning colors and background images.

CSS Layouts vs Tables

The Anatomy of a Large-Scale Hypertextual Web Search Engine
http://infolab.stanford.edu/~backrub/google.html
Click this link for an early paper on the design philosophies behind the Google search engine. It's a good example of how most pages looked in the early days of the Web when traditional HTML reigned supreme.


Web Page Layouts Shouldn't Use Tables
http://webdesign.about.com/od/layout/a/aa111102a.htm
This page sums up all the reasons why professional Web developers have stopped using tables for page layout.

Why Tables for Layout Is Stupid
http://www.hotdesign.com/seybold/
Here's a somewhat comic book-like approach explaining why using tables for page layout isn't such a good idea.

Lengths
http://www.w3.org/TR/CSS21/syndata.html#length-units
Here you'll find the W3C's explanation of the various units of measure. As is typical of W3C documentation, it's woefully terse and technical. But these are the facts, nonetheless.

Elastic Lawn
http://www.csszengarden.com/?cssfile=/063/063.css&page=0
This link is an example of an elastic layout. Change the text size with View > Text Size in Internet Explorer, or CTRL + + and CTRL + - in Firefox or Safari, and watch how everything scales to the current text size.

Tableless Layouts With Dreamweaver 8
http://www.adobe.com/devnet/dreamweaver/articles/tableless_layout_dw8.html
Here's a tutorial on creating tableless page layouts using Dreamweaver 8.

CSS Page Layout Basics
http://www.adobe.com/devnet/dreamweaver/articles/css_page_layout_basics.html
From Adobe and Dreamweaver, this page provides a tutorial on creating page layouts with div tags and floats.

Sample CSS Page Layouts
http://www.maxdesign.com.au/presentation/page_layouts/
Here you'll find some sample page layouts from Max Design. These all use div tags and floats.

CSS Layouts
http://www.dynamicdrive.com/style/layouts/category/C9/
This link takes you to still more sample page layouts from the folks at Dynamic Drive.

CSS Layout Techniques: For Fun and Profit
http://www.glish.com/css/
Here you'll find a quick overview of layout techniques with links to many additional resources.

CSS Tips and Tags

Selectutorial
http://css.maxdesign.com.au/selectutorial/
This link takes you to a wonderful tutorial on CSS selectors at Australia's Max Design Web site.

W3C Selectors
http://www.w3.org/TR/CSS21/selector.html
This is the official W3C page on CSS style rule selectors.

XHTML Reference
http://xhtml.com/en/xhtml/reference/
Here's a quick reference of XHTML tags.

CSS 2.1 Selectors
http://www.456bereastreet.com/archive/200509/css_21_selectors_part_1/
This is a good tutorial on CSS selectors.

Use Class With Semantics in Mind
http://www.w3.org/QA/Tips/goodclassnames
Click the link above for some excellent advice on naming style classes, straight from the folks who brought you CSS.

Span and Div
http://en.wikipedia.org/wiki/Span_and_div
This is a quick encyclopedia description of the "span" and "div" tags.

CSS Shorthand Properties
http://mezzoblue.com/css/cribsheet/
Here you'll find some good general tips and techniques for getting the most from CSS.

CSS Tips and Tricks, Part 1
http://www.456bereastreet.com/archive/200503/css_tips_and_tricks_part_1/
Here is a page of good general CSS tips and tricks. You'll find the link to Part 2 under "To be continued" at the end of the article.

Web Development Mistakes, Redux
http://www.456bereastreet.com/archive/200408/web_development_mistakes_redux/
As the title implies, this site covers the most common Web development mistakes and how to avoid them.

General CSS Standards

From Class 1 of an Intermediate XHTML/CSS Class

Cascading Style Sheets, Level 2 Revision 1
http://www.w3.org/TR/CSS21/cover.html
This link takes you to the World Wide Web Consortium's official documentation for CSS Level 2.1. This is the resource that defines what CSS 2.1 is and how it works. We'll be using CSS 2.1 throughout this course.

W3C CSS 2.1 Index
http://www.w3.org/TR/CSS21/indexlist.html
This link takes you to the complete index for the W3C's CSS 2.1 documentation. CSS properties are generally shown in single quotation marks like 'background', 'background-attachment', and so forth.

Cultured Codes' CSS 2.1 Properties Reference
http://www.culturedcode.com/css/reference.html
Here's a reference to CSS properties without all the jargon and technical details. This one is very compact. Click a section in the left column, then a property in the second column, to see facts in the Details column.

guiStuff CSS 2.1 Reference
http://www.guistuff.com/css/
Here you'll find yet another handy reference to CSS 2.1 properties.


HTML Dog CSS Properties
http://www.htmldog.com/reference/cssproperties/
Here's another quick reference to CSS properties.

CSS 2 Reference
http://www.w3schools.com/css/css_reference.asp
You guessed it: another online reference to CSS properties. Add all these CSS 2 references to your bookmarks or favorites, and you'll never again need to guess what's available or which values work with which properties. Just pick whichever one you like best as your favorite resource.

W3C Index of Elements
http://www.w3.org/TR/REC-html40/index/elements.html
Here's a page you'll probably want to add to your bookmarks or favorites. It provides a quick index to all HTML tags. Note that items with D in the Depr (Deprecated) column, or an L or F in the DTD column are either deprecated or on their way out in XHTML. So, you should avoid using those tags in your Web pages.

W3C Index of Attributes
http://www.w3.org/TR/REC-html40/index/attributes.html
Attributes are text you put in XHTML tags, like src= in an img tag. This page provides a quick reference to all of them. Again, those with a D, L, or F in the Depr. or DTD column are deprecated and best avoided.

Conformance: Requirements and Recommendationshttp://www.w3.org/TR/REC-html40/index/attributes.html
http://www.w3.org/TR/1998/WD-css2-19980128/conform.html
If you've ever wondered why so few Web developers seem to know about the document tree, check out this page at the W3C site. This is their official page on the matter.

12 Lessons for Those Afraid of CSS and Standards
http://www.alistapart.com/articles/12lessonsCSSandstandards
Click this link for some good advice on why making the switch from the old way of doing things to the new way is a good idea—despite the new learning curve.

First Post

I seem to be collecting all sorts of very cool web design tools and things to think about...

This is hopefully a way to keep it all sorted....