CSS – Lesson 1 Part 1

Introduction to Cascading Style Sheets.

The World Wide Web Consortium (W3C) invented Cascading Style Sheets (CSS) in 1996 to increase the presentational sophistication and the accessibility of websites, and to eliminate the browser-specific markup that threatened to fragment the emerging web. In 1997, some browsers began to support parts of CSS-1, but the standard did not become truly usable until 2001.

Be aware that CSS is not well supported by older browsers such as Netscape Navigator 4 and Internet Explorer 4, and is buggy in IE5 but any of the newer browsers will render it pretty well. Depending on where you go, you’ll soon see that there is a constant battle over whether to support the older browsers and make all of your sites backwards compatible or to not worry about backwards compatibility and make your sites forward compatible. The things covered in this introduction to CSS will not radically change your layout and will only have minimal affects on older browsers that do not support CSS.

Benefit to using CSS

Here is the biggest benefit of using CSS, global control of your documents. With CSS all you have to do is make changes to one document, your style sheet, and change the look on all of your pages at once. What a time saver. Just think how long it would take to change font sizes and color on 50 pages.

CSS and SEO

In keeping with the SEO techniques that we are learning here, if you are not using your H1 and H2 tags as instructed because they are just to big, you can control their size using CSS to make them look more presentable to your design. I’ll cover H tags and how to set them up in Part 2.

Handy tools to have and useful links

CSS Editors –

I use TopStyle lite which is free and find it very useful. It’s nice having all of the most popular tags at hand and not having to memorize them all when you are just starting to learn. It wont take long though till you have most of them burned in to memory. Here is a links to a few of the free editors out there, although there may be more.

http://www.w3.org/Style/CSS/#editors

Useful Links –

http://www.w3schools.com/css/ http://www.westciv.com/style_master/academy/css_tutorial/ http://www.nypl.org/styleguide/

Advanced CSS –

http://www.alistapart.com/topics/css/ http://www.meyerweb.com/eric/css/edge/

I would not try to tackle too much in the way of advanced CSS till you have a good grasp of the basics, but it will give you a good idea of the power CSS designs. Another good site to look at is http://www.csszengarden.com/ All of the sites there are built strictly using CSS. I go there now and then when I need inspiration.

In Part 2 we will begin with the different ways to incorporate CSS in your web pages