Although it’s not fully supported by all web browsers yet, CSS3 has already managed to help web designers save time. It has also taken some websites to a much more complex level with relative ease. One of the most popular new trends in website design is the box shadow. This might be down to the fact that CSS3 makes it so much easier to include it on a website.

A great showcase of what can be accomplished with this CSS3 property.

Shadows are excellent additions to a page if you want to make it look more engaging. Allowing boarders and navigational tools to appear three-dimensional, they are clearly a great step forward and make the way we display online information more visually pleasing. If your website is your business, it can also make it appear more up to date with the latest innovations thus increasing customer confidence in the brand.

CSS3 uses a comma with a separated list of shadows, each one having defined length values between 2 and 4. This makes it possible to apply multiple shadows to a page using a lot less code. Another excellent feature of CSS3, and one which might make your website more interesting, is the opacity setting. This controls how transparent a box is on a web site and can make the function of it clearer to users.

One example of this, and one we see regularly on pages, is the use of opacity in modal pop up boxes. If a box is less solid we can see that the information it is presenting is more of an annotation and not a part of the main focus of the page. Allowing designers to choose how transparent a box is using a simple piece of code, this method is also a lot less time-consuming than traditional methods, making it ideal for those who want to know how to create a website that is likely to be successful.

Read the rest here!