Table of Contents |
Recall that information on the World Wide Web is contained in web pages, and that a web page is a document written in Hypertext Markup Language (HTML) format that contains content prepared for the web. For the most part, the Web is merely a network of documents written in HTML and supported by a network protocol called Hypertext Transfer Protocol (HTTP). At its simplest, HTML is a text language that allows you to define the different components of a web page. The markup part of the name refers to how the HTML defines blocks of text to receive formatting instructions. These definitions are handled through the use of HTML tags. An HTML tag is an HTML markup code enclosed in angle brackets < > (greater than, less than symbols), that alters how content is formatted, or it does something such as link to another page. For example, an HTML tag can tell the browser to show a word in italics, to link to another web page, or to insert an image. HTML forms the basic programming language of websites. Listed below is the structural breakdown of an HTML tag.
In the above example, the opening tag, <h1>, signals the web browser that the tag content is to be treated as a heading, and should display on screen as a heading utilizing an increased font and bold. The closing tag, </h1> signals to the web browser the end of the text that will be treated by the <h1>.
In the example below, some text is being defined as a heading, while other text is being emphasized:
The HTML contained in the picture outputs the following when viewed in a web browser:
A requirement of publishing Web content via a website is that the site must have a unique address. This unique address is called a Uniform Resource Locator (URL). Typically, an URL begins with the text “www.” followed by the domain name of the site. The “www” indicates to the web browser that the URL is referencing a web server as opposed to some other type of server such as an email server. Consider the URL, http://www.sophia.org The http:// indicates that the HTTP protocol should be used to retrieve the page. When a web browser sends out a request to retrieve a web page, the request goes to a domain name server (DNS), which translates the domain name into the IP address. The server sends the requested page back to the web browser and the browser displays the requested page.
The process of developing web pages, websites, or any web content can be complex, and may involve an entire group of web designers and programmers. Depending on the size and scope, a web development project may also involve several programming languages. There are, however, some instances in which a web development project may be as simple as one person using HTML to code a web page or website. If you know HTML, then one way to develop web content is to create it in a software application such as MS Word or Notepad. These applications give users the ability to save documents in a web-enabled format. Listed below are some common HTML tags:
| Opening Tag | Closing Tag | Description |
|---|---|---|
| <html> | </html> | Opens and closes an HTML document |
| <head> | </head> | The <head>section is used to provide information about the document for use by search engines and browsers |
| <title> | </title> | The title of the document. This element is inside the <head> section. |
| <body> | </body> | The <body>section contains all the content of the web page |
| <img src=""> | none | Inserts an image into a web page. To insert an image hosted on another site, paste the image URL between the quotation marks. |
| <h1> to <h6> | </h1> to </h6> | Headings; H1 is the main heading, H2 is secondary, etc. |
| <p> | </p> | Paragraph |
| <span> | </span> | A container for inline content, such as text inside a paragraph. |
| <div> | </div> | A container for a block of content |
| <em> | </em> | Gives the contained text emphasis (usually as italics) |
| <strong> | </strong> | Makes the contained text bold |
| <a href = ""> | </a> | Creates a hyperlink of the text between the tags. Paste the URL of the webpage between the quotation marks. |
| <ol> | </ol> | Creates an ordered (numbered) list of items. 1, 2, 3, etc. |
| <ul> | </ul> | Creates an unordered (bulleted) list of items. Additional attributes can change the shape of the bullet. |
| <li> | </li> | The list tag separates items in an ordered or unordered list. Use these tags to indicate a new entry to the list. |
Source: Derived from Chapter 10 of “Information Systems for Business and Beyond” by David T. Bourgeois. Some sections removed for brevity. https://www.saylor.org/site/textbooks/Information%20Systems%20for%20Business%20and%20Beyond/Textbook.html
