Switch From HTML to CSS

Information on transfering website design from html to css

[SEOPimp]

Hi Everyone,
I manage a website that has been ranking decently on Google for over 3 years. The orginial (and current) design of the site is very poor. It is definitely not the favorite site to be crawled by the robots and I am thinking of switching my code to css in order to make everything cleaner, easier to manage, and potentially increase my rankings.
I am targeting an extremely popular keyword and we have dropped to the second page over the last month.

Do you think that a change to CSS from the old HTML would be helpful? Also is it best to change everything at once, or publish one section at a time?
Thank you for all your help.

[jd01]

As far as SE rankings go, it may or may not be directly beneficial.

I think the largest benefit is the indirect effect this type of change may have on the overall 'value' of the site.

I think by switching to css you gain a few advantages:
1. Generally, the code is much shorter / cleaner, which will do two things:
A. Help the site to load faster. You might look into calling some graphics from the style sheet while loading others from the html.
B. Change the 'code to visible text' ratio of the site, which may be beneficial to some extent for search engine rankings.

2. Provide a better 'visitor experience', which should directly impact visitor behavior, and reduce the number of immediate 'it's ugly' back clicks to find another search result.

3. Increase 'time on site' / 'page views' prior to another search for the same or a different query. (Slightly different than a 'back click' if you picture a visitor typing a new query, rather than clicking 'back' a number of times to return to the original query and selecting another result. Even if they do click back the time between queries will be increased by increasing page views and usability.)

4. You can generally do a much better job of html tagging, because you have control over the style each tag presents.

So, where you might currently want to emphasize text using an html tag, but choose not to because the 'look' might not be as easy to read, with the use of css you can. For Example: With some font sizes the use of <em> or <i> will cause the text to appear smaller, making it difficult to read, but with the use of css, you can set the size of <i> tags to 1px large than your standard size, making the text appear to be the same size, and easier to read.)

Also, by setting heading tags to the same size, (or the size of your choice for each) you can properly tag headings (easily) from 1 to 6, without having to worry about the 'display size' of each heading, which gives search engines an 'order of importance' for text headings.

5. You have much more control over 'page load order', without the use of 'empty tables / rows / cols' and adjust a page to load from 'most important' to 'least important'. (This is more about communicating with SEs than visitors, by allowing you to load a page (in the source code) in the order a visitor is most likely to read, which, when combined with proper heading tags can help indicate 'order of importance' of topics to a search engine.)

There are a few more reasons I opt for css, but those are the main ones.

As far as change over, I personally use 'all at once', just because it says, 'new template' and makes a site easier for visitors to use, since they only need to get used to one style / format. (It's also generally easier to use a bulk 'find / replace' to make sure I don't miss anything than to try to make changes by hand, or in 'sections'.) I'm not sure how much it matters from a SE perspective, but prefer a site be consistent for visitors.

Justin

[g1smd]

Once you change to CSS, and especially if you construct the HTML code all from headings, paragraphs, lists, tables, and forms, you suddenly see, and start thinking in terms of, the document structure, rather than purely the visual "look".

[SEOPimp]

I appreciate the feedback. Although what do you think in terms of search engine impact. I know there is no rule or guarantee although based on experience, will moving to CSS have a positive impact in terms of the search engines.
I am really going back in forth in my head thinking whether it is worth the work to do the total switch over to CSS.

[Robert Charlton]

I appreciate the feedback. Although what do you think in terms of search engine impact. I know there is no rule or guarantee although based on experience, will moving to CSS have a positive impact in terms of the search engines.

I haven't seen any change in rankings for the sites I optimize which have changed to css.

It's possible that if you have a huge amount of text preceding your main content, you might see some gain by using css positioning, but for us there was no noticeable change (perhaps because our pages didn't have this issue). You might get better snippets in the serps for some queries on some engines by moving your nav text down.

CSS should speed up spidering, and if you have an extremely large site, that change might get more pages indexed.

Also is it best to change everything at once, or publish one section at a time?

I'd also suggest doing everything at once. Simpler all the way around, and no adverse effects.

The orginial (and current) design of the site is very poor.

Above comments relate to design and code changes only. If you're changing content or url structure, you run into a whole different set of issues. It's possible you may have to make both kinds of changes, in which case you'll have to look at those as well.

[edited by: Robert_Charlton at 11:26 pm (utc) on Aug. 24, 2007]

[icedowl]

I'm currently in the midst of switching from HTML to CSS. What I've noticed so far is that my content is much higher up in the code and that the new file sizes are about half that of the HTML versions of the same pages. I am retaining the same site structure and URLs as I go.

Questions:
1. Is it recommended to put my site's main navigation in an include or keep it coded in each and every page?

2. Is there anything to watch out for in this process of switching to CSS?

Thanks!

[yannis]

2. Is there anything to watch out for in this process of switching to CSS?

Just test it across all browsers. As far as SE advantages are concerned as long as the document structure remains more or less in the same order you had it before you will not see any major changes.

[sniffer]

I appreciate the feedback. Although what do you think in terms of search engine impact. I know there is no rule or guarantee although based on experience, will moving to CSS have a positive impact in terms of the search engines.

I haven't seen any change in rankings for the sites I optimize which have changed to css.

I have asked and seen this question asked many times and nobody has ever said their rankings were adversely affected after the swap over

I'd also like to add that its worth going back and reading the reasons why CSS was invented in the first place...

[g1smd]

I have only ever seen rankings and traffic increase.

As for "includes" they are a very good thing to use. I use PHP includes quite a lot.

I usually have an "include" that has the site navigation on it. When the navigation changes (maybe an extra page or something) then I just have to add the link once to the one "include" file, rather than having to edit every page of the site.

Likewise, there is another for the page footer.

[sniffer]

I usually have an "include" that has the site navigation on it. When the navigation changes (maybe an extra page or something) then I just have to add the link once to the one "include" file, rather than having to edit every page of the site.

are these includes cached or are they re-loaded for every page view?

[g1smd]

The server assembles all the bits before it sends the page out to the browser.

The browser, or a bot, has no clue that what they see has been built from several chunks of code.