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

---

How To Shop for a Web Design Firm?

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

How to Create A Homepage That Works

Want to know what the worst thing to say on... Read More

Give Your Website A Chance

I often wonder how serious people are when it comes... Read More

10 seconds is all it takes? (How to grab the attention of your audience with your web site)

FACT: 30 to 60% of visitors tend to drop off... Read More

Quality Graphics for your Web Site

For most people graphic design does not come easy. Unfortunately... Read More

Copy Editing: 10 Powerful, Mind Blowing Secrets For Writing A High-Impact Ad

No matter what product or service you're promoting, unless you... Read More

Cheap Web Design

If you think it's simply a case of who will... Read More

Using Server Side Includes to Simplify Your Web Design

An "include" file is a piece of code that can... Read More

How to Make a Website (Minus the Headaches)

There is nothing wrong with making your own website if... Read More

Custom Icons For Your Specific Brand

Developing a software application is not easy at all; apart... Read More

Keep Your Navigation Highly Visible

Effective navigation stands out. It's clear, obvious, and highly visible.You'll... Read More

Keep It Simple, Stupid: The Beauty of a Clean Cut Website

Don't knock it; "Keep It Simple, Stupid" is a great... Read More

Excellently Constructed Websites

Want to see an excellently constructed website? As a writer... Read More

Effective Website Design

In this era of ultra-sophisticated internet marketing and web design,... Read More

How To Rescue Your Graphic Design Project When All Else Fails

Whether you're giving a critical sales presentation to a client,... Read More

An Ideal Home Business Home Page

From my personal experience of around two year as home... Read More

Five Common Web Design Mistakes

There are often many mistakes encountered when creating a webpage... Read More

Meta Tags ? An Introduction

A long, long time ago? In a galaxy far, far... Read More

The Psychology of Color in Web Design

Persons engaged in website design, here's a scoop for you!... Read More

The Top Ten Checklist For Low Web Site Sales

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

Why Choose A Professional Web Designer?

It seems that almost every Tom Dick and Harry do... Read More

Free Online Tools to Design (and Maintain) Your Website

These days, it seems that everyone has a website. Unfortunately,... Read More

How To Choose A Website Designer

Now that you have decided that it is time to... Read More

Reach Out To Billions

Have you heard of 'Babel Fish'?It's a service provided by... Read More

Web Site Professionalism? What Is It?

Your web site should be-visitor friendly to navigatesearch engine friendly... Read More

How To Design A Web Site

I'm not a professional web site designer and openly admit... Read More

Are You Driving Away Potential Customers?

When a prospect lands on your website will he or... Read More

File Types For Icons Explained

An application is not ready for use unless you have... Read More

The Brutal Truth

Not too long ago while looking for businesses that do... Read More

Alternative to Web Site Templates and Design Software

Before I discovered the concept of Web site templates, I... Read More

Tapping Into The Visual Stimulus Of Your Web Site Visitors

"Oh, my eyes, my eyes! What an eye sore. Quick,... Read More

Pages to Include in Your Website

What pages need to be included on your website? The... Read More

Setting Up a Website

Where does a person start when setting up a website?... Read More