Browser wars again?

Since I began posting to the Internet on my web site in 1995, I have seen many changes. One thing that has remained constant is the "browser war". Whether your browser (User Agent) is Opera, Safari, Chrome, Firefox, Internet Explorer, mobile like BlackBerry, Android or any other, they all display content differently due to version variation and competitive market share interest.

Most browsers today are now focused on HTML5 and CSS3 support, and many are moving toward a better compliance level. Because this effort is a work in progress for the long term future, your particular browser (user agent) may not support the new code being used.

Playing Media Files

For example, the HTML5 tag <audio> allows you to play MP3 and OGG encoded media files in an HTML5 - H.264 codec aware browser without a plug-in. The HTML5 tag <video> allows you to play MP4 and OGG encoded media files in an HTML5 - H.264 codec aware browser without a plug-in. Select either audio or video icon at right to try the HTML5 code in your browser/user agent.

If the browser does not support the <audio> or <video> tag, you must have a Flash or Silverlight plug-in installed and the source file format must be compatible with the plug-in being used. Also, the HTML code must use the pre-HTML5 method utilizing the <object> tag.

Animation

Select the animation icon at right to try the CSS3 code in your browser/user agent. Animation is a moving image which has properties such as varing or fixed color, timing, duration, and direction.

Font Resources

Select the font icon at left to try the CSS3 code in your browser/user agent. A font provides a resource containing the visual representation of characters. At the simplest level it contains information that maps character codes to shapes (called glyphs) that represent these characters. Fonts sharing a common design style are commonly grouped into font families classified by a set of standard font properties. Within a family, the shape displayed for a given character can vary by stroke weight, slant or relative width, among others. An individual font face is described by a unique combination of these properties. For a given range of text, CSS font properties are used to select a font family and a specific font face within that family to be used when rendering that text.