| Nowadays, when everybody is interested in | | | | to read and changes can be performed easier. |
| getting the highest rankings possible for | | | | HTML code that needs to be modified is easier |
| their sites with the search engines, it seems | | | | to track, and a simple change in the |
| that the era of tables-based web sites is | | | | presentation of an element in the CSS file |
| getting closer and closer to its end. CSS | | | | will reflect in all the pages where that |
| programming appears to hold the upper hand in | | | | particular element is present, without being |
| this race for SEO, and it gains more ground | | | | necessary to update each and every page |
| as its popularity increases. | | | | separately. |
| | | | |
| What is CSS? | | | | 4. Increased browser compatibility |
| | | | |
| Cascading Style Sheet is a web tool that can | | | | CSS-based web sites are compatible with PDA |
| be utterly necessary if you want to give a | | | | and mobile phone browsers. Also, people with |
| professional, qualitative look to your site. | | | | various disabilities (mainly visual) use what |
| It is recommended by W3C, who manages the | | | | are called "accessibility readers", that |
| standards for the Internet, in order to add | | | | translate the HTML code into various formats |
| style (e.g. fonts, colors, spacing, padding, | | | | that contain no HTML tags. |
| alignment, etc.) to web documents. | | | | |
| | | | When translated, traditional, pure HTML |
| The style sheet is more and more used | | | | stands many chances of being turned into |
| presently due to its usefulness and its | | | | something that does not make much sense to |
| advantages that are far from minor: it mainly | | | | the impaired visitor. CSS, on the other hand, |
| allows to dissociate the content and the | | | | properly combined with HTML, can render |
| presentation of web pages, which makes them | | | | useless the elimination of the HTML tags, and |
| compatible for various browsers, and also | | | | therefore make the reorganization of the |
| accessible to people with disabilities (who | | | | content for readability unnecessary. |
| must use accessibility readers), to PDAs or | | | | |
| to WAP. | | | | 5. Higher rankings with the search engines |
| | | | |
| Benefits of Using CSS for SEO | | | | CSS improves the readability of your pages. |
| | | | Search engines spider will be able to index |
| Among the most common examples of CSS usage | | | | your pages much faster, as the important |
| there are the modification of the colors of | | | | information can be placed higher in the HTML |
| hovered links, text placement, establishing | | | | document. Also, the amount of relevant |
| the spacing between words, and the | | | | content will be greater than the amount of |
| modification of border size and style. The | | | | code on a page. |
| style sheets can be inserted directly into | | | | |
| the HTML code of each page, but they can also | | | | The search engine will not have to look too |
| be written on a different page, in an | | | | far in your code to find the real content. |
| external file (.css). | | | | You will be actually serving it to the |
| | | | spiders "on a platter". CSS will help you |
| This second solution is by far the best one, | | | | create highly readable pages, rich in |
| primarily because it holds undeniable | | | | content, which will prove extremely helpful |
| advantages such as: | | | | in your SEO campaign. As you very well know, |
| | | | better site ranking means better visibility |
| - The HTML code on each page is much cleaner | | | | on the web, and this can translate into more |
| | | | visitors and, ultimately, into increased |
| - The CSS file is cached from the very | | | | sales or number of contracts. |
| beginning, and this speeds up the load time | | | | |
| for the next pages | | | | The Caveat of CSS |
| | | | |
| - The update process can be performed much | | | | CSS and SEO make a good pair when it comes to |
| faster: it suffices to modify a single file | | | | potentially gaining more income, based on a |
| to change the entire site, no matter the | | | | clean, well-built web site. Nevertheless, |
| number of its pages.It is quite easy to see | | | | there is a very important matter that you |
| the close connection between search engine | | | | should consider when using CSS in order to |
| optimization and CSS. Style sheets will help | | | | optimize your web site: never use CSS in |
| you decrease the file size of your web pages, | | | | order to hide text. |
| and will give you the opportunity to use more | | | | |
| text and links than regular HTML, without | | | | It is quite common practice to attempt to |
| being constantly afraid of spamming the | | | | offer different versions of text on a web |
| search engines. | | | | page: one that is harder to read - to |
| | | | spiders, and a friendlier one - to human web |
| Here is what you can achieve with CSS: | | | | readers. Most of the times, search engines |
| | | | will perceive this as cloaking, and even if |
| 1. Reduced file-size | | | | it's made with the best intentions in mind, |
| | | | it could actually pass as spamming. |
| While "traditional" HTML is overcharged with | | | | Consequently, your site can be penalized and |
| tags that offer to search engine spiders both | | | | even banned for such practices. |
| the content and the presentation on the same | | | | |
| page, CSS actually allows you to clean up | | | | Conclusions |
| your code and separate these two. | | | | |
| | | | The bottom line would be that CSS is much |
| By including the styling of the text in a | | | | easier to understand and to optimize than |
| separate file, you can dramatically decrease | | | | simple HTML. It simplifies both the work of |
| the file-size of your pages. Also, the | | | | the SEO professional, as well as that of the |
| content-to-code ratio is far greater than | | | | programmer. CSS programming means providing |
| with simple HTML pages, thus making the page | | | | the site with the ability of faster updates |
| structure easier to read for both the | | | | in the future, of faster information |
| programmer and the spiders. | | | | transfer, and brings along the advantage of a |
| | | | simple code for search engines. |
| It is also possible to avoid using JavaScript | | | | |
| for rollovers and mouseovers. With CSS you | | | | If we think only about the fact that keywords |
| can define the visual effect that you want to | | | | can be highlighted on a page without |
| apply to images, instead of using images per | | | | negatively affecting its look, the page |
| say. The space you gain this way can be used | | | | file-size decreases, the code becomes cleaner |
| for text that is relevant for spiders (i.e. | | | | and more readable, and the bandwidth costs |
| keywords), and you will also lower the | | | | are diminished by lowering the page load |
| file-size of the page. | | | | time, then it would be safe to say that there |
| | | | is virtually no limit in the series of |
| 2. Less load time | | | | advantages of using CSS in SEO campaigns. |
| | | | |
| If you have a web site with lots of traffic, | | | | Read more free software marketing articles. |
| slow-loading pages will not make your life | | | | |
| easier. The benefit of having low file-size | | | | Copyright © 2007, all rights reserved. |
| pages translates into reduced bandwidth | | | | This article was written by Adriana Iordan, |
| costs. | | | | Web Marketing Manager at Avangate B.V. |
| | | | Avangate is a complete ecommerce provider for |
| CSS can help you save some money by offering | | | | shareware sales incorporating an easy to use |
| you the following advantages: | | | | and secure online payment system plus |
| | | | additional software marketing services and |
| - If the presentation information is placed | | | | sales tools. |
| in an external CSS file, this will be | | | | |
| accessed only once, when the homepage is | | | | This article may be reproduced in a website, |
| loaded. The CSS file will be cached on the | | | | e-zine, CD-ROM, book, magazine, etc. so long |
| user's computer, and the other pages of the | | | | as the above information is included in full, |
| site, that use the same CSS file, will load | | | | including the link back to this website. |
| much faster. | | | | |
| | | | This article is free for republishing |
| - Images can be set as backgrounds. They will | | | | |
| load faster than images placed between HTML | | | | Source: |
| tags. | | | | |
| | | | Occupation: Web Marketing Specialist |
| - As opposed to tables, CSS needs less code, | | | | |
| which means that browsers will read and | | | | This article was written by a Web Marketing |
| display page content faster than they would | | | | Specialist for Avangate BV / GECAD ePayment. |
| in the case of tables-based pages. | | | | Avangate is an eCommerce platform for |
| | | | electronic software distribution |
| 3. Faster update | | | | incorporating an easy to use and secure |
| | | | online payment system plus additional |
| Since CSS brings forth a simplification of | | | | marketing and sales tools. |
| the code on each page, they are much faster | | | | |