Tuesday, March 17, 2009

Web Secrets: External CSS

Ever wondered what CSS is? It stands for Cascading Style Sheets. Now, you can have CSS embedded into your web site, but there are many reason's why you would want to keep the CSS external. Below are the reasons, as well as how to do it.

How External CSS works:
In the head of your site, you will need to link to the CSS file that you have created, or will be creating (link href="*your" rel="stylesheet" type="text/css) (just make sure you add the opening<> around the previous code)

When creating the CSS file here are some things to remember (this is not an exhaustive list of CSS by any means. Below are some great links to learning CSS and how to write it).
  1. #yourclassname: having a "#" symbol before a class name will only apply to an "id" of a tag ().
  2. .yourclassname: having a "." symbol before a class name will apply to the "class" of any tag(
  3. ).

    Reason 1: SEO
    When it comes to SEO, content is king. Because of this, you want as little as embedded code in your site as possible. Instead of having all of your styles listed out in the table or div tags (
    ), you can link to an external class (
    ).

    Reason 2: Makes web site 100000000% more manageable and consistant
    If you create your 10 page website, and realize you want all of your heading text to be a darker blue...what do you do? If you use embedded CSS, you have to open each file up, and make the change to each file individually.

    Howver, if you use an external CSS file, you will only have to make a change once, and in one location (the external CSS file), and BOOM (in honor of John Madden), your headings are all changed...


    Here are some links to some great sites that go into more depth on how to write CSS. Thanks!

    http://www.w3schools.com/css/
    http://htmlhelp.com/reference/css/structure.html

0 Comments:

Post a Comment

<< Home