The XHTML story was only about defining content and site parts. Viewing a tagged document in a browser (thus, a text file saved as .htm or .html), shouldn't show any different than an untagged document.
A browser will not show the html tag containers of a text document, .txt files, saved with the extension .htm or .html, aka a html document, but only their content.
if you would test this, you'll see it already shows styling: titles are bigger, paragraphs show spacing,... lists have bullets, because these elements where defined as such, and have a default styling:...
To make it match with the wanted site design, we need to define styling settings for every (nested) tag: settings for every tag, only for tags of a certain type, for tags of the same 'class', for a tag with a specific name, 'id'...
CSS, the Cascading Style Sheet language is responsible for this. Cascading because the rule that is more specific prevails.
Example CSS code setting the look of titles and paragraphs:
Styling should be done separately, not inline, not inside the XHTML document: to make sure your site content doesn't get a mess (oh yes, it's all about the data!). This is done by importing a stylesheet document containing CSS code.
To see what CSS means for this site: .
Click here to .
An external stylesheet imported in every page of your site also means the styling information is centralised. Changing the styling information of an element changes its appearance in the entire site, on all pages.
One CSS file, one style, multiple CSS files, multiple looks,... for the same html document, for the same site!! E.g. or .
In fact, if you later decide to "change your site" (entirely), you probably only want to change the site appearance and update the content. Using XHTML+CSS this means you should not change the site code entirely, but only locally: edit/add the content in the html documents and deal with global site-look issues inside the stylesheet (and thus, if wanted, change the stylesheet entirely).
Because a lot of sites still are very HTML4 (~1994-2000) not yet XHTML+CSS,... having styling information set inside the html document, overruling externally set styling! This makes it impossible to change the style globally to whatever look you want.
To upgrade, first, all styling information needs to be removed from all html pages of the entire site, and must be put in a separete stylesheet file: a lot of work. Therefore, a site upgrade in reality often means, starting again from zero. Completely insane ofcourse,...
A mistake webdesigners without a technical background also make is that they design the website using HTML. They e.g. use tables to split up the screen and create the template. Tables are not the way to go: they are designed to hold data.
Wrong usage of website building software that is based on ancient technology lies at the basis: software can only function as good as the one using it.
Luckily a lot of sites already store data in a database and let a server-side script fill out the parameters in only one or a few HTML templates, not storing all the unnecessary HTML overhead, in every page of data....
Upgrading in this case only means upgrading the front-side template, at the back-side, where it is generated (and adding extra functionality).
Clue of this all: keep your data and data-interaction issues separated, so upgrading (in reality often only a style upgrade) will not interfere with the data, only interact.