HTML 5 and CSS 3

CSS 3 and HTML 5

HTML 5 and CSS 3 are about to hit our screens but even after the launch of new web browsers and patches to upgrade our current browsers, Safari is the only one to pull it off.

Going back to basics, HTML (Hypertext Mark-up Language) is the predominant scripting language for creating web pages. It is written in the form of HTML elements consisting of “tags” within its pages content.

CSS (Cascading style sheets) is used to define the appearance and layout of text, elements, and other material, displayed on the page/screen.

HTML 5 is the next major revision of HTML of which was first draft appeared in January 2008. It is the next advancement of both HTML 4.01 and XHTML 1.0 which initially was said to become the new standardised structured layout in web application development. HTML 5 provides a number of new elements and attributes that reflect the typical usage on today’s modern web sites. One purpose was to replace the generic DIV and SPAN elements with named tagged blocks such as NAV and FOOTER to allow search engines to crawl content easier. Other new elements are to include AUDIO and VIDEO tags.

Although you may see small elements of CSS 3 used on some websites, CSS 3 has not officially been launched as it’s currently still under development. Colour and image opacity, box shadows, multiple backgrounds, text shadow, text overlap, word-wrap, web fonts, speech and rounded corners are set to become invaluable new features of CSS 3. Rounded corners using CSS 3 are currently being used on the famous social networking website Twitter.com however if you are using Internet Explorer (doesn’t matter which version) you will not see this feature working and the layout will revert to normal squared boxes.

Once again, this is where browser compatibility will become a stopping point for the launch of HTML 5 and CSS 3 combined. The only browser which currently renders both HTML 5 and CSS 3 together is Safari.

Safari was originally used as a Mac browser; however you can now download and install a PC emulator version of Safari and Opera. Firefox has some great web developer add-ons and I would recommend every developer to be taking advantage of these features.

Each and every web browser renders differently and conditional comments are usually used (or PHP/JavaScript code) to pull in different style sheets to support the end users browser. What I find fascinating is that each and every version of Internet Explorer renders differently too. For example; Internet Explorer 6, 7 and 8 all have rendering issues even though they are from the same developers. Using the correct DocType usually sorts these issues out but they seem to be gaining new bugs rather than fixing any old ones.

Most recently Google Chrome has been launched, nothing spectacular however I am impressed by the speed at which it delivers content.

As mentioned above there are several web browsers to choose from:

If you are a PC, then you can use Windows Update to gain the latest version of Internet Explorer 8. If you  need to check your coding in previous versions of Internet Explorer then Tredosoft should sort you out.

Post a comment