Browsers & CSS
Comparisons
- G02a - (4:28)
- NOTE that in my video I state that IE is the browser with the largest market share. However, that has not been the case since 2014 when Chrome achieved that goal. Apologies.
- Browser render engines and the browsers that use them:
- Trident: Internet Explorer - requires the most hacks; historically trails in compliance.
- Gecko: Firefox (Netscape origins)
- WebKit: Safari, Google's Chrome, Dreamweaver's Live View
- KHTML: Konqueror
- ...and several others that are used less.
- Browser market share
- For further information: Upsdell browser usage report
- Browser support - an issue that persists:
- Internet Explorer's support for CSS over the years has lagged.
- To a great extent this lack of adherence to w3c recommendations has led to extra costs for businesses.
- It is estimated that 40% of the annual budget of a corporate web department goes for accommodating different browser types, with IE accounting for the preponderance of those adaptations.
Designing for Standards First
- G02b - (4:03)
IMPORTANT!
I state firmly in the video to use only Firefox, however, you may also use Chrome or Safari.
- Design for standards first.
- Code to follow the CSS standards first
- That way you will start with clean, standards-compliant code that you can then alter for non-standards compliant browsers (especially Internet Explorer).
- Otherwise you would need to start by creating buggy code to support non-standard compliant browsers and then hack from the buggy code in order to support good browsers.
- There ARE issues, but we will start with “an ideal world”, or close to it.
- Otherwise chaos will ensue when the problems with IE emerge.
- Firefox, Chrome, or Safari MUST be used from now forward in the course.
- Version 3 or later. To check your version number:
- Windows: Help menu > About Firefox
- Mac > Firefox menu > About Firefox
- FYI: PCWorld Review of Firefox 4
- Do not look at or test your code in other browsers, especially IE, until the code is complete, approved and validated.
- At the end of the course we will discuss accommodating different browsers.
- Version 3 or later. To check your version number:
- Also, for the remainder of the course use an html5 document.
- Click here for the bare bones code required.
- Or, copy and paste the following to create a new html5 file:
- Design for standards first.
<!doctype html> <html lang=en> <head> <title>Page Title</title> <meta charset=utf-8> </head> <body> Minimum html5 page code. </body> </html>