Links to CSS Resources, Tutorials and Other Stuff

As long as this listing may be, I've cut out a lot of stuff. Most of these pages have links to additional CSS resources. Dig through the links on pages you find useful. Dig through the links on pages you don't find useful. The idea here is that these folks have already dug through a lot of pages and found the really good stuff. Of course, you can always go to Google and search for: (1) "css tutorial" (947,000 hits); or (2) "css" (13,100,000 hits), as I did just out of curiosity one rainy day.

And please remember that poorly constructed markup (HTML or XHTML) will often play havoc with your CSS. If you need help with your markup, some of the links on my Web references page may help. (Although that page is long past due for an update...after I finish this one.)

checkmark The check mark indicates either (1) sites that I personally have found very helpful or (2) sites that a lot of other folks involved with CSS often refer to.

Authoring Tools

  1. Cascading Style Sheets — A b-i-g list of "CSS Authoring Tools" from the W3C.
  2. Crimson Editor — Excellent text editor, and it's free! Lot's of features, including a macro tool and the ability to highlight specific parts of your code with different colors.
  3. CSS Authoring Tools — An extensive list from the W3C.
  4. JustStyle CSS Editor
  5. NoteTab — Text editor. This is the one I keep coming back to. Three versions: free, standard and pro. (You need the pro version to color your code.)
  6. Standards- Compliant Authoring Tools
  7. Style Master — Cascading Style Sheet (CSS) Editor
  8. Style Studio CSS Editor — "CSS Editor, css validator, css tutorial, style sheets tips and more!"
  9. TopStyle — CSS, XHTML and HTML editor.

For HTML authoring tools, check here.

back to top Back to Menu

Books

Check the "companion" Web sites for errata. On many of these books, you can also download code for the books' examples.

  1. Books — A list from the W3C.
  2. Briggs, Owen et. al., Cascading Style Sheets: Separating Content from Presentation, 2nd Edition, Apress, 2004 This new edition contains a separate chapter on styling tables. Companion Web site.
  3. Godin, Seth, The Big Red Fez, Fireside, 2001."How To Make Any Web Site Better." (No companion Web site that I could find.) — Web marketing is not my bag, so I haven't read this one. It has gotten very good reviews and is often mentioned on mailing lists when people ask for book recommendations.
  4. Krug, Steve, Don't Make Me Think: A Common Sense Approach to Web Usability, New Riders, 2000. Here's the author's Web site.
  5. Meyer, Eric A., Cascading Style Sheets: The Definitive Guide, 2nd Edition, O'Reilly, 2004. Just published. This is the one book to own if you own only one! (The first edition has been my "bible.") Companion Web site.
  6. Meyer, Eric A., Eric Meyer on CSS: Mastering the Language of Web Design, New Riders, 2003. Relatively expensive, full-color volume of various projects in which the author takes us step by step from raw HTML to finished CSS-styled page. Worth the price, but save it for later. Companion Web site.
  7. Meyer, Eric A., More Eric Meyer on CSS, New Riders, 2004. A sequel to the previously listed item. Companion Web site.
  8. Shafer, Dan, HTML Utopia: Designing Without Tables Using CSS, Sitepoint, 2003. A CSS "cookbook" with many examples. Very complete appendix listing CSS properties and values. (Unfortunately, the worst index I have ever seen in a professional, technical publication. As do many technical publications, the book has its own Web site. There is an "Errata" section. To my amazement, one year after its publication, there is nothing in this section. I have just begun this book and have found several errors, mostly in mislabeled figures. I list this book here, my negativity notwithstanding, because it has gotten good reviews and is mentioned positively on CSS mailing lists.) Companion Web site.
  9. Zeldman, Jeffrey, Designing With Web Standards, New Riders, 2003. Considered by many to be essential reading. Zeldman provides a keen insight into the need for Web standards. He also covers XHTML, CSS and the problems in dealing with today's browsers. Written with a sense of humor. Companion Web site.

back to topBack to Menu

Dealing with Internet Explorer

  1. CSS tests — Covers some of the Win/IE's CSS incompatibilities.
  2. "Escaping Margins" bug [#1]
  3. "Escaping Margins" bug [#2]
  4. Explorer 6 Duplicate Characters Bug
  5. Explorer Exposed! -- a roundup of bugs in IE's implementation of CSS
  6. Float: The Bugs (The IE float model)
  7. IE 5/Win: "moving" margins [#1]
  8. IE 5/Win: "moving" margins [#2]
  9. IE7/compatibility/ — "IE7 invokes a DHTML behavior to load and parse all style sheets into a form that Explorer can understand. You can then use most CSS2 selectors without having to resort to CSS hacks." I'm not sure I understand this well enough to explain. Take a look. Has gotten a lot of attention on mailing lists.
  10. Multiple IEs in Windows — The various Windows OSs will not let you install more than one version of Internet Explorer. But if you want to check your designs against other versions, this site will tell you how to install multiple versions of IE.
  11. Multiple versions of IE
  12. Multiple Versions of Internet Explorer [on one computer]
  13. Side-stepping IE
  14. Styling <abbr> in IE
  15. Toward a more standards compliant Internet Explorer
  16. XHTML and CSS: Testing Multiple Versions of Internet Explorer

back to topBack to Menu

Layout / Positioning

  1. 3 Column Layout — "any order, fixed-width or liquid flanking columns, liquid header, full-width footer, absolutely positioned"
  2. Advanced CSS Layouts – Step by Step
  3. Box model bugs — Very interesting page which demonstrates both Internet Explorer's incorrect rendering of the CSS box model and the importance of including the !DOCTYPE declaration to overcome this problem. This page (as I view it today) does not include the !DOCTYPE, and IE gets it wrong. Save the page on your system, add the !DOCTYPE declaration and IE's rendering is correct.
  4. Box Model Hack — Dealing with browsers which do not apply the CSS "box model" correctly.
  5. Colored boxes... — "...one method of building full CSS layouts....This article explains one method of building a full CSS layout from start to finish. The method, based on positioning colored boxes and testing across a range of browsers, can be used to build a wide range of full-CSS layouts."
  6. Containing Floats
  7. css crib sheet — "...quirky layout issues...This is an attempt to make the design process easier, and provide a quick reference to check when you run into trouble."
  8. CSS Floats, Part I
  9. CSS Floats, Part II
  10. CSS Layouts — "Practical CSS." This site intends "to stand on the shoulders" of CSS ZenGarden by providing an HTML template that anyone can style with CSS. "The CSS Zen Garden designs are wonderful, but you can't easily apply them to your own website. This functionality gap is what the Practical CSS project will try to fill."
  11. CSS layout techniques
  12. CSS Layout Techniques: for Fun and Profit — Two-, three- and four-column layouts. Links to tutorials and other resources.
  13. CSS Layout Templates
  14. CSS Page Layout Templates — "Free Site Templates"
  15. CSS Positioning — Often-recommended tutorial.
  16. CSS-Positioning — "How to build a Web site without tables."
  17. CSS Positioning, Part I
  18. CSS Positioning, Part II
  19. CSS TEMPLATES — text in German but useable examples with CSS code provided.
  20. Dead Centre — Center a "box" vertically on a page. The page contains an explanation of how this is done, but "View source" may add a little more.
  21. (Examples of CSS layouts) — "I built the following templates for use on dynamic web sites and portals. The CSS is very generic, object-oriented, and designed for database-driven applications." Layouts from simple to complex. To get at the code, you'll have to "View Source" and then dig through the various stylesheets. Worth the effort if any of these layouts are what you're looking for.
  22. Exploring the Limits of CSS Layout — Maybe the title should be "Exploring Some of the Limits..." This is a publisher's Web site, laden with ads and promotions. But the article is worth a read.
  23. Faux Columns — "[C]reate a layout with two equally tall columns when a unique background color is desired for each column." Useful technique to overcome the CSS limitation of making columns no taller than they need to be to contain their content.
  24. Flexible Layouts with CSS Positioning
  25. Flexible Layouts with CSS Positioning
  26. Floatutorial: Step by step CSS float tutorial." checkmark
  27. Layout-o-matic — Online tool to create CSS layouts. You can choose among four layouts: full- page; two-column, left sidebar; two-column, right sidebar; three-column. Other options. Download the HTML file with CSS code and HTML intact.
  28. The Layout Reservoir — Two- and three-column layouts.
  29. Little Boxes — Examples of sixteen layouts along with the CSS code that makes them work.
  30. NN4-compatible XHTML/CSS 3 column layouts — Netscape version 4.x presents many challenges to CSS coders because of its poor CSS implementation. It appears that there is a large enough Netscape 4 audience to warrant articles like this one, which treat one aspect of dealing with Netscape 4.x. (Netscape versions 6 and 7 are much more CSS compliant.)
  31. Page layout using CSS — "a very simple example." Links to other Web resources, as well.
  32. Piefecta – A superb 3-col tableless layout — Mind boggling!
  33. Positioning and the Cascade
  34. Practical CSS Layout Tips, Tricks, & Techniques — Use CSS instead of tables for layout. Also brief comments about the <abbr> and <acronym> tags.
  35. Source Ordered Columns — Three-column layout without (of course!) tables.
  36. A tableless, CSS-based, liquid, three-column layout
  37. vertical and horizontal centering
  38. WebDev - CSS Layout Templates
  39. Why tables for layout is stupid — "problems defined, solutions offered." Part editorial, part tutorial. Emphasizes the importance of "semantic" markup. Clever presentation with cartoons atop each page.
  40. XHTML CSS Layout Templates

back to topBack to Menu

Lots O' Links

  1. Byronsbyte Bookmarks
  2. Cool Tools: CSS — Links to non-CSS resources, as well.
  3. CSS, Accessibility and Standards Links
  4. Felix's Links to Web Authoring Topics
  5. Links Page — Comprehensive list of links to CSS resources. Links to other Web design topics at top of page.
  6. Links: Site_development/Style
  7. Web Design References: Cascading Style Sheets — A huge list of links!

back to topBack to Menu

Macintosh

  1. CodeBitch columns
  2. CSS tests — Addresses some CSS problems with IE/Mac.
  3. Explorer 5 Mac
  4. MacEdition CSS Guides — Support for CSS in various Mac browsers.
  5. Mac IE 5 – problems with css rendering
  6. PageSpinner — HTML editor with CSS support
  7. Taco HTML Edit

back to topBack to Menu

Mailing Lists and Forums

  1. Cascading Style Sheets Forum for Web Site Developers
  2. css-discuss.org checkmark — A very active mailing list where you can get help with CSS. Use this page to subscribe.
  3. css-discuss: last 40 messages — From the "css-discuss" mailing list. To dig more easily into the archives, you have to join this list. (Unfortunately, the "search archive" function is nearly useless.)
  4. css-foundations — Not much activity on this list, but there are knowledgeable people behind it.
  5. Discussion fora — from the W3C.
  6. WebDesign-L.com — Mailing list.
  7. Web Standards Group
  8. World Wide Web Mailing Lists — from the W3C.

back to topBack to Menu

Miscellaneous

The sites in this section are not less "resourceful" than those in the Resources section. Sometimes just hard to categorize.

  1. 99.9% of Websites Are Obsolete
  2. The Absolute Minimum... "...Every Software Developer Absolutely, Positively Must Know About Unicode and Character Sets (No Excuses!)" — Mostly for programmers, but there is info here useful to Web page authors.
  3. Accessibility Toolbar — The Accessibility Toolbar "is designed to help the user to interrogate aspects (structure/code/content) of an html document that can have an affect on the accessibility of that document."
  4. Bed and Breakfast markup (B&BR) — Improper use of the <b> and <br> tags instead of the correct CSS equivalents.
  5. Browser Tests of Entities in 2004 — Which character entities (codes to produce special characters, such as < or §) work in which browsers.
  6. Build User-Controlled Style Sheets for Greater Accessibility — This is a publisher's Web site, laden with ads and promotions. But the article is worth a read.
  7. CSS Demos — Very interesting demos, some of which don't work in IE/Win 6.
  8. css-edge — Examples of some very cool "experimental" CSS designs. Most of these demos will not work in IE6/Win. Get Mozilla.
  9. CSS Examples #2 — "Note: these are examples of artwork/layout/interactivity which I observed in other (non-web) media, and attempted to reconstruct using CSS."
  10. CSS Filters — Dealing with inconsistent browser support for CSS.
  11. CSS Play — "CSS Play is a collection of webpages that I have made that use Cascading Style Sheets to achieve some affect." Includes links to other CSS resources.
  12. CSS Quiz — A quiz on the basics.
  13. CSS signatures — A simple technique which makes it possible for anyone to save a page that contains a "CSS signature" and then style that page.
  14. CSS Sprites: Image Slicings Kiss of Death — For the graphic artist, or those with similar interests.
  15. CSS tests
  16. CSS Tests for Designers "These pages are designed to test css properties in semi-real applications, so that designers can actually see them in action in multiple browsers."
  17. CSS2 Test Suite: Prototypical Pages
  18. css Zen Garden – Design List checkmark — A collection of more than 250 CSS'd "versions" of the same HTML markup. Demonstrates very clearly that there is no one "right" or "best" way to design a page.
  19. css Zen Garden: The Beauty in CSS Design — If you want to submit a design to the Zen Garden, this is where you get the information you need.
  20. A Dao of Web Design — "Now is the time for the medium of the web to outgrow its origins in the printed page. Not to abandon so much wisdom and experience, but to chart its own course, where appropriate."
  21. Digital Web Magazine — "...web designer's online magazine..."
  22. Examples of sites that use CSS
  23. Felix's Annoy Demo — "How Not to Create a Web Page"
  24. How to help and get help online
  25. How to Hide CSS From Buggy Browsers
  26. Images, Tables, and Mysterious Gaps — Creative use of DOCTYPE to help legacy pages constructed with tables and images.
  27. It's the official Tracy Berna website! checkmark— Very talented lady. This home page does not use CSS, but the inner pages do — along with other design techniques. (Tracy assures me she's working to convert this page to CSS, as well. Just too busy to find the time right now.) But the absolute best site I have seen that combines simplicity, elegance and effective navigation. Just couldn't resist listing this site.
  28. Jeffrey Zeldman Presents the Daily Report — "web design news & info since 1995"
  29. liorean@web-graphics.com — Scripts and CSS "experiments."
  30. Lorem Ipsum - All the facts - Lipsum generator — Here's where you can get the text that many Web authors use for "Greeking" – the use of "temporary text" while you work on your site design.
  31. Lynx Viewer — Lynx is a text- only browser. Use this site to check your pages to be certain that your basic page design — minus CSS styling, minus graphics, minus colors — presents the information on your pages in a useable format. You can also download a copy of Lynx.
  32. Netscape DevEdge Redesigns As Standards Showcase — The Netscape team expounds on their goal of re-designing their DevEdge site to make it standards compliant. They didn't meet all their goals. Find out why.
  33. NCI's Accessibility Tutorial for Webmasters — "Section 508 is intended to ensure that people with disabilities have equal access to all information provided by federal agencies."
  34. New Media Matters — Articles on a variety of Web design topics.
  35. An Objective Look at Table Based vs. CSS Based Design — While acknowledging the values of CSS, this author says, in effect, "Not so fast!" when it comes to throwing out tables altogether for page layout. This site is a blog. If this article is not displayed when you get here, search the "Archive." The article's date is May 12, 2004.
  36. Picking a Rendering Mode — The importance of using "DOCTYPE."
  37. QuirksMode - for all your browser quirks — "[This site] contains more than 150 pages with CSS and JavaScript tips and tricks, and is one of the best sources on the WWW for studying and defeating browser incompatibilities."
  38. Retooling Slashdot with Web Standards — Description of the process used to transform the Slashdot home page, full of nested tables and non-semantic markup, into a standards-compliant, CSS- based product.
  39. revised image replacement
  40. Stopdesign | Overused Lists?
  41. Tricking Browsers and Hiding Styles
  42. Web Pages are not Printed on Paper — "Or how I gave up trying to 'control' web pages and discovered adaptability."
  43. Won't somebody please think of the gerbils? — "...some light reading on the fascinating subjects of syntax, semantics, structure, validation, CSS, accessibility, and markup."
  44. Workers of the Web, Evolt! — A potpourri of articles about various aspects of Web design.

back to topBack to Menu

Resources

Links in this category are often a potpourri of material. You may find: tutorials, links to other resources, links to software tools.........

  1. Advanced HTML, CSS and DHTML — Tutorials, scripts and other resources.
  2. A List Apart checkmark— Many articles by many different authors on just about any topic relating to Web site construction and design.
  3. Basic Tips.com — "Article and tips for Webmasters"
  4. Brainstorms and Raves — A potpourri of CSS information, articles and links. As an aid to accessibility, the author uses the HTML "accesskey" attribute and provides extensive commentary on its use.
  5. Cascading Style Sheets
  6. Cascading Style Sheets: Other Resources
  7. Code Style: CSS Style Guide Section — "The Code Style style guide section aims to make the [CSS] learning process a little easier by illuminating specific areas of CSS in detail."
  8. CSS — Eric Meyer: CSS
  9. CSS, Accessibility and Standards Links
  10. CSS Articles and Tutorials checkmark— A List Apart's CSS articles grouped by category.
  11. css-discuss: Front Page checkmark — Many brief articles on various CSS topics. This site is a wiki.
  12. CSShark answers Frequently Asked Questions — Much more than just a FAQ site. Lots of other useful resources.
  13. CSS HTML XHTML Reference Book — Companion Web site to the book. Several excellent resources here, including (X)HTML elements and attributes; CSS properties and values. But IE6/Win does not do a good job of rendering these pages. Get Mozilla.
  14. CSS Online Resources — from the W3C.
  15. CSS Panic Guide
  16. CSS Pointers Group — A whole bunch of CSS resources, including example pages, CSS code examples and articles on a variety of topics.
  17. CSS Resource Guide
  18. CSS Software, Resources, Learning checkmark — Commercial site (Westciv). But it almost seems that helping us learn is secondary to their selling efforts. Lots of free learning here.
  19. CSS Stylesheet Browser — "...allows you to...bring up a list of stylesheets used by the page. From this list you can view the code, open up the stylesheets with your registered CSS application, toggle whether they are enabled/disabled, change them and add in new stylesheets of your choice." Requires IE/Win 5 or above.
  20. CSS Tableless Sites checkmark — Links to 900 (as I type this) sites which use CSS. (This should keep you busy for a while.)
  21. [CSS] Tips — Be sure to look at the amazing (to me at least) "CSS House" demo. Sections on CSS, HTML, Photoshop and PHP.
  22. CSS Vault: The Web's CSS Site — Examples of many CSS-designed sites as well as numerous articles.
  23. css Zen Garden – Resource Guide
  24. DevGuru CSS2 – Index — Extensive listing of CSS properties, possible values and examples of code usage.
  25. Experimental Css design checkmark — "This is My quest to learn new and exciting ways to use CSS. I've taken up inventing designs but for which I have no idea how to implement them, other then showing them here."
  26. Guide to Cascading Style Sheets
  27. How To Create — "Teaching you how to create web pages....Teaching you how to produce web pages that everyone can use."
  28. HTML and CSS Tutorials, References, Articles and News
  29. HTML Help... — "...by the Web Design Group." Lots of useful tools here. The HTML and CSS validators are sometimes more helpful than those provided by the W3C.
  30. Index DOT CSS — "The Advanced CSS Reference"
  31. Links and Discussion... "About the Best CSS Resources Available on the Web"
  32. the noodle incident
  33. NYPL: Style Guide: CSS — A widely recognized resource from the New York Public Library.
  34. Paper? We don't need no stinking paper: Online resources
  35. /* Position Is Everything */ checkmark — "[W]e built this site to explain some obtuse CSS bugs in modern browsers, provide demo examples of interesting CSS behaviors, and show how to 'make it work' without using tables for layout purposes." Many excellent CSS resources here: Tutorials, articles, links.
  36. Protagonist Web Resources : XHTML/CSS/XML — Other resources available on the Web resources home page.
  37. Real World Style — "css layouts, tips, tricks, and techniques"
  38. SelectORacle — "English and Spanish translations of CSS3 selectors." Type in any selector and the "oracle" will explain it in plain language.
  39. SitePoint — "Empowering Web Developers Since 1997." Publisher's site, so lots of promotional material. But also a lot of tutorials and articles dealing with many different aspects of Web site creation.
  40. SitePoint Newsletters
  41. Style-sheets.com — A whole bunch of CSS resources, including an editor, validator, tutorial and many articles.
  42. W3C Core Styles — "The W3C Core Styles offer authors an easy way to start using style sheets without becoming designers. By adding a link in the head of your documents, a CSS browser will fetch the style sheet of your choice from W3C's server when it encounters your document. A non-CSS browser will display the HTML document like it always did."
  43. W3Schools Online Web Tutorials — Tutorials, quizzes, examples and reference pages. Covers many, many topics relating to Web site creation and design. Much too much to list here. Take a look.
  44. WebsiteTips.com — "Websitetips.com, an educational resource, provides CSS, HTML, and XHTML tutorials, graphics tutorials, articles, tips, information and resources to build or improve your Web site presence."
  45. Web Standards Group – Resources
  46. Web Style Sheets — The "Home Page" of the W3C's CSS section.
  47. Whitespace — Many articles on CSS, site design, programming, Web business...
  48. World Wide Web Consortium checkmark— The organization that publishes Web standards. Many resources here, from tutorials to mailing lists and newsletters to details of the various standards (e.g., HTML, CSS) the group promulgates.

back to topBack to Menu

Styling:

Frames

  1. Frames without frames — Don't let the unstyled introductory page deter you from digging into this.

back to topBack to Menu

Links

  1. CSS Links Styles
  2. CSS Uberlinks — Tutorial on CSS rollover links.
  3. Horizontal Menus— Instead of using {display: inline}, the author uses the float property to achieve this goal.
  4. Issues Arising From Arbitrary-Element Hover — I guess we could call this one "{:hover} is nice but think twice."
  5. Link Specificity — re: pseudo-class link selectors

back to topBack to Menu

Lists

  1. Listutorial: Step by step CSS list tutorial checkmark — "simple tutorials on CSS based lists." First of three tutorials on increasingly complex list creation.
  2. Taming Lists

back to topBack to Menu

for Print

  1. CSS Designs: Going to Print
  2. Print Different
  3. Print It Your Way

back to topBack to Menu

Site Navigation

  1. Mountaintop Corners — Rounding off the corners on navigation tabs.
  2. Rounding Tab Corners
  3. Simple CSS Tabs
  4. Sliding Doors of CSS — Styling navigation "tabs."
  5. Suckerfish Dropdowns — Drop-down menus. Deals with Internet Explorer's buggy CSS implementation.

back to topBack to Menu

Tables

  1. Advanced Tables Tutorial — Tables are for displaying tabular data. Here are some ideas for using CSS to style them.
  2. Creating Structured Tables
  3. CSS-TD — Tutorial on using CSS to style tables.

back to topBack to Menu

Words

  1. Felix's Own Web Authoring Topics & Tools — A bunch of pages devoted to the choices we can make in choosing font sizes for our pages.
  2. Font Size Intervals — "Toward a standard font size interval system" – Written with CCS1 in mind, but still worth reading for extensive discussion of font issues in Web design.
  3. Let Users Control Font Size (Alertbox Aug. 2002)
  4. What's Wrong With FONT?

back to topBack to Menu

Tutorials: General

  1. Abandon tables, simplify design with CSS — A brief overview of the advantages of CSS-based layout over table-based layout.
  2. Anthony's Cascading Style Sheets 2 Tutorial
  3. Complete CSS Guide — WestCiv
  4. CSS — "This is chapter 2 of the book Cascading Style Sheets, designing for the Web, by Håkon Wium Lie and Bert Bos (2nd edition, 1999, Addison Wesley, ISBN 0-201-59625-3)."
  5. CSS: An Introduction — "Beginner tutorials for CSS"
  6. CSS Examples checkmark — Online editor which allows you to change existing examples of CSS code and HTML markup and see the results immediately. Great tool for learning the basics.
  7. CSS from the Ground Up — This page contains parts ten thru twelve of this tutorial series. To get to the earlier installments and the introduction, use the links on the left side of the page. (The earlier segments don't contain links to the later segments.)
  8. CSS Tutorial — A lot of information, but also a lot of ads.
  9. CSS Tutorial Part II - Page 1 of 5
  10. CSS Tutorial Part II - Page 2 of 5
  11. CSS Tutorial Part II - Page 3 of 5
  12. CSS Tutorial Part II - Page 4 of 5
  13. CSS Tutorial Part II - Page 5 of 5
  14. CSS Tutorials — Several tutorials on various aspects of CSS. The author describes them as "beginner" or "intermediate" level.
  15. Dave Raggett's Introduction to CSS
  16. HTMLCenter – Tutorials - CSS
  17. Mulder's Stylesheets [CSS1] Tutorial
  18. Starting With HTML + CSS — from the W3C.
  19. Tutorials — CSS1, CSS2 and HTML4
  20. Web Building Tips — "This is a collection of tips about HTML, CSS, JavaScript, and other Web development and design issues."
  21. Westciv Self-paced Courses

back to topBack to Menu

Tutorials: Other Specific Topics

  1. Boxing with CSS, Part I: The Theory
  2. Boxing with CSS, Part II: No Margin For Error
  3. CSS-Based Separators — Creating a <hr> effect with using <hr>
  4. CSS shorthand properties – an introduction
  5. Drawing with CSS "How to Draw Simple Charts Using Basic CSS Elements"
  6. Exploring Footers
  7. Facts and Opinion About Fahrner Image Replacement — One of the issues with "image replacement" is accessibility through screen readers. Links on this page to several screen readers.
  8. Fast rollovers, no reload needed
  9. Fixing Your Site With the Right DOCTYPE
  10. Image replacement decision grid
  11. Making Alternate Style Sheets Work — Alternate stylesheets provide, well, alternate styles for your pages. You can make it possible for viewers to choose different font sizes, different colors, different...
  12. Navigation tstme — Three examples: (1) CSS rollovers; (2) Using {float} to create three columns; (3) rounded corners for your "boxes" — both with and without borders.
  13. Revised Image Replacement
  14. Rounded Corners — Rounded corners without using images: XHTML only.
  15. Selectutorial: CSS selectors checkmark
  16. Semantic Structure — Poorly constructed markup (HTML or XHTML) will often play havoc with your CSS. This page will give you some pointers.
  17. Simple CSS drop shadows
  18. Styling Form Widgets — Over-styling forms can compromise their usability.
  19. Styling <hr>
  20. Table designs based on CSS and DIV elements — The title should say "table-like" designs. The article describes a technique for using CSS to a layout that looks like it is done with <table>.
  21. A Touch of Class — Don't use CSS classes in places where valid semantic markup would do the trick.
  22. W3C buttons without images — This technique can be used to create many different kinds of buttons – not just W3C.
  23. Writing Efficient CSS — Just what it says: How to make your CSS code more efficient (i.e, smaller).

back to topBack to Menu

Validation

  1. CSSCheck — WDG's (Web Design Group) CSS validator. I find that this validator sometimes provides more help than the W3C validator when the code won't validate.
  2. W3C CSS Validation Service
  3. W3C Markup Validation Service — Check your HTML code.
  4. WDG HTML Validator — I find that this validator sometimes provides more help than the W3C validator when the file won't validate. (To validate files located on your computer, use this link.)

back to topBack to Menu

Web Standards

  1. Developing With Web Standards
  2. How to Read W3C Specs — Help in deciphering the World Wide Web Consortium's standards documents. (Don't leave home without it!)
  3. Index of the HTML 4 Attributes — Extensive details from the W3C. Look here to find out what's been deprecated.
  4. Index of the HTML 4 Elements — Extensive details from the W3C. Look here to find out what's been deprecated.
  5. The Learning Curve of Web Standards
  6. The Kit — Links to two documents and a Web standards glossary. One of the articles is a short Web standards "primer." The second article treats Web standards in more depth.
  7. redemption through standards
  8. A Roadmap to Standards — "[T]his is a comprehensive, informal, and somewhat long-winded roadmap for anyone who has heard about web standards, thinks they might want web standards, but doesn't know where to start."
  9. Semantic Coding
  10. Web standards. — "They're big, dumb, and they don't work. Yet, they persist. Why?"
  11. Web standards are not easy
  12. The Web Standards Project — "is a grassroots coalition fighting for standards that ensure simple, affordable access to web technologies for all." Often referred to as "WaSP."
  13. Web Standards Reference Links
  14. Web Standards Resources

back to topBack to Menu

Updated: June 15, 2004.