What Is a Markup Language? [+ 7 Examples]

What Is a Markup Language?

A markup language is a system for defining the structure, presentation, and/or purpose of content within a digital document so computer programs can interpret and display the content correctly.

Markup languages encode text using specific vocabulary, symbols, and/or syntax rules.

For example, the <h1> tag in HTML (hypertext markup language) communicates that the enclosed text is a top-level heading.

Search engines can use this information to better understand the subject matter of your page. While browsers can use this information to apply the relevant styling.

Here’s what an H1 looks like on the page and in the backend:

Markup languages can:

• Make your website more search engine-friendly
• Ensure your content displays consistently across different technologies
• Improve website accessibility

Markup Languages vs. Programming Languages

Markup languages and programming languages are both types of computer languages used to structure, display, and manipulate content or data—but they aren’t the same thing.

Programming languages provide logic that computers can execute. This enables the program to react to inputs, perform calculations, make decisions, and complete tasks.

For example, you can program a button to change color when a user hovers on it.

In contrast, markup languages can only define an element’s structure and appearance at the time it’s loaded. Markup cannot change an element’s state or behavior dynamically.

Python, JavaScript, and PHP are examples of programming languages.

Types of Markup Languages

Markup languages can be semantic, presentational, procedural, or a combination of these types.

Semantic markup (or descriptive markup) provides meaning to content by labeling that content’s structure and purpose. Which can help browsers, search engines, and developers interpret the content correctly.

For example,in XML, <author>John Doe</author> identifies “John Doe” as the author of an article. But the markup doesn’t affect the presentation of this text.

Presentational markup controls the visual appearance of content so users see content in a specific way. This markup defines how the text should look without specifying how the system should render it.

For example, in HTML, <b>Bold Text</b> marks the enclosed text as bold but doesn’t dictate the exact process the browser should use to achieve that appearance.

Procedural markup provides step-by-step commands for how content should be processed, formatted, or displayed. Instead of defining appearance, this markup directs the system on what to do with the text.

For example, In LaTeX, \textbf{Bold Text} instructs the typesetting system to apply a bold font weight based on its backend processing rules.

7 Markup Language Examples

Some of the most widely used markup languages include HTML, XML, markdown, SVG, LaTeX, SGML, and XHTML.

Let’s explore these markup languages in more detail:

1. HTML

HTML is the standard markup language used to structure and organize content on webpages.

The latest version of HTML is called HTML5.

You define elements in an HTML document by enclosing content in HTML tags. 

Like these:

You can also use semantic HTML to label different parts of your page—e.g., the header, navigation menu, and footer. This helps search engines, assistive technologies (like screen readers), and developers understand your content’s purpose.

Here’s an illustration of non-semantic HTML compared to semantic HTML:

Many kinds of HTML tags include attributes, which provide additional information about the element.

Attributes have a name and a value. For example, the href attribute is used to define a hyperlink’s destination:

HTML is commonly used with JavaScript (a programming language that adds interactivity) and CSS (a style sheet language that defines the styling of HTML content).

2. XML

XML (extensible markup language) is used for storing and transporting data.

This markup language is important in SEO because SEO professionals use it to create XML sitemaps.

Your XML sitemap should list all the pages on your site you want search engines to index (i.e., add to the database of possible search results). The XML format helps search engine crawlers read the file.

In XML, you’re not limited to a predefined set of tags. You can create custom tags to describe data. 

Here’s an example of a simple system that organizes and holds structured information data about articles:

<article>
  <title>What Is a Markup Language?</title>
  <author>Rachel Handley</author>
  <year>2025</year>
</article>

3. Markdown

Markdown is a lightweight markup language that uses symbols to format text in a plain-text editor. 

The language’s simple syntax makes it ideal for quick formatting and easy readability across different environments.

Markdown is widely supported across word processors, instant messaging apps, online forums, documentation tools, note-taking applications, developer platforms, blogging sites, and project management tools.

Some platforms, such as Reddit and GitHub, use their own versions of markdown.

4. SVG

SVG (Scalable Vector Graphics) is a markup language used to describe vector graphics.

Vector graphics are images created from mathematical equations. This means they can only be used for relatively simple graphics, but these graphics can be resized without losing quality.

For example, the SVG code below creates a blue circle that takes up 80% of the smallest side of its container and is centered in the container.

<svg viewBox="0 0 100 100" width="100%" height="100%" xmlns="http://www.w3.org/2000/svg">
    <circle cx="50" cy="50" r="40" fill="blue" />
</svg>

SVG images remain sharp at any size and typically load faster than raster graphics (such as JPEGs and PNGs). This makes SVG a good choice for logos, icons, charts, and other simple graphics.

5. LaTeX

LaTeX is a procedural markup language generally used to prepare scientific papers, research articles, and mathematical content—usually in a PDF format.

The language allows users to display complex equations with proper notation, like this:

LaTeX also makes handling citations, bibliographies, footnotes, and other elements that can be challenging to manage in other markup languages easier.

6. SGML

SGML (standard generalized markup language) is a framework for creating markup languages—it was the foundation for HTML and XML.

To start with SGML, craft a Document Type Definition (DTD). The DTD outlines the document structure and lists the elements, attributes, and entities you will use.

You can then write your document according to these established guidelines.

Here’s a brief example:

<!DOCTYPE book [
    <!ELEMENT book (title, chapter+)>
    <!ELEMENT title (#PCDATA)>
    <!ELEMENT chapter (#PCDATA)>
]>
<book>
    <title>Sample SGML Document</title>
    <chapter>Introduction to SGML</chapter>
</book>

Today, most developers prefer to use HTML or XML instead of SGML. Because HTML and XML are more user-friendly and widely supported.

7. XHTML

XHTML is a blend of HTML and XML that merges HTML’s presentation features with XML’s strict syntax rules.

XHTML was developed to improve code and browser compatibility. But many of these improvements became redundant with the introduction of HTML5.

Most developers now use HTML5 over XHTML due to HTML5’s adaptability and ability to keep up with the evolving digital landscape.

Should I Learn Markup Languages?

Learning relevant markup languages can help you edit documents, structure content, manage websites, or format academic papers without relying on external help.

However, many platforms provide a WYSIWYG (what you see is what you get) editor. This means you can edit content visually and the platform automatically generates the underlying markup language.

For example, applying the “H1” style in the WordPress visual editor applies an <h1> tag in the page’s HTML code:

If your project requires advanced functionality, custom development, or complex integrations, consider hiring a knowledgeable web developer to handle coding. Doing so can help ensure efficiency, scalability, and professional-quality results.

How to Learn Markup Languages

You can learn markup languages by following online tutorials, participating in relevant communities, or using interactive code editors.

These are some of my favorite resources:

• W3Schools provides free guides, video tutorials, quizzes, and exercises for various markup languages. The site also offers paid courses and certification exams.
• Codecademy provides a variety of free learning resources. It also lets you experiment with HTML code in a workspace and see the rendered result in your browser.
• MDN Web Docs (the Mozilla Developer Network) provides a variety of free tools and resources for learning HTML. It can also teach you about related technologies like JavaScript and CSS.
• Stack Overflow is a forum about web development. If you have a question, it’s probably been asked and answered before—if not, you can post a new question.

Find and Fix Markup Errors on Your Website

Just one misplaced symbol can create a markup language error, so checking your content before and after publishing is crucial.

Semrush’s Site Audit tool flags markup issues that could affect your website’s SEO performance. Such as:

• XML sitemap formatting errors
• HTML errors (e.g., missing title tags or doctype declarations)
• SVG image file errors

The tool also identifies other issues with your technical and on-page SEO, provides advice on how and why to fix these issues, and lets you create tasks for your team.

With a free Semrush account, you can audit up to 100 pages per month.