Hypertext Markup  «Prev  Next»

Lesson 1

(HTML) Hypertext Markup Language

In this module, you will learn to use (HTML)Hypertext Markup Language, which is the language of the Web. The following lessons will get you up and running with the basic HTML elements you will need to create your own website.
After completing this module, you will be able to:
  1. Identify file-naming conventions and directory structures
  2. Identify editors used to create Web pages
  3. Identify the HTML page structure and the tags used
  4. Explain META tags
  5. Define commonly used HTML tags
  6. Create a simple HTML page

Along the way, you will also learn the best practices for HTML coding and page design, and where to turn for additional information.

Brief History of HTML and XHTML

As of April 2019, most front-end web development is done using HTML5. XHTML 1.0 was the successor technology to HTML 4.1. HTML 4.0 was recommended by the W3C in December of 1997 and became the official standard in April 1998. Browser support was provided by Microsoft in their Internet Explorer browser. During this time period (1997), Netscape's flawed Navigator 4.7 was insufficient with respect to HTML 4.0 and even basic CSS. After HTML 4.0 had been adapted by web developers and publishers, the documentation was revised and corrected in a few ways and was renamed HTML 4.01, which was the final version of the specification. Perhaps you would simply like to understand the basic structure of a web page? Since the introduction of HTML5 as the primary markup language for the web, I would forget about XHTML and start creating content using HTML5. This section deals with the high-level concepts relating to HTML, rather than the specific elements or attributes. Even if you think you know HTML really well, there may be one or two surprises in this section. While this reference aims to provide a thorough breakdown of the various HTML elements and their respective attributes, you also need to understand how these items fit into the bigger picture. A web page is structured as follows. The first item to appear in the source code of a web page is the doctype declaration. This provides the web browser (or other user agent) with information about the type of markup language in which the page is written, which may or may not affect the way the browser renders the content. Most WYSIWYG web editors will create the doctype for you automatically after you have selected the doctype from a drop down list.

SEMrush Software

XHTML 1.1 still supported by Modern Web Browsers

While HTML5 is the primary markup language used for web development, XHTML 1.1 is still supported by modern web browsers and can be used for specific purposes. However, its use is generally considered outdated and not recommended for new projects.
Here's a summary of the current and potential future uses of XHTML 1.1:
Current Uses:
  1. Legacy Projects: XHTML 1.1 may still be used in older websites or web applications that were developed before HTML5 became widely adopted.
  2. Strict Document Requirements: In some cases, XHTML 1.1 might be preferred when strict document validation is required, as it adheres more closely to XML syntax rules.
  3. Specific Modules: XHTML 1.1 offers modules for features like Ruby annotations, which may be useful in niche applications.

Near Future Uses:
  1. Educational Purposes: XHTML 1.1 may continue to be used in educational settings to teach the fundamentals of XML-based markup languages.
  2. Legacy Content Migration: While new projects should use HTML5, XHTML 1.1 content may be migrated to HTML5 in the future to ensure compatibility with modern web standards.
  3. Archiving and Preservation: XHTML 1.1 documents may be archived for historical or preservation purposes to maintain access to older web content.

Overall, XHTML 1.1's use is declining as HTML5 continues to evolve and gain wider adoption. For new web development projects, HTML5 is the recommended choice due to its improved features, flexibility, and support for modern web technologies.

Features of HTML 5

  1. HTML is the core technology of the web used for structuring and presenting content within browsers.
  2. The latest version of the HTML specification contains new semantics such as video, audio, drag-n-drop, and canvas.
  3. Buzzwords used to describe various front-end web technologies: JavaScript, CSS3, Geolocation, SVG.
  4. HTML is one technology which will allow your content to function across multiple screens and devices.

Origins of HyperText

Ted Nelson, father of the Xanadu Project, coined the term "hypertext" over 30 years ago, as a way of describing "non-sequential writing, text that branches and allows choice to the reader."
Unlike the static text of print media, it is intended for use with an interactive computer screen. It is open, fluid and mutable, and can be connected to other pieces of hypertext by "links". The term was extended under the name hypermedia to refer not only to text, but to other media as well, including graphics, audio, and video. However, the original term hypertext persists as the label for technology that connects documents and information resources through links.
From the very beginnings of Internet technology, there has been the vision of using the Internet as a universal medium for exchanging information over computer networks. Ted Nelson's Xanadu project aspired to make that dream a reality, but the goals were lofty and were never fully realized. Internet file sharing services (such as FTP and Gopher) and message forum services (such as Netnews) provided increasingly powerful mechanisms for this sort of information exchange, and certainly brought us closer to fulfilling those goals. However, it took Tim Berners-Lee to combine the notion of hypertext with the power of the Internet, bringing those initial dreams to fruition in a way that the earliest developers of both hypertext and Internet technology might never have imagined. His vision was to connect literally everything together, in a uniform and universal way.
In the next lesson, you will learn file naming and directory structure basics to keep in mind as you design your Web site.