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

---

Internet Tip of the Week: First Impressions

First impressions are extremely important if you hope to do... Read More

Web Templates: Replacing Designers?

I've seen articles (and websites) that suggest you can buy... Read More

The Ultimate Web Site Marketing Strategies That You Should Know

Most of us know that we need to advertise our... Read More

Speed Up Or Lose Out! How To Improve Your Websites Download Speed

So your web site's online and you've got high rankings... Read More

12 Essential Web Site Design Tips

1. What's the purpose?The most fundamental thing to do before... Read More

How to Use Sliced Graphics to Layout Your Web Site

The problem with designing your site as a graphic, is... Read More

Is a Web Site Builder Right for You?

A web site builder can be a real life saver... Read More

Why Your Site Should be Developed with CSS and Semantic Markup

Why your site should be developed with CSS and semantic... Read More

Having A User Friendly Website

Let's look at what your user wants to see at... Read More

Can Your Visitors Contact You From Your Website

Argh, where's the contact button?! Believe it or not, some... Read More

Ten Tips For Your Web Site Home Page

1. Loading time:try to be below 20kbless number of imagesspecify... Read More

The Next Marketing Tool: Deisgn

Design sells. It's something that all of us know, but... Read More

Web Marketing: Design Mistakes That Drive Customers Away In Droves

They may look cutting edge, but if you want a... Read More

4 Things That Make A Web Site Great

First you need original content. Content is the heart beat... Read More

Custom Icons For Your Specific Brand

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

Effective Web Design Usability Principles

Website Design Usability Tips1. Getting to know about audience membersYou... Read More

404 Error - The Page Cannot be Found

A "404 Error" happens when the web server you are... Read More

Shameless Flashers - Using Flash Tools To Create Spectacular Websites

Flash is a powerful technology that can help you create... Read More

10 Tips for Killer Website Design

Does website design make a difference in how long people... Read More

How To Start An Internet Business ? Designing For Usefulness

The first step to starting any Internet business is conducting... Read More

Breathe New Life Into Your Half-dead Website By Using Words That Sell

This article may come as a surprise to you.Especially since... Read More

Why Do Images Disappear from a Webpage?

In learning webpage design, I encountered many problems that took... Read More

Creating A Quality Web Site Design!

In this article, I will attempt to cover the basics... Read More

Building Your First Web Site?

Before doing anything on the technical side, you need some... Read More

Does Your Homepage Work?

All websites have a homepage. It is the most important... Read More

The Secret To A Profitable Website

Whether you are planning on having a website built for... Read More

No Matr How Goud The Infomation...

Typos, misspellings, hideous grammar, exclamation overkill and run-on sentences all... Read More

Introduction To CGI Scripts

Using CGI scripts to add automation to your web site... Read More

HTML - A Website Language Explained - For Over 35s

This is a very perfunctory look at the website code... Read More

Why Should You Care About Your Web Site Colors?

**How Colors are Used in web design:**Demarcates screen elements into... Read More

Website Re-Design?

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

Using Graphic Design on Your Website

Almost everything is available on the web? products, services, e-books,... Read More

Alternative to Web Site Templates and Design Software

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