CSS in head or separate CSS file?

They have: 105 posts

Joined: Mar 2006

Hi,

Please can someone explain the following?

I have a basic webpage and want to use CSS to set the color for text, tables etc does having a separate CSS file (and include on all of the pages) do the same as having CSS defined at the top of every page?

Drew,

Megan's picture

She has: 11,421 posts

Joined: Jun 1999

Yes and no. The big difference is that with an external CSS file you can include it into any page you want. This way you don't have to repeat the same code on every page. The problem with CSS in the is that whenever you make a change you have to change it on every page that code is on. With an external CSS file you only have to make the change once.

CSS in the is sometimes appropriate for things that only appear on that paritcular page.

robfenn's picture

He has: 471 posts

Joined: Jun 2005

Having CSS in the HTML also means your SEO friendly copy is way down. If you have hundreds of lines of CSS would it affect your site's ranking i wonder?

Supposedly if you have too much code search engines start to find content less relevant. Also, text nearer the top is considered more relevant... it's whether the search engines are clever enough to instantly skip the CSS and not punish you for it.

He has: 629 posts

Joined: May 2007

More advantages of a global CSS file, linked instead of embedded in the HTML:

- The CSS is downloaded once, with the first page. Therafter, the browser reads it from the cache, making the pages load faster;
- When you want to change, say, the background image in the header, you do it in one place only - in the CSS file.

Of course, this does not mean you can't put some CSS in the web page as well - if you have one page that needs a different background, for example. Although you can even get around that: give the BODY tag a class name or ID and then you can add a selector that starts with this class name or ID to target that one page.

If this is too much information, do ask again for clarification.

Cordially, David
--
delete from internet where user_agent="MSIE" and version < 8;

They have: 29 posts

Joined: Oct 2007

drew22299;225247 wrote: Hi,

Please can someone explain the following?

I have a basic webpage and want to use CSS to set the color for text, tables etc does having a separate CSS file (and include on all of the pages) do the same as having CSS defined at the top of every page?

Drew,

I suggest you must have CSS on the external page, better search engine crawlability and cleaner source code

Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.