I am using Dreamweaver CS3. I put my home page through some seo tests, and was told that I had 6286 bytes of style sheet code which makes it harder for my site to be indexed, and that I should put my style sheet code in an external file. I am very new to this, and don't want to screw up. Could someone tell me how to do this?
Sure. Copy everything which is in between your <style> tags (but not --> or <-- if your program adds those-- HTML comments and code are illegal in CSS and shouldn't even be around <style> tags either) and put them in a text file (like Notepad, not Word). Call it whatever you want-- mypagestyles.css In the <head> part of your HTML page, you need to reference it. <head> <title>Title of the page</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="description" content="this page is filled with awesome" /> [b]<link rel="stylesheet" type="text/css" href="mypagestyles.css" />[/b] </head> <body>... Code (markup): (I used XHTML endings because I think dreambeaver likes to start with that-- if you're using an HTML4 doctype, remove the trailing slashes.) If you have any external javascripts (yes, they should also be external : ) then the general agreement is that they come after the links to the css styles. title, meta tags, style link tags, script link tags. If you intend to have other css sheets in the future (print, handheld), then you may want to add this to your sheet: <link rel="stylesheet" type="text/css" href="mypagestyles.css" media="screen, projection" /> This means when a browser is sending the page to a printer or a PDA or a cell phone, the stylesheet will not be sent along (or, the device will know it's not for it to use). This lets you write a print or handheld CSS without needing to undo all the styles in the main screen sheet. Make sure the path is correct. If you don't see your styles on your page, your path is wrong. I always set my CSS text document in the same folder as the HTML page.
Yes. Including the <style> tags themselves (although empty <style> tags wouldn't hurt anything). So, your HTML would look like the <head> I posted above... see, the opening <body> tag comes right afterwards, as should yours.
Arrg.. spoke too soon. I cleared my private data in firefox, and my styles were missing when I visited the page.
... Ok, so I'm an idiot... I forgot to upload my style sheet page. All is good. Thanks for all the help!
What's great about an external stylesheet is that now, if this page gets more pages and becomes a site, your CSS is loaded only once by your visitors, and they only have to load new HTML for each new page in your site that they visit. If you end up with 10 HTML pages, you can change something's colour or style in just one stylesheet. Part of why everyone says "use CSS". Enjoy : )