Cascading style sheets let you manipulate the images on your web site in such a way that they can dramatically change its whole look. Keep reading to learn how the technique of tiling can help you make your web site look more interesting.
Yes, definitely it must be admitted that learning these three pillars of top-notch web development help in the construction of truly professional web sites, even when this process, as everything in life, takes time to master. Of course, one of the best things surrounding the development of high-quality web sites is learning to implement those simple yet effective techniques that can turn an arid, text-based web page into a completely different, eye-catching landscape.
While on the web of today, content is the king that rules almost every tiny aspect of a web site, it's worth mentioning that delivering this content to end users in an attractive fashion can be by far much more effective than simply offering them endless paragraphs of boring text across different pages. And indeed, this simple proven concept can be easily implemented in the real world by adding some appealing CSS styles to the different elements that compose a web site.
However, there's one specific feature included with the CSS specification that sometimes can be underestimated by some web designers, particularly by those with limited experience in this field. In this case, I'm speaking of using background images to transform the look and feel of a specific web document.
But, what's the point in mentioning this? After all, in the old days of the web, it was also possible to include background images on a web page, simply to make it visually appealing to potential users. Well, while this is true and doesn't bear much discussion here, you'll surely know that when you work with CSS styles, they allow you to specify easily whether a concrete background picture has to be repeated vertically, horizontally or both, within a specific web document element.
This known functionality offered by the CSS specification, when used in a clever way, can dramatically change the visual presentation of a web page by only using a few lightweight background images, which can be quickly downloaded by the browser.
Therefore, taking into account that this CSS-based technique might be interesting to rather inexperienced web designers, in the two tutorials of this series, I'll be demonstrating how to use the pair of popular "repeat-x" and "repeat-y" CSS properties to improve the overall appearance of a sample web site via some simple background pictures. You can use the basic example I'll be presenting to fire up your own sparkle of inspiration.
So, are you ready to learn how to use the functionality provided by CSS-based background pictures to spice up your existing and future web sites? Okay, let's begin now!