Presentation is loading. Please wait.

Presentation is loading. Please wait.

Ch 13 HTML and CSS Web Standards Solutions A Web Standardistas’ Approach.

Similar presentations


Presentation on theme: "Ch 13 HTML and CSS Web Standards Solutions A Web Standardistas’ Approach."— Presentation transcript:

1 Ch 13 HTML and CSS Web Standards Solutions A Web Standardistas’ Approach

2  There are a number of key elements that can be found in most head sections of html pages.

3  meta  title  link  style  script

4  The use of tags  Metadata is data that describes other data  Choosing the right description meta data is important for search engines

5  Projects such as the Dublin Core MetaData Initiative http://www.dublincore.org/ are dedicated to creating standard conventions http://www.dublincore.org/

6  There are four types of attributes to the meta element:  http-equiv  name  author  keywords  copyright  Robots  content  scheme.

7  What happens if you don’t include the character set information for words like: Iñtërnâtiônàlizætiøn?

8  Separating the XHTML content from the CSS presentation can be fully and consistently exploited when external style sheets are used. InternalExternal linked.css

9  Media types for style sheets  Screen  Print

10  Screen

11  Print

12

13  It is well documented how many browsers do not conform to the standards and certain versions of Internet Explorer require conditional comments that can be used to try and implement your CSS in a different way to get the same result on screen. /* target versions of IE less than or equal to version 6 */

14  Targeting specific versions of Internet Explorer /* target versions of IE */ /* target versions of IE less than 6 */ /* target versions of IE greater than or equal to 5.5 */

15  Targeting specific versions of Internet Explorer /* target versions of IE less than 6 */ screen.css #header { background-image: url(images/transparent_background.png); } iehacks.css #header /* IE 6 does not support transparency in png images */ { background-image: url(images/transparent_background.gif); }

16  Manually checking compatibility with all browsers would be time consuming and difficult.  Source: http://browsershots.org/http://browsershots.org/

17  Adding a favourite icon to the address bar  Can be seen in:  Tab  Bookmarks  History  Toolbars  Only 16 x 16 pixels

18  There are a number of ways to create the 16 x 16 pixel image  Creating the image using Photoshop: http://www.photoshopsupport.com/tutorials/jennifer/favico n.html http://www.photoshopsupport.com/tutorials/jennifer/favico n.html  http://www.thesitewizard.com/archive/favicon.shtml http://www.thesitewizard.com/archive/favicon.shtml  http://favicon.com/


Download ppt "Ch 13 HTML and CSS Web Standards Solutions A Web Standardistas’ Approach."

Similar presentations


Ads by Google