Hypertext Markup Language (HTML)
The purpose of HTTP is simply to provide a common ‘language’ in which the browser and the Web server can exchange information about Web pages and other resources. The real substance of the exchange, when the browser requests a Web page, is the section of the response that describes how the page will appear inside the browser window.
The description of the Web page that the server sends is in a standard format, so that the browser can understand how the Web server wants it to display the page. This time the standard format is not in fact a protocol, because it does not define how two computers exchange information. It is actually a language, although the distinction is fine: there are rules about computer languages just as there are about a network protocols. The language that Web servers and browsers use to describe a Web page is Hypertext Markup Language (HTML). HTML is a language that is used primarily to format data on a page. It doesn’t contain any advanced support for doing complex operations; it just serves to layout the contents in a readable way on the web page. When the browser receives an HTML page, it converts the HTML description into a screen display by a process called rendering. The browser reads the HTML instructions and “renders” the result to the screen.
HTML is a text-based language, which means that you can view and edit HTML in a standard text editor like Notepad. It consists of the text on the Web page, along with ‘markup tags’ that indicate to the browser how that text should be displayed. The markup specifies items such as the font to use for sections of text, where to display embedded images, and of course hyperlinks that enable you to link to different Web pages. You can look at the HTML for any Web page in your browser by viewing the page source. (To view the page source in Internet Explorer, click the View menu, and then click Source.)
This guide does not intend to teach you how to write HTML. There are many books and online resources that can help you to learn HTML. However, the document below is a short example of a simple HTML page, which demonstrates some important concepts.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Welcome</title>
</head>
<body>
<img src="/images/logo.jpg" height="50px" width="200px" border="0" />
<h1>Welcome to Example.com</h1>
<p>Welcome to the Example.com Web site. We hope you will find lots of examples here.</p>
<p>The full list of examples is on <a href="/example-list.html">this Web page.</a></p>
</body>
</html>
HTML consists of a series of tags denoted by angle brackets around a tag name, such as the<html> tag in the example. At the end of the document is another tag, </html>. The forward slash indicates that this is the end tag that corresponds to the <html> tag at the start of the document. Everything between the two tags is called the <html> element. Inside the <html> element is a<head>element, which contains <title> and <link> elements. An HTML document consists of elements that are nested one inside another in this way.
Some of the elements define attributes inside the angle brackets as well as a tag name – the<a> and the <img> tags, for example. Attributes contain extra information about that tag that the browser uses to render the Web page. The <img> tag in the example above denotes that the browser should embed an image in the rendered Web page, and it should contain the following attributes:
src. This refers to the Uniform Resource Locator (URL) of the image to embed in the page.
height. This denotes how high the image should be in the rendered Web page – in this case, 50 pixels.
width. This denotes how wide the image should be in the rendered Web page.
border. This denotes the width of the border around the image – in this case, the border is set to 0 so browser should not display a border.
Note that the HTML document does not contain the image itself. Instead, the document contains only the URL of the image. When the browser renders this document, it performs the following steps.
- The browser sees the <img> tag in the document and recognizes that it should display an embedded image.
- The browser creates an HTTP GET request for the specified URL for the image file, and sends this request to the Web server.
- When the server has responded by sending the image, the browser embeds the image in the rendered Web page.
Comments
Post a Comment