HTML n241.tplt Designing for a Variety of Browsers Dominate browsers are Netscape Navigator and Microsoft Internet Explorer (IE) These account for approximately 90% of browser use today Other Browsers America Online browsers - uses 7 possible browsers, some lacking all but the minimal HTML support. WebTV - uses a specialized browser for viewing web pages, but unable to display frames, Java, JavaScript, ActiveX or anything that requires a plug-in. Lynx - text-only browser, lowest common denominator, is important to partially sighted users who browse with a speech device. Design Strategies Lowest common denominator design Current version design Splitting the difference Something for everyone Good HTML Habits Write good HTML Know your audience Consider your site's purpose TEST! TEST! TEST! Design for a Variety of Displays Unknown monitor resolutions Standard monitor sizes and resolutions Monitor color issues Fixed vs Flexible Design Flexible design by default - allows resizing and adapting to various window sizes
- is closer to the spirit and the nature of the medium Fixed design - gives the designer more control of the page's dimensions
-the page looks the same regardless of the monitor size HTML Is a document containing text with embedded tags, which provide instructions for the structure, appearance and function of the contents. HTML is not a true program language A document containing two pieces
-head
-body Containers Most HTML tags are containers, they have a beginning tag and an end tag. Text within the tags will follow the tag's instructions EXAMPLE:
--The weather is gorgeous today. RESULT:
-- The weather is gorgeous today. Document Structure <HTML>
<HEAD>
<TITLE>Document Title</TITLE>
</HEAD>
<BODY>
Contents of Document
</BODY>
</HTML> Tags <HTML>;…</HTML>; is placed at the beginning and end of the document. This tells the browser that the entire document is composed in HTML <HEAD>…</HEAD> defines the head portion of the document that contains information about the document <TITLE>…</TITLE> specifies the title of the document Tags (Continued) An end tag contains the same name as the start tag, but is proceeded by a slash (/) It is the "OFF" switch for the tag. Standalone Tags The linebreak and the horizontal rule <hr> provide information about a document and don't affect its displayed contents Attributes Attributes are added within a tag to extend or modify the tag's action. You can add multiple attributes within a single tag. Tag attributes, if any, belong after the tag name, each separated by one or more spaces. Most attributes take values which follow an equal (=) sign Attribute Examples <BODY BGCOLOR="#000000"> Nesting HTML Tags Tags can be applied to content containing other HTML tags giving you multiple effects on a single document. This is nesting and to do properly, both the beginning and end tags of the enclosed tag must be completely contained within the beginning and end tags of the applied tag. Nesting Examples The weather is fabulous today
RESULT:
--The weather is fabulous today. A common mistake is to overlap the tags
EXAMPLE:
-- The weather is fabulous today Information Browsers Ignore Line breaks - line returns are ignored. Text will wrap until it encounters a or Tabs and multiple spaces Unrecognized tags Text in Comments -  Resource Book Web Design in a Nutshell by Jennifer Niederst