Cascading Style Sheets for Better Web Design

In cascading style sheets you can specify how your web pages will be presented on the screen by simply predefining page elements such as fonts, headers and links.

You can add these predefined elements in the head-section of your pages, but more interesting is to use them in a single .css file and include that file in every page on your site.

All you have to do is include in your HTML header. (the path in the href must point to the place where your .css file is stored)

There are two main benefits to using css sheets in a separate file:

1. more flexibility; only one (1) file to update

2. less HTML coding and easy replacement of deprecated HTML. I'll explain more of this below.

First, let me tell you I am NOT a cascading style sheet professional. I just use it.

If you want to become one, there are great css resources and tutorials out there.

Just go to

http://www.w3.org/Style/CSS/learning http://www.htmlhelp.com/reference/css/

to mention a few, but there are many more. Type 'cascading style sheets' in your favorite search engine and you get plenty of information.

But just being a layperson in css emphasizes the importance of this web design tool. I started using cascading style sheets in its most elementary form. All you have to do is name the page element that you are going to specify and add its specifications in curly brackets. Here's my first css file:

body { font-family: Arial, Helvetica, sans-serif; font-size: 10pt; font-style: normal; line-height: normal; font-weight: normal; text-decoration: none; color: #000000 }

By simply saving this code in a style sheet file and including it in my webpages I suddenly didn't have to define FONT statements in the body of my pages any more. Wow, that saved me a lot of coding! Big advantage (no. 2).

AND .....

I had fewer errors in my HTML, because I didn't have to close that awkward FONT tag (at the wrong place). Big advantage (no. 2).

When I discovered this, I immediately began adding definitions for other tags like H1, H2, linktext (not visited, visited and hover) and special colors in text.

If I want to change the look of my H1-header, all I have to do is change the specs in my style sheet and presto .... the H1 is changed across my whole site. How's that for flexibility? Big advantage (no. 1).

When I once redesigned my site I used HTML validators to see how I was doing. To my surprise I found that some HTML commands, the most important one being FONT, were deprecated in HTML 4.0. That means eventually these commands will not be used anymore.

So I had to do something. Again, style sheets came to the rescue. All I had to do was define how my fonts would look like in my style sheet and I had the problem solved. Big advantage (no. 2).

Now I use css to define headers, footers, special text colors, special fonts and font sizes, special links etcetera. If I ever discover I need some extra lay-out or style, I just add one line to my .css file. It's so easy!

Try it. Start using style sheets. You're more flexible and it will save you lots of time.

Wish you success.
Case Stevens

Case Stevens, owner of AnOwnSite Internet Marketing, is experimenting with different marketing techniques, websites, traffic and lead generation. He publishes his experiences in a newsletter featuring understandable, successful low cost Internet marketing techniques, ideas and strategies, articles, news, tips & tricks and interesting (free) downloads.

Subscribe at Affordable Online Strategies

More Web Design Articles

How To Increase Your Conversion Rate or What Most People Miss When It Comes To Optimization
Everybody talks about the importance of testing your sales copy or a page layout. After all, proper testing can help you modify your page in a way that will drastically increase your conversion rate.

Designing Your Websites Directory Structure
Any kid, and their grandmother too, can make a webpage. There are many "wysiwyg" webpage design applications that let you create a webpage as easy as typing text.

Tips for Getting More Sales From Your Website
(1) Create a Direct Response Website, with the minimum number of pages possible (e.g.

Want to Increase Your Online Sales? Make Sure That Your Web Site Has a Unique Selling Proposition
If you own a web site or if you are going to build a new one, the most important thing about your site is to achieve as high as possible visitors to sales conversion rate.Although they say that "the traffic is king online", if your website converts poorly, your online business will fail, unless you receive tons of free traffic which I doubt.

Use Feng Shui Techniques To Design a Harmonic Website For Your Business
By following feng shui guidelines and techniques, you can build and design a business website that is not only visually attractive but also attractive to wealth and prosperity. The elements that are part of a business website are somehow equivalent to the objects distributed through a working space since the website is the electronic version of the actual business' offices.

Wording Up Your Website
Back to basics. Forget funky design, good copywriting is the key to a clear and intuitive website.

6 Reasons Why Using Flash is a BIG Mistake
Most web designers and web design companies will try to convince you that if you want your business to have the best site possible that you MUST have a flash site. Flash, for those of you who are newbies, is a software program that can create really cool special effects and animations.

How to Choose a Website Design Company
The internet is full of web design companies pleading for your business. They all look great! Not sure which company to select? By following these simple steps, you'll be able to select the perfect designer for your business.

How to save money on a website
Know what you wantMake sure you know why you want a website and what you want your website to do for you. Write down some short term and long term goals.

Tried and Tested Tips to Improve Your Website - Part 1
1. DO NOT use excessive graphics or banner images on a single web page.