Smart Solution

HTML has progressed through a number of versions since its inception. The latest
standard is version 4.01, which was released by the W3C in late 1999. This is the last
release of HTML in its current state. The next generation of HTML is called the
Extensible Hypertext Markup Language (XHTML).The W3C released version 1.0

of XHTML in January 2000; a revised version was released in August 2002. As defined
in the W3C XHTML recommendation (www.w3.org/TR/xhtml1/), there are three
“flavors” of XHTML:

• XHTML Strict—Use this when you want clean structural markup code, free
  of any markup tags associated with layout. Use XHTML Strict with
  Cascading Style Sheets to get the font, color, and layout effects you want. If
  you are beginning a new Web site, you should code to this recommendation.
• XHTML Transitional—This type of XHTML is designed for people writing Web
  pages for the general public.The idea is to take advantage of XHTML features,
  including style sheets, but make small adjustments to your markup code for those
  viewing your pages with older browsers, which can’t understand style sheets.
• XHTML Frameset—Use this when you want to use frames to partition the
  browser window into two or more sections.You can learn more about frames
  by reading the “Working with Frames” chapter on the Online Companion
  Web site for this book.

How do these three types of XHTML affect you as a Web developer? Your goal should
be to create code that matches the strict recommendation, using Cascading Style Sheets
for all of your display information. The benefit of the transitional type is that it allows
you to gradually migrate from existing HTML code that may still contain font and display
information to the more syntactically correct, cleaner markup code necessary to match
the strict type.

The frameset specification is important only if you plan to use frames to
partition the browser window, as described in the “Working with Frames” chapter posted
on the Online Companion Web site for this book.

HTML is a markup language, a structured language that lets you identify common
sections of a document such as headings, paragraphs, and lists. An HTML file includes
text and HTML markup (or element) tags that identify these sections. The HTML
markup tags indicate how the document sections appear in a browser. For example, the
<h1> element tags in the following code indicate that the text is a first-level heading:

<h1>WelcomeƒtoƒMyƒWebƒPage</h1>

The browser interprets the HTML markup elements and displays the results, hiding the
actual markup tags from the user. In the previous code, the user sees only the text
“Welcome to My Web Page” formatted as a level-one heading.

HTML adopts many features of SGML, including the cross-platform compatibility that
allows different computers to download and read the same file from the Web. Because
HTML is cross-platform compatible, it does not matter whether you are working on a
Windows PC, Macintosh, or UNIX computer.You can create HTML files and view
them on any computer platform.

HTML is not a What You See Is What You Get (WYSIWYG) layout tool. It was intended
only to express logical document structure, not formatting characteristics. Although
many current HTML editors let you work with a graphical interface, the underlying
code they create is basic HTML. However, because HTML was not designed as a layout
language, many editing programs create substandard code to accomplish a certain effect.

You cannot rely on the HTML editor’s WYSIWYG view to test your Web pages.
Because users can view the same HTML file with different browsers and on different
machines, the only way to be sure of what your audience sees is to preview your HTML
files in the browsers you anticipate your audience will use.

Despite its limitations, HTML is ideal for the Web because it is an open, nonproprietary
language that is cross-platform compatible. All of the markup tags are included with
every document and usually can be viewed through your browser. Once you are familiar
with the HTML syntax, you will find that one of the best ways to learn new coding
techniques is to find a Web page you like and view the source code. (You have a chance
to view the source code of a Web page in the Hands-on Projects at the end of this chapter.)

The Current State of HTML

In this section you will explore the evolution of HTML and its future as a markup language for creating Web documents.  You will analyze current design limitations of HTML, the need for style sheets that allow separation of style from structure, and the usage of hypertext as a means for organizing information.

HTML:  Then and Now

When Tim Berners-Lee first proposed HTML at the European Laboratory for Particle Physics (CERN) in 1989, he was looking for a way to manage and share large amounts of information among colleagues.  As the idea developed, Berners-Lee named the mesh the World Wide Web.  He created an application of the Standard

Generalized Markup Language (SGML), a standard system for specifying document structure, and called it the Hypertext Markup Language. 

When Berners-Lee created HTML, he adopted only the elements of SGML necessary for representing basic office documents such as memos and reports.  The need for new markup languages and standards to address these demands is handled by the World Wide Web Consortium (W3C).

HTML and the World Wide Web Consortium

After the initial surge of interest in HTML and the Web, a need arose for a standards organization to set recommended practices that would guarantee the open nature of the Web.  The W3C was founded in 1994 at the Massachusetts Institute of Technology to meet this need.  The W3C, led by Tim Berners-Lee, sets standards for HTML and provides an open, non-proprietary forum for industry and academic representatives to add to the evolution of this new medium. 

The Limitations of HTML

HTML is a markup language, a structured language that lets you identify common sections of a document such as headings, paragraphs, and lists.  An HTML file includes text and HTML markup elements that identify these sections.  The HTML markup elements indicate how the document sections appear in a browser.  For example, the <h1> element tags in the following code indicate that the text is first-level heading:

<h1>Welcome to My Web Page</h1>

HTML adopts many features of SGML, including the cross-platform compatibility that allows different computers to download and read the same file from the Web.  HTML is not a What You See Is What You Get (WYSIWYG) layout tool.  It was intended only to express logical document structure, not formatting characteristics.  Because HTML was not designed as a layout language, many editing programs create less-than-standard code to accomplish a certain effect.  You cannot rely on the HTML editor’s WYSIWYG view to test your Web pages.  Despite its limitations, HTML is ideal for the Web because it is an open, non-proprietary, cross-platform compatible language.

The Need for Style Sheets

Browser developers to help HTML authors bypass the design limitations of HTML introduced style elements such as <font>.  Designers and writers who are accustomed to working with today’s full-featured word processing programs want the same ability to manipulate and position objects precisely on a Web page as they can on the printed page.  Mixing style information within the structure, as is the case in most of the Web today, limits the cross-platform compatibility of the content.  Whether you come to the Web with a Personal Digital Assistant (PDA), a Personal Communication Services (PCS) telephone, or Windows CE device, the Web server can determine the type of requesting device and supply a style sheet that matches the device.

This separation of style and structure was accomplished in 1996 by the W3C’s specification for a Web style language.  The style language, named Cascading Style Sheets (CSS), allows authors to create style rules for elements and express them externally in a document known as a style sheet. 

How can you handle the demands of different browsers while designing attractive Web pages?  Some HTML authors suggest that you use an older version of HTML to ensure portability.  Others say that you should push the medium forward by coding to the latest standard and using the most recent enhancements. 

 

Lowest Common Denominator Coding

 

Although it can be difficult to create pages that are always displayed properly, it is not impossible.  One way to create portable pages is to use a lowest-common-denominator approach.  This approach provides the greatest acceptance across browsers, because the authors choose to code their HTML using the next-to-last release of HTML.   

 

Cutting-Edge Coding

 

Another strategy to adopt when designing your Web site is to stay at the cutting edge.  By requiring the latest software, some designers insist that their users keep up with them.  This design strategy can result in visually exciting and interactive sites that keep pace with the latest technology.  Plug-ins are helper applications that assist a browser in rendering a special effect.  Without the plug-in, your user will not see the results of your work.

 

Browser-Specific Coding

 

Some Web sites are coded for one particular browser or brand of browsers only.  The author may have wanted to use a unique enhancement for the site, or may have found that the site did not render properly in other browsers.  On the Web, you never can be sure of the type of browser your user has.  However, this method of browser-specific coding may be viable on a company intranet, where you know or you can specify that all users have the same brand and version of browser. 

 

Solving the Browser Dilemma

 

You must test your work in as many browsers as possible during the entire development process to make sure that your pages will render properly.  Knowing your audience is a major step towards correctly implementing your site.  Many general Web users access the Web view America Online, Inc. (AOL), so test your work using their browser as well.  In an academic environment you may encounter readers that use Lynx, a text-only browser. 

 

Coding for Multiple Screen Resolutions

 

A computer monitor’s screen resolution is the width and height of the computer screen in pixels.  Most monitors can be set to at least two resolutions, whereas larger monitors have a broader range from which to choose.  Screen resolution is a function of the monitor’s capabilities and the computer’s video card.  The three most common screen resolutions (traditionally expressed as width X height in pixels) are 640 X 480, 800 X 600, and 1024 X 768.  Figure 1-3 on page 15 of the textbook shows a Web page coded at 800 X 600 and viewed at 640 X 480 with horizontal scroll bars. 

Paragraphs

Paragraphs are defined with the <p> tag.

 <p>This is a paragraph</p>
 <p>This is another paragraph</p>

HTML automatically adds an extra blank line before and after a paragraph.

Line Breaks

The <br> tag is used when you want to end a line, but don’t want to start a new paragraph. The <br> tag forces a line break wherever you place it.

 <p>This <br> is a para<br>graph with line breaks</p>

The <br> tag is an empty tag. It has no closing tag.

Comments in HTML

The comment tag is used to insert a comment in the HTML source code. A comment will be ignored by the browser. You can use comments to explain your code, which can help you when you edit the source code at a later date
 
 <!– This is a comment –>

Note that you need an exclamation point after the opening bracket, but not before the closing bracket

By: Ian