In the early days of the Internet, web pages were often created using tables for every element on a page. The overall look was good, and in most cases, browser friendly. However, making changes on a page could be a nightmare with programmers having to wade through hundreds of lines of code, often rewriting whole sections of code, just to make small changes. All that code also made page loading times very slow, especially for those on slow dial-up modems.
Today, the Internet is all about speed. Users now expect web pages to load in the blink of an eye, and search engines are now including page load speeds as part of their search rank criteria. Tables just don’t cut it now. Instead, programmers use Customized Style Sheets, or CSS as it is more commonly known. One of the benefits of well written CSS code is that site-wide changes can be made with minor changes to the code. CSS code has also added several significant changes that really do add to a page’s overall SEO effect. These include:
- smaller page sizes – less code equals fast load times
- content to code – web pages now have significantly more content than code
- Content placement – when a search engine reads a page, the content is much closer to the top and there is less fluff around the content
- browser compatibility – you can write CSS files for each browser if you have compatibility issues
For business owners whose websites are large, cost can also be an issue. Smaller, easier-to-maintain code is obviously far more cost effective. Small code also leads to lower bandwidth, another cost factor for many businesses. Of course, website owners are only going to gain benefits if the code is well written and then used effectively.
CSS is really a simple method of defining styles for a website. These styles can then be used site-wide simply by calling on the relevant style. One of the most common styles used is the H1 through H6 tags. These are preset in HTML, however, you can redefine them through CSS. If we take the H1 (heading one) tag, you can set it for a specific font, color and size that can be used site-wide. You can also establish separate H1 styles for various sections of your webpage. If you ever wish to change the color, for example, there is only one number that requires a change – and the change will appear site-wide.
A second advantage of CSS styles is that of labeling. With CSS style sheets, you can label each style to reflect the action you want to effect – for example, margin top or margin bottom. Clear labels make for easier editing at a later date. It also helps to organize like elements together, further reducing the amount of code used. When labeling styles, it is still important to consider size, so short concise but clear labels are important – remember, those labels will be used throughout your website whenever you call on them.
In summary, the use of CSS makes for friendlier websites that load quickly, smoothly interact with a user, and publish well on both traditional and the new mobile technologies. Search engines can index your content much easier, and you’ll get the tick of approval when it comes to page loading times. The use of CSS styles then is good for users, good for search engines, and good for programmers.