Every time you open a webpage, your browser quietly reads a set of instructions that tell it what is a heading, what is a paragraph, where an image should sit, and which words link to another page. Those instructions are written in a markup language. Without markup languages, the web would be a flat wall of text with no structure, no formatting, and no way for machines to understand what content actually means. This post explains what markup languages are, why they sit at the heart of web development, and how the big three – SGML, HTML, and XML – work and differ.
Table of Contents
- What is a markup language?
- How tags structure content
- Why markup languages matter
- Information representation and accessibility
- Types of markup languages
- SGML: the parent language
- HTML: the language of web pages
- XML: the language of data
- How HTML works
- Tags and elements
- Attributes
- Semantic HTML
- XML vs. HTML
- Purpose: display versus data
- Tags: fixed versus custom
- Rules: forgiving versus strict
- How XML enables data sharing
What is a markup language?
A markup language is a system for annotating a document so that a computer can understand its structure and meaning. Instead of writing plain text, you add labels – called tags – around the content to describe its role. A tag might say “this is a title,” “this is a paragraph,” or “this is a list item.” The computer reads these labels and processes the content accordingly.
The word “markup” comes from traditional publishing. Before printing, editors would “mark up” a manuscript with handwritten notes telling the typesetter how text should appear. Digital markup languages do the same job, except the notes are tags that structure, annotate, and format textual information for electronic devices.
Importantly, markup languages are not programming languages. They do not contain logic, loops, or calculations. Their job is to describe and organise content, not to perform actions. A markup language gives a document a predictable structure that both humans and machines can read.
How tags structure content
Most markup tags work in pairs. There is a start tag and an end tag, and the content sits between them. For example, an element typically looks like a start tag <some-element> and a matching end tag </some-element>. The browser or software reads these boundaries to know where a piece of content begins and ends.
This tagging approach makes documents machine-readable. A search engine can identify a heading, a screen reader for visually impaired users can announce a navigation menu, and a content management system can pull out the right pieces of information – all because the markup tells them what each part is.
Why markup languages matter
Markup languages matter because they separate content from the way it is handled. The same marked-up document can be displayed on a desktop, a phone, or read aloud, while the underlying structure stays consistent. This separation is what makes digital content flexible and reusable.
In web development, markup is the foundation layer. It forms the skeleton of every webpage before any visual styling or interactivity is added. A page built without proper markup is like a building without a frame – there is nothing for the rest to hang on.
Information representation and accessibility
For students of library and information science, markup languages are especially relevant because they are central to how information is represented, stored, and retrieved. Digital libraries, catalogues, and content management systems all rely on structured markup to organise metadata and make documents searchable.
Markup also drives accessibility. Semantic markup labels content’s structure and purpose, which helps browsers, search engines, and assistive technologies like screen readers interpret information correctly. When a heading is tagged as a heading rather than just made to look big, software can navigate the document properly. This is the difference between content that merely looks organised and content that is genuinely understood by machines.
Types of markup languages
There are many markup languages in use today, including HTML, XML, Markdown, SVG, and LaTeX. For understanding the World Wide Web, three are essential: SGML, HTML, and XML. The first is the ancestor; the other two are its most famous descendants.
SGML: the parent language
SGML stands for Standard Generalized Markup Language. It is not a language for writing web pages directly. Instead, it is a system for defining other markup languages – a framework that sets the rules for how tags should work. Any markup language built using SGML’s rules is called an SGML application.
SGML has deep roots. Its first working draft appeared in 1980, and the final version was published as the ISO 8879 standard in 1986. It became the foundation for an entire family of markup languages, including HTML and XML. SGML’s strength was that it allowed documents to be tagged in a way that was independent of how they would eventually be displayed, so the same content could be transformed into different formats.
The drawback was complexity. SGML was powerful but difficult to learn and implement, which made it impractical for the simple, fast-growing needs of the early web. As a result, simpler, more specialised languages took over for everyday use, even though SGML’s core ideas live on inside them.
HTML: the language of web pages
HTML stands for HyperText Markup Language. It was created by Sir Tim Berners-Lee, a British scientist working at CERN, the European nuclear research organisation. In 1989 he proposed a system for scientists to share documents over a network, and HTML became the language for encoding those documents. He built it on top of existing SGML rather than inventing a new standard from scratch, borrowing the idea of tags written between angle brackets.
The very first version had fewer than two dozen tags. HTML was deliberately kept simple so that people who were not SGML experts could publish technical and scientific documents on the web. That simplicity is exactly why it spread so quickly once the web reached the public in the mid-1990s.
Since 1996, the HTML specification has been maintained by the World Wide Web Consortium (W3C), the body Berners-Lee founded in 1994 to standardise web technologies. The current generation, HTML5, is widely supported across browsers and devices and is the standard for modern web pages.
XML: the language of data
XML stands for Extensible Markup Language. It was developed by the W3C and established under the XML 1.0 specification in 1998. Like HTML, it is a simplified application of SGML, but it was designed with a completely different goal in mind. While HTML focuses on displaying content, XML focuses on carrying and storing data.
The word “extensible” is the key. Unlike HTML, where the tags are fixed and predefined, XML lets you invent your own tags to describe whatever data you have. If you are storing details about a book, you can create tags such as <title>, <author>, and <publisher>. The markup describes what the data is, not how it should look.
How HTML works
An HTML document is built from three closely related building blocks: tags, elements, and attributes. Understanding how these fit together explains how every webpage is constructed.
Tags and elements
A tag is the label written inside angle brackets, like <p> for a paragraph. Most tags come in pairs: an opening tag and a closing tag that includes a forward slash, such as <p> and </p>. An element is the complete package – the opening tag, the content inside, and the closing tag together. So <p>Hello</p> is a paragraph element.
HTML provides tags for many kinds of content: headings, paragraphs, lists, links, images, and tables, among others. When a browser receives an HTML document, it reads each tag and renders the content visually. The browser interprets the markup and adapts the layout to the screen size and fonts available to it, which is why the same page can look right on both a laptop and a phone.
Attributes
Many HTML tags carry attributes, which provide extra information about an element. Attributes appear inside the opening tag and usually come in name-and-value pairs. For example, a link element uses an href attribute to specify the web address it points to, and an image element uses a src attribute to specify where the image file is located.
Semantic HTML
Modern HTML encourages the use of semantic tags – tags that describe the meaning of a section rather than just its appearance. Tags such as those for a header, navigation menu, main content, and footer tell software what role each part of the page plays. This helps search engines rank pages more accurately and helps assistive technologies serve users who rely on them. Writing semantic HTML is now considered a core good practice in web development.
XML vs. HTML
HTML and XML look similar because both use angle-bracket tags and both descend from SGML. But they were built for opposite purposes, and knowing the difference is essential.
Purpose: display versus data
The central difference is what each language is for. HTML is designed to display data and control how it looks, while XML is designed to carry, transport, and store data. HTML answers the question “how should this appear on screen?” XML answers the question “what does this data mean?”
Tags: fixed versus custom
HTML uses a fixed set of predefined tags. You cannot invent a new HTML tag and expect a browser to understand it. XML is the reverse – it has no predefined tags at all. You define your own tags to suit your data, and the document becomes self-descriptive. This flexibility is what makes XML so useful for representing structured information across very different fields.
Rules: forgiving versus strict
HTML is fairly forgiving. If you forget to close a tag, most browsers will still try to display the page. XML is strict: every tag must be properly closed and correctly nested, or the document will not be processed at all. This strictness is deliberate, because without it, reliable data exchange between different applications would be impossible.
How XML enables data sharing
Because XML separates data from presentation and follows strict, predictable rules, it acts as a common language that different systems can all understand. When two pieces of software need to swap information, XML provides a standardised, platform-independent format for doing so. XML is used across web services, document management, configuration files, data serialisation, and RSS feeds.
A familiar example is the RSS feed, an XML-based format that lets news sites, blogs, and podcasts publish updates that other applications can automatically collect. Another is the configuration file: many software applications, including web servers and mobile apps, store their settings in XML so administrators can change behaviour without rewriting code. Even modern office document formats are built on XML-based structures underneath. In each case, XML works because the receiving system can rely on the structure being consistent and meaningful.
It is worth noting that the two languages often work together. A system might store its information in XML for reliability and then convert it into HTML for display in a browser, getting the best of both worlds – structured data behind the scenes and readable pages on screen.
What do you think? If you were designing a digital library catalogue, would you choose HTML, XML, or a combination of both to represent your records – and why? And as the web increasingly relies on machines reading content, how important do you think semantic markup will become for the future of information retrieval?
References
- https://www.stickyminds.com/article/markup-languages-what-they-are-and-why-they-matter
- https://www.semrush.com/blog/markup-language/
- https://www.htmlwasher.com/history-of-html/
- https://alistapart.com/article/a-brief-history-of-markup/
- https://www.deltaxignia.com/blog/the-world-of-xml-and-json/whats-the-relationship-between-xml-json-html-and-the-internet
- https://www.bitechnology.com/what-is-xml-how-is-it-used/
- https://www.brighthub.com/internet/web-development/articles/109224/
- https://medium.com/@AlexanderObregon/xml-in-the-real-world-use-cases-and-applications-8b3d2d928a12

Leave a Reply