How To Design Your Web Site With CSS

Cascading Style Sheets (CSS) allows you to create fast loading pages, increase your search engine rankings, and modify your whole site with one style sheet. So why don't more people use them? This is because they got so used to html design and are afraid or too lazy to upgrade their skills. Some will also use ready made templates that contain flashy graphics, bloated code and sometimes even contains hidden code embedded in the page.

In this series of articles I will show you how to create a simple web site using CSS, so you will have no excuse to begin incorporating them into your future designs.

What are Cascading Style Sheets?

Cascading Style Sheets is the name of a simple language that allows you to add any style (font, colors, graphics, links, layouts) to your web pages.

Benefits of Cascading Style Sheets

1. Separate content from presentation ? you can separate your HTML markup, text, graphics and multimedia from presentation.

2. Consistent site wide look and feel consistency ? you can apply one style for 100s of web pages all at once. So if you had to change the color of all pages on your site, you only have to edit one style sheet. This saves you a huge amount of time, especially if you had to edit each page separately.

3. Web site maintenance - apart from being able to make site wide changes easily through one CSS file, the clean code it generates makes it easier to update. Properly marked up web pages permit them to be maintained by more than one person. It will also work in more browsers. Web site redesigns will take much less time.

4. Improve search engine rankings ? search engines generally spider the code at the top of your web page first. For most sites that means the navigation bar will be spidered first (resides at top of page code). CSS enables you to position the code for your content at the top making your page search engine friendly. Properly marked up HTML pages can easily found and properly categorized by search engines

5. Fast loading ? CSS reduces the amount of tags used therefore producing clean code. Tableless design can reduce your load time by 25% to 50%.

6. Reduce bandwidth ? compacting the amount of code used will reduce the amount of bandwidth needed to host your web pages. Therefore you won't have to pay higher fees when adding more web documents to your site.

7. Accessibility - increasing accessibility with CSS means being able to serve web content to a larger audience, increasing web site usability, even for non-disabled people. Content can easily be formatted for projection as well as screen display. Tableless layouts display well on hand-helds.

8. Improve the printing of web pages ? most printers will only allow you to print a portion of the web page. With CSS your whole document can be printed.

When you use CSS it becomes quick and easy to apply new styles that can not only effect all styles on your web page but even your whole site.

In the next article I will explain how to layout a web page using CSS.

Herman Drost is the Certified Internet Webmaster (CIW) owner and author of http://www.iSiteBuild.com Affordable Web Site Design and Web Hosting. Subscribe to his "Marketing Tips" newsletter for more original articles. mailto:subscribe@isitebuild.com. You can read more of his in-depth articles at: http://www.isitebuild.com/articles

In The News:


pen paper and inkwell


cat break through


Awards Program Debate

Daily article:One of the most debated subject among webmasters is... Read More

Web Publishing Guide for the Beginning Entrepreneur (Part 1)

The best things don't come easy. - QuotedThe finished web... Read More

The Technology May Change, But Human Nature Remains The Same

Let me repeat that.."The technology may change, but human nature... Read More

When Good Computers Go Bad

Remember the day that you got your new computer (or... Read More

Why Dot-Coms Fail - a Webmasters Perspective

Everyday we hear that another company goes out of business.When... Read More

How Important is Content to a Successful Website

Content is the most important part of any website.The Internet... Read More

Designing Your Web Site For ALL Browsers

Let's face it. Building a web site that browses consistently... Read More

Turn Harmful 404 Error Pages Into Helpful 301 Redirects

It's a fact, Page Not Found, known as a 404... Read More

The Best Simple Software For The Busy Webmaster

Here are a few programs I can't do without. They're... Read More

Build Web Pages from the Top Left Corner Down

There are two important reasons to build your website from... Read More

Web Design: Should You Hire Someone or Do It Yourself?

So you need a website. You are not sure if... Read More

Good Content Pays!

Traffic to a site can be a blessing or a... Read More

How to use Emotional Content to Increase Visitor Response

Did you know that many folks make "buying decisions" when... Read More

Bad Design Characteristics For A Website

Making a poorly designed website is one of the easiest... Read More

Website Re-Design?

My site is working fine. The links work. Content is... Read More

The Top Ten Checklist For Low Web Site Sales

You have good traffic, but low client sign ups and... Read More

Website Maintenance: What Does it Take to Manage Your Website?

Every action has a beginning phase where you launch your... Read More

Website Design: 10 Smart Tips To Improve Your Ad Copy

Your website design may be affecting your sales in ways... Read More

Let Your Website Make You $$$ While You Sleep! and All That Other B.S.!

Well, you've got your product, started your home business, and... Read More

Website Design Basic Concepts

So, what's in a website design anyway? And, how do... Read More

Appropriate Key Words Choice

What do the key words represent?Key words - these are... Read More

Creating a Compelling Headline for Your Private Practice Website

Your home page is the most important page of your... Read More

Three Things You Must Do When Designing and Building Your Small Business Website

If you are going to have a web presence for... Read More

When You Create A Web Site, Dont Make A Splash!

Don't make a splash!Are you thinking about using a splash... Read More

Web Production And Design Tips

You have identified that to have an internet prescence would... Read More

Immutable Laws Of Effective Navigation - Part 1

The first immutable law of effective navigation: It's gotta be... Read More

How To Shop for a Web Design Firm?

While few companies can boast as we do that our... Read More

Tips For An Effective Website

A successful website is something that everyone venturing into the... Read More

7 Reasons Why Using CSS is a Must

CSS is a new option for website designers that have... Read More

Creating the Perfect Website - A beginners Guide

Are you looking to create the perfect website? A complete... Read More

Digitalize It! : (Modification of images with tools such as Adobe CS and Corel)

Then it was a choice among crayons, paints and palettes... Read More

Free Website Design Tips

In this article I will give a few tips of... Read More

Owning Your Own Web Site Is A Must

Owning your own website is a must if you are... Read More