To fully utilize CSS as it was intended, you've got to transform your code. Use abbreviated class and id names , and shorthand properties and grouping to minimize style sheets. Substitute CSS-based layout and rollover techniques for old table-based layout and JavaScript/image rollovers. For smaller tables, style table, row, and cell backgrounds with CSS instead of bgcolor for speed and flexibility. While you are at it, raise your content's relevance by pushing your main content higher in your code, with the table trick or CSS layout techniques. Here's a brief list of what you learned in this chapter:

  • Use shorthand properties, grouping, and abbreviation to optimize your CSS.

  • Substitute CSS-based effects for JavaScript and images (rollovers).

  • Use the hover pseudo-class and styled links or lists to create CSS2 rollovers.

  • Use table-layout:fixed for tables when possible and colgroup and col for speed.

  • Use CSS to color data cells in tables (works in version 4+ browsers).

  • Use CSS layout and positioning control and XHTML to separate presentation from structure to shrink your code, make your layout flexible, and raise search engine relevance.

Further Reading
  • Cascading Style Sheets: The Definitive Guide by Eric Meyer (O'Reilly, 2000)A great introduction to CSS.

  • Eric Meyer on CSS by Eric Meyer (New Riders, 2002)Meyer demonstrates real-world CSS with 13 conversion projects.

  • A List Apart by Jeffery Zeldman, et al. ( A good source of standards-based how-to advice, including CSS.

  • Cascading Style Sheets, 1, 2, and 3, World Wide Web Consortium ( official CSS specifications.

  • The Web Standards Project by Jeffery Zeldman, et al. ( that they've convinced the browser manufacturers on standards, Zeldman and company have relaunched WaSP to sting the development tool makers .


Speed Up Your Site[c] Web Site Optimization
Speed Up Your Site[c] Web Site Optimization
ISBN: 596515081
Year: 2005
Pages: 135 © 2008-2017.
If you may any questions please contact us: