Style Sheets
  Home arrow Style Sheets arrow The Power of CSS
Dev Articles Forums 
ADO.NET  
Apache  
ASP  
ASP.NET  
C#  
C++  
ColdFusion  
COM/COM+  
Delphi-Kylix  
Design Usability  
Development Cycles  
DHTML  
Embedded Tools  
Flash  
Graphic Design  
HTML  
IIS  
Interviews  
Java  
JavaScript  
MySQL  
Oracle  
Photoshop  
PHP  
Reviews  
Ruby-on-Rails  
SQL  
SQL Server  
Style Sheets  
VB.Net  
Visual Basic  
Web Authoring  
Web Services  
Web Standards  
XML  
Mobile Linux 
App Generation ROI 
IBM® developerWorks 
Weekly Newsletter
 
Developer Updates  
Free Website Content 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Write For Us Get Paid 
Request Media Kit
Contact Us 
Site Map 
Privacy Policy 
Support 
 USERNAME
 
 PASSWORD
 
 
  >>> SIGN UP!  
  Lost Password? 
STYLE SHEETS

The Power of CSS
By: Cliff Ritter
  • Search For More Articles!
  • Disclaimer
  • Author Terms
  • Rating: 4 stars4 stars4 stars4 stars4 stars / 8
    2004-04-27

    Table of Contents:
  • The Power of CSS
  • Your CSS Code
  • CSS - Above and Beyond
  • Final Notes

  • Rate this Article: Poor Best 
      ADD THIS ARTICLE TO:
      Del.ici.ous Digg
      Blink Simpy
      Google Spurl
      Y! MyWeb Furl
    Email Me Similar Content When Posted
    Add Developer Shed Article Feed To Your Site
    Email Article To Friend
    Print Version Of Article
    PDF Version Of Article
     
     
    ADVERTISEMENT


    The Power of CSS


    (Page 1 of 4 )

    CSS or cascading style sheets are used to create a set of styles that can be applied to your fonts, tables and most other attributes of your web page. These styles allow you to create a much cleaner, faster web page that search engines love and also makes life much easier on the designer when global changes to these styles need to be applied. It is also always critical to always keep in mind your target audience and the average Internet connection speed these users have. By using styles sheets to their full advantage, you can help keep your web page size down to a minimum.

    When you sit down to think about the sitemap and the navigational structure of your website, you should consider using cascading style sheets wherever possible. This includes everything from your text attributes to your table padding.  Each page you create should be tailored around one or two keyword phrases in order to maximize the relevancy of the content being displayed to the various Internet browsers surfing your website. Using this technique allows you to have a web page which, in the search engines spiders view, only contains html and keyword rich text.

    Let's use an example to illustrate the power and capability of cascading style sheets.

    Graphic Buttons with Rollover

    In the past we created rollover buttons using graphics programs like Adobe Photoshop and/or Macromedia Fireworks, and embedded them on our web page with all the unfriendly code that is needed for the rollover effect. The problem with doing this can be two-fold. First, search engines prefer text links because text is always optimal and you can also put your desired keywords in the text of the link, which can help boost your rankings. Images are also seen as inferior to html, since search engine spiders are not able to scan images as effectively as plain text. When you create navigation with graphical buttons, you lose out on both of these benefits and risk having some of your web pages not indexed by the search engine spiders. This is why well-optimized web pages have text links at the bottom of the page; text makes it easier for search engines to spider your site and compensate for the primary navigation menu.

    CSS allows you to create these buttons without having any images visible on your html code (which is where search engines spider). Furthermore, you can embed your desired keyword phrase(s) as the text for your links. Try these steps and you will see how easy it is to simulate the rollover button effect, how much more effective your web site will be for the desired targeted keywords and how much faster your web page will be to load.

    More Style Sheets Articles
    More By Cliff Ritter


     

    STYLE SHEETS ARTICLES

    - Using a Background Grid to Assist Web Page L...
    - Extending the Rule Of Thirds for Web Page La...
    - A Two-Column Web Page Layout Based on the Ru...
    - Using the Rule Of Thirds for Web Page Layout
    - Swapping Columns Using the Divine Ratio for ...
    - Using the Golden Ratio in Liquid Web Page De...
    - Fundamental Design Principles for Web Page L...
    - Pulling Web Page Elements with the Blueprint...
    - Pushing Web Page Columns with the Blueprint ...
    - Controlling Column Padding with the Blueprin...
    - Prepending Classes in the Blueprint CSS Fram...
    - Appending Grid Units with the Blueprint CSS ...
    - Changing Grid Units in the Blueprint CSS Fra...
    - The Blueprint CSS Framework
    - Building a Liquid Design with Evened Margins...







    © 2003-2009 by Developer Shed. All rights reserved. DS Cluster 4 Hosted by Hostway
    Stay green...Green IT