Why your site should be developed with CSS and semantic markup
|
One thing that I have learned
in over a decade developing websites is that the Net
is continually changing, and to keep up you need to change
with it. One of the more recent developments in web design
is the use of CSS and semantic markup. CSS and semantic
web design has several benefits: clarity in code, browser
and other web-enabled devices compatibility, separation
of content and presentation, smaller burden on bandwidth,
and better visibility to search engines.
Back in the day, we designed sites with tables and hacked
those tables into doing things that they were never meant
to do. The table tag was designed to display tabular data,
not as a way to render the layout of a website. Unfortunately,
a better alternative did not exist, so we used tables.
This made for inefficient, slow loading sites with code
that was very hard to read and maintain. Wikipedia defines semantic
markup like this:
Semantic pages: supply information for Web search engines
using web crawlers. This could be machine-readable information
about the human-readable content of the document (such
as the creator, title, description, etc., of the document)
or it could be purely metadata representing a set of facts
(such as resources and services elsewhere in the site).
(Note that anything that can be identified with a Uniform
Resource Identifier (URI) can be described, so the semantic
web can reason about people, places, ideas, cats etc.)
These days, hip designers and developers use CSS extensively
to create beautiful, fully standards compliant sites.
CSS-based layout allows us to develop sites that will
degrade effectively--that is that they will be viewable
on all types of devices such as PDAs, cell phones, T.V's--and
will work correctly on devices that don't even exist yet
as long as they are standards compliant.
Most importantly, developing sites with CSS allows us
to effectively separate content and presentation. Have
you ever looked at the source code of HTML pages that
were created with a table-based layout and wondered what
the heck is going on here? You see lots of opening and
closing of tables and table rows all mixed together with
textual content and graphics. With a clean, CSS-based
layout you can create pages that are easily understood
by looking at the source, making them easier to understand,
maintain, and update. Look at the source of my company
site http://www.vp3media.com/ and then look
at the source code of this site that uses a tables based
layout: http://webservices.org/ Big difference,
huh?
If you have a site with high traffic, you can significantly
reduce the amount of bandwidth used by transitioning from
a table-based site to a CSS-based layout. If a visitor
to your site doesn't have to load all of the code needed
to render those tables and spacer gifs, you are transmitting
less data.
CSS also offers search engine optimization benefits over
tables. If you have a tables based business site that
relies on Internet traffic to turn a profit or acquire
new clients you will see real advantages by switching
to CSS. When a search engine spiders your tables-based
site, they retrieve a large amount of content that has
nothing to do with you business. When search engines spiders
a clean CSS-based site, the majority of content retrieved
will be textual content that describes your business.
The ratio of content-to-code is higher with CSS-based
layouts.
We've all seen search engine descriptions that don't make
any sense; that's because search engine spiders use a
top down method for retrieving information. Whatever is
topmost in your document, the search engines are going
to think is the most important part of the document, and
therefore should be used as the description. Since we
separate content and presentation with CSS, we can put
the most important information at the top of a document
no matter where it is actually displayed on the page.
Try that with tables!
I hope this article gives you an overview of why it is
important to transition from your current tables-based
layout to a fully valid CSS implementation. If you don't
have a website, but are planning on launching one in
the near future, make sure you tell your developers you
want a CSS-based implementation.
James Kendall has been developing websites for over a
decade and has founded and co-founded several companies
concerned with web development since 1994. Currently he
runs VP3Media and focuses on one on one interaction
with select clients. |
| |
|
|
