XHTML1 Introduction to Web Pages N100 Building a Simple Web Page

XHTML2 Objectives In this chapter, you will: Learn about the World Wide Web (WWW) Create simple Hypertext Markup Language (HTML) documents Learn about the World Wide Web Consortium (W3C) Learn about Web browsers

XHTML3 Objectives Study how Extensible Hypertext Markup Language (XHTML) evolved Learn about the basics of Extensible Markup Language (XML) Learn why XML and HTML were combined to create XHTML

XHTML4 The World Wide Web The Internet is a vast network connecting computers all over the world The original plans for the Internet grew out of a series of memos written by J.C.R. Licklider of the Massachusetts Institute of Technology (MIT) in August 1962 discussing his concept of a “Galactic Network” Licklider envisioned a global computer network through which users could access data and programs from any site on the network

XHTML5 The World Wide Web Internet developed in the 1960s by the Advanced Research Projects Agency (ARPA) of the U.S. Department of Defense to connect the main computer systems of various universities and research institutions that were funded by ARPA In 1990 and 1991, Tim Berners-Lee created what would become the World Wide Web (WWW), or the Web, at the European Laboratory for Particle Physics (CERN) in Geneva, Switzerland, as a way to easily access cross- referenced documents that existed on the CERN computer network

XHTML6 The World Wide Web Accessing cross-referenced documents, known as hypertext linking, is probably the most important aspect of the Web because it allows you to quickly open other Web pages A hypertext link, or hyperlink, contains a reference to a specific Web page that you can click to quickly open that Web page

XHTML7 The World Wide Web A document on the Web is called a Web page, identified by a unique address called the Uniform Resource Locator, or URL URL commonly referred to as a Web address A URL is a type of Uniform Resource Identifier (URI), which is a generic term for many types of names and addresses on the World Wide Web A Web site refers to the location on the Internet of the Web pages and related files (such as graphic files) that belong to a company, organization, or individual

XHTML8 The World Wide Web You display a Web page on your computer screen using a program called a Web browser A home page is the primary Web page for any given Web site

XHTML9 HTML Documents Originally, people created Web pages using Hypertext Markup Language Hypertext Markup Language (HTML) is a simple language used to create the Web pages that appear on the World Wide Web A markup language is a set of characters or symbols that define a document’s logical structure or how a document should be printed or displayed

XHTML10 HTML Documents HTML is based on an older language called Standard Generalized Markup Language, or SGML, which defines the data in a document independently of how the data will be displayed A target output format refers to the medium in which a document will be displayed, such as a Web page or an online help system

XHTML11 Basic HTML Syntax HTML documents are text documents that contain: –formatting instructions, called tags –the text that is to be displayed on a Web page HTML tags range from formatting commands to controls that allow user input Tags are enclosed in brackets ( ), and most consist of a starting tag and an ending tag that surround the text or other items they are formatting or controlling

XHTML12 Common Structure and Formatting HTML Tags

XHTML13 Basic HTML Syntax All HTML documents begin with and end with Two other important HTML tags are the tag and the tag The tag contains information that is used by the Web browser, and you place it at the start of an HTML document, after the opening tag

XHTML14 Basic HTML Syntax The tag pair and the tags it contains are referred to as the document head Following the document head is the tag, which contains the document body The tag pair and the text and tags it contains are referred to as the document body A Web browser’s process of assembling and formatting an HTML document is called parsing or rendering

XHTML15 Basic HTML Syntax You use various parameters, called attributes, to configure many HTML tags You place an attribute before the closing bracket of the starting tag, and separate it from the tag name or other attributes with a space

XHTML16 Web Page Design and Authoring Web page design, or Web design, refers to the visual design and creation of the documents that appear on the World Wide Web Web page authoring refers to the creation and assembly of the tags, attributes, and data that make up a Web page This is a subtle, but important distinction: –A book on Web design teaches the visual and graphical design aspects of creating Web pages –A book on XHTML teaches the more basic concepts that you need to get started, such as how to work with tags and attributes

XHTML17 The W3C Web page authors began to find it necessary to write slightly different HTML code for each Web browser in which they anticipated their Web page would be opened To address the growing need for standards, Tim Berners-Lee established the World Wide Web Consortium, or W3C, in 1994 at MIT to oversee the development of Web technology standards

XHTML18 The W3C The W3C does not release a version of a particular technology –Instead, it issues a formal recommendation for a technology, which essentially means that the technology is (or will be) a recognized industry standard

XHTML19 Web Browsers At the time of this writing, Internet Explorer browsers are being used by more than 85% of the market –For this reason alone, the majority of the Web page examples in this book are presented in the latest release of Internet Explorer 6 NCSA Mosaic was created in 1993 at the University of Illinois and was the first program to allow users to navigate the Web using a Graphical User Interface (GUI) In 1994, Netscape released Navigator, which soon controlled 75% of the market

XHTML20 Web Browsers Three additional browsers that are worth noting are: –Amaya ( –Mozilla ( –Opera ( You must test your Web pages in every browser and browser version in which you anticipate they will be opened

XHTML21 Web Browsers Most professional Web page authors and developers ensure that their Web pages will function with Internet Explorer version 4 and higher and Netscape browsers higher than version 4 Each Web browser may render the parts of a Web page slightly differently from other browsers In addition to testing whether the technology on your Web pages works as intended, you should also test to ensure that your Web pages display properly across different browsers and browser versions

XHTML22 Web Browsers Another factor you must consider is monitor resolution Resolution refers to the number of pixels that can be displayed on a monitor A pixel (short for picture element) represents a single point on a computer screen The number of pixels available depends on a computer monitor’s resolution

XHTML23 Web Browsers A VGA monitor contains 640 columns by 480 rows of pixels, or about 300,000 pixels A Super VGA monitor contains 1024 columns by 768 rows of pixels, approximately 800,000 pixels If you use a high resolution of 1024 x 768 when creating a Web page, the Web page will appear much larger in monitors set to a resolution of 800 x 600 or 640 x 480

XHTML24 The Evolution of XHTML The Web is expanding to other media, called user agents, which are devices that are capable of retrieving and processing HTML and XHTML documents A user agent can be a traditional Web browser or a device such as a mobile phone or PDA, or even an application that simply collects and processes data instead of displaying it HTML is not suitable for user agents other than Web browsers

XHTML25 The Evolution of XHTML HTML has evolved into a markup language that is more concerned with how data appears than with the data itself Current and older versions of Web browsers allow you to write sloppy HTML code Languages based on SGML use a Document Type Definition, or DTD, to define the tags and attributes that you can use in a document, and the rules the document must follow when it includes them

XHTML26 The Evolution of XHTML When a document conforms to an associated DTD, it is said to be valid When a document does not conform to an associated DTD, it is said to be invalid You can check whether a document conforms to an associated DTD by using a program called a validating parser

XHTML27 The Evolution of XHTML Because HTML is based on SGML, it requires a DTD, and the HTML DTD is built directly into Web browsers When a Web browser opens an HTML document, it first compares the document to the DTD If an HTML document is missing any required tags, the HTML DTD supplies them, allowing the Web browser to render the page correctly

XHTML28 The Basics of XML Extensible Markup Language, or XML, is used for creating Web pages and defining and transmitting data between applications Like HTML, XML is based on SGML Version 1.0 of XML achieved recommendation status by the W3C in 1998 and was still current at the time of this writing

XHTML29 The Basics of XML In XML you refer to a tag pair and the data it contains as an element All elements must have an opening and a closing tag The data contained within an element’s opening and closing tags is referred to as its content

XHTML30 XML is Case Sensitive Unlike HTML tags, XML tags are case sensitive With XML, you cannot mix the case of elements If you use a different case for an opening and closing tag, they will be treated as completely separate tags, resulting in a document that is not well formed

XHTML31 XML Elements Must Be Properly Nested Nesting refers to how elements are placed inside other elements This paragraph is bold and italicized. In an HTML document, it makes no difference how the elements are nested

XHTML32 Empty Elements Must Be Closed Several elements in HTML do not have corresponding ending tags, including the element, which inserts a horizontal rule into the document, and the element, which inserts a line break Elements that do not require an ending tag are called empty elements because you cannot use them as a tag pair to enclose text or other elements

XHTML33 Empty Elements Must Be Closed You can create an empty element in an XML document by adding a single slash (/) before the tag’s closing bracket to close the element Most often, you use an empty element for an element that does not require content, such as an image

XHTML34 Combining XML and HTML Although XML was designed primarily to define data, this does not mean that you cannot use it to create Web pages You can create formatted Web pages using XML and Extensible Stylesheet Language, or XSL, which is a specification for formatting XML in a Web browser

XHTML35 Combining XML and HTML To make the transition to XML-based Web pages easier, the W3C combined XML and HTML to create Extensible Hypertext Markup Language (XHTML) –Combination of XML and HTML that is used to author Web pages XHTML is almost identical to HTML, except that it uses strict XML syntax to describe the parts of a document