Markup languages are the invisible backbone of many things we do on a computer, like sending messages, viewing documents, and browsing the internet. Here’s a brief look at what they do.
The text you’re reading right now isn’t just made up of text characters. When a group of characters are in bold, italics, or underlined, they are formatted. Under the hood (in a way you can’t see while reading this), these characters are wrapped in tags to make them appear that way. The same goes for text that is smaller, appears in a different color, or is written in a different font. To make this happen, the text has to be written in something called a markup language by the author.
Markup language is a system for formatting and arranging the elements in a document using tags. Unlike physical annotations and markups on paper documents, these tags only appear in the document while the author is writing the text. When an application processes the markup, the content will simply appear as formatted text to the viewer. For example, in the markup language HTML, we can wrap the phrase “Hello world!” in bold tags.
When this text is processed by an HTML viewer, like a web browser, it will appear as:
Markup isn’t limited to processing simple text characters like the alphabet and numbers, however. Depending on the language, it can process and format special characters, allow you to embed other elements like images, videos, applications, and machine-readable data.
Common Markup Languages
The two most common markup languages are HTML, which is used to construct web pages seen across the internet, and XML, which stores structured data using customizable tags.
When you look at most pages on the internet, you’re essentially downloading and viewing an HTML page. The page you’re reading right now is written in HTML. In fact, in many browsers, you can right-click on the page to see the HTML syntax of the entire page. HTML supports creating various structures and sections inside a page, defining elements within a page, and formatting text. HTML tags typically require opening and closing tags, like the following:
The above example creates a link to the HowToGeek website like this: HowToGeek. Notice how there is an opening tag
<a> with the attribute
href pointing to the link, and a closing tag
Here are a few more famous markup languages that you might be familiar with:
- BBCode: A light markup language widely used in online forums and message boards and easily recognizable with its use of square brackets, like
[b]Hello World![/b]to create bold tags.
- LaTeX: A fairly complex language often used for academic and technical purposes. It has robust options for processing syntax that most languages can’t display, such as complex mathematics and defunct languages.
- MathML: A language used to display mathematical formulas, particularly inside web browsers.
- Textile: A language used for certain online blogs and content management systems.
- SVG: You might be surprised to know that SVG, a format that displays a scalable vector graphic, is actually a markup language. It is based on XML and uses structured data to store information about the graphic.
Markup vs. Markdown
If you’ve heard about markup, you’ve likely heard of Markdown. On the surface, it sounds like the opposite of markup; however, it’s actually just a type of markup language. Markdown is a simplified, easy-to-use formatting syntax that contains many of the basic text options present in more complex languages while avoiding things like closing tags and embedded non-text elements.
Markdown is popular among many because of its ease-of-use and lack of difficult-to-read elements. This makes it an ideal syntax for text-focused applications and websites. Among these websites is Reddit, which uses the markdown syntax for all posts and comments. This makes it easy for Redditors to format text from any device without having to add long tags. It also complements Reddit’s decision to disallow embedded media in the comments.
Other services that use Markdown are code repositories like Github, messengers like WhatsApp and Discord, and text editors like Typora and StackEdit. If you want to learn how to use it, check out our markdown guide. Happy tagging!