Title: HTML
Published: 2 February 2024
Last modified: 31 July 2024

---

[Home](https://learn.wordpress.org)[Courses](https://learn.wordpress.org/courses/)
[Beginner WordPress Developer](https://learn.wordpress.org/course/beginner-wordpress-developer/)
HTML

 [ Exit Course ](https://learn.wordpress.org/course/beginner-wordpress-developer/)

 1.   a.  [   WordPress and web servers  ](https://learn.wordpress.org/lesson/wordpress-and-web-servers/)
         [Preview](https://learn.wordpress.org/lesson/wordpress-and-web-servers/)
      b.  [   The WordPress file structure  ](https://learn.wordpress.org/lesson/the-wordpress-file-structure/)
         [Preview](https://learn.wordpress.org/lesson/the-wordpress-file-structure/)
      c.  [   The WordPress database  ](https://learn.wordpress.org/lesson/the-wordpress-database/)
         [Preview](https://learn.wordpress.org/lesson/the-wordpress-database/)
      d.  [   Permalinks, rewriting urls on Apache and Nginx  ](https://learn.wordpress.org/lesson/permalinks-rewriting-urls-on-apache-and-nginx/)
         [Preview](https://learn.wordpress.org/lesson/permalinks-rewriting-urls-on-apache-and-nginx/)
      e.  [   Front-end page request  ](https://learn.wordpress.org/lesson/front-end-page-request/)
         [Preview](https://learn.wordpress.org/lesson/front-end-page-request/)
      f.  [   Admin page request  ](https://learn.wordpress.org/lesson/admin-page-request/)
         [Preview](https://learn.wordpress.org/lesson/admin-page-request/)
 2.   6 lessons
 3.   a.  [   Local development environment  ](https://learn.wordpress.org/lesson/local-development-environment/)
         [Preview](https://learn.wordpress.org/lesson/local-development-environment/)
      b.  [   WordPress Installation  ](https://learn.wordpress.org/lesson/wordpress-installation/)
         [Preview](https://learn.wordpress.org/lesson/wordpress-installation/)
      c.  [   Code editor  ](https://learn.wordpress.org/lesson/code-editor/) [Preview](https://learn.wordpress.org/lesson/code-editor/)
      d.  [   Other useful development tools  ](https://learn.wordpress.org/lesson/other-useful-development-tools/)
         [Preview](https://learn.wordpress.org/lesson/other-useful-development-tools/)
 4.   4 lessons
 5.   a.  [   HTML  ](https://learn.wordpress.org/lesson/html/) [Preview](https://learn.wordpress.org/lesson/html/)
      b.  [   CSS  ](https://learn.wordpress.org/lesson/css/) [Preview](https://learn.wordpress.org/lesson/css/)
      c.  [   JavaScript  ](https://learn.wordpress.org/lesson/javascript/) [Preview](https://learn.wordpress.org/lesson/javascript/)
      d.  [   PHP  ](https://learn.wordpress.org/lesson/php/) [Preview](https://learn.wordpress.org/lesson/php/)
      e.  [   MySQL  ](https://learn.wordpress.org/lesson/mysql/) [Preview](https://learn.wordpress.org/lesson/mysql/)
 6.   5 lessons
 7.   a.  [   WordPress Hooks  ](https://learn.wordpress.org/lesson/wordpress-hooks/) 
         [Preview](https://learn.wordpress.org/lesson/wordpress-hooks/)
      b.  [   Action Hooks  ](https://learn.wordpress.org/lesson/action-hooks/) [Preview](https://learn.wordpress.org/lesson/action-hooks/)
      c.  [   Filter Hooks  ](https://learn.wordpress.org/lesson/filter-hooks/) [Preview](https://learn.wordpress.org/lesson/filter-hooks/)
      d.  [   Working with hooks  ](https://learn.wordpress.org/lesson/working-with-hooks/)
         [Preview](https://learn.wordpress.org/lesson/working-with-hooks/)
 8.   4 lessons
 9.   a.  [   Introduction to themes for developers  ](https://learn.wordpress.org/lesson/what-is-a-theme/)
         [Preview](https://learn.wordpress.org/lesson/what-is-a-theme/)
      b.  [   Theme structure  ](https://learn.wordpress.org/lesson/theme-structure/) 
         [Preview](https://learn.wordpress.org/lesson/theme-structure/)
      c.  [   Main stylesheet  ](https://learn.wordpress.org/lesson/main-stylesheet/) 
         [Preview](https://learn.wordpress.org/lesson/main-stylesheet/)
      d.  [   Templates  ](https://learn.wordpress.org/lesson/templates-3/) [Preview](https://learn.wordpress.org/lesson/templates-3/)
      e.  [   Global settings and styles  ](https://learn.wordpress.org/lesson/global-settings-and-styles/)
         [Preview](https://learn.wordpress.org/lesson/global-settings-and-styles/)
      f.  [   Create Block Theme plugin  ](https://learn.wordpress.org/lesson/create-block-theme-plugin/)
         [Preview](https://learn.wordpress.org/lesson/create-block-theme-plugin/)
 10.  6 lessons
 11.  a.  [   What is a plugin?  ](https://learn.wordpress.org/lesson/what-is-a-plugin/)
         [Preview](https://learn.wordpress.org/lesson/what-is-a-plugin/)
      b.  [   Plugin requirements  ](https://learn.wordpress.org/lesson/plugin-requirements/)
         [Preview](https://learn.wordpress.org/lesson/plugin-requirements/)
      c.  [   Custom post types  ](https://learn.wordpress.org/lesson/custom-post-types/)
         [Preview](https://learn.wordpress.org/lesson/custom-post-types/)
      d.  [   Custom taxonomies  ](https://learn.wordpress.org/lesson/custom-taxonomies/)
         [Preview](https://learn.wordpress.org/lesson/custom-taxonomies/)
      e.  [   Custom post type data  ](https://learn.wordpress.org/lesson/custom-post-type-data/)
         [Preview](https://learn.wordpress.org/lesson/custom-post-type-data/)
      f.  [   Enqueuing CSS or JavaScript  ](https://learn.wordpress.org/lesson/enqueuing-css-or-javascript/)
         [Preview](https://learn.wordpress.org/lesson/enqueuing-css-or-javascript/)
 12.  6 lessons
 13.  a.  [   Setting up your block development environment  ](https://learn.wordpress.org/lesson/setting-up-your-block-development-environment/)
         [Preview](https://learn.wordpress.org/lesson/setting-up-your-block-development-environment/)
      b.  [   Scaffolding a new block  ](https://learn.wordpress.org/lesson/scaffolding-a-new-block/)
         [Preview](https://learn.wordpress.org/lesson/scaffolding-a-new-block/)
      c.  [   Building your first block  ](https://learn.wordpress.org/lesson/building-your-first-block/)
         [Preview](https://learn.wordpress.org/lesson/building-your-first-block/)
      d.  [   Block functionality  ](https://learn.wordpress.org/lesson/block-functionality/)
         [Preview](https://learn.wordpress.org/lesson/block-functionality/)
      e.  [   Block attributes  ](https://learn.wordpress.org/lesson/block-attributes-2/)
         [Preview](https://learn.wordpress.org/lesson/block-attributes-2/)
      f.  [   Block supports and styles  ](https://learn.wordpress.org/lesson/block-supports-and-styles/)
         [Preview](https://learn.wordpress.org/lesson/block-supports-and-styles/)
      g.  [   Static vs dynamic blocks  ](https://learn.wordpress.org/lesson/static-vs-dynamic-blocks/)
         [Preview](https://learn.wordpress.org/lesson/static-vs-dynamic-blocks/)
 14.  7 lessons
 15.  a.  [   The WordPress REST API  ](https://learn.wordpress.org/lesson/the-wordpress-rest-api/)
         [Preview](https://learn.wordpress.org/lesson/the-wordpress-rest-api/)
      b.  [   Using the WordPress REST API  ](https://learn.wordpress.org/lesson/using-the-wordpress-rest-api/)
         [Preview](https://learn.wordpress.org/lesson/using-the-wordpress-rest-api/)
      c.  [   Interacting with the WordPress REST API  ](https://learn.wordpress.org/lesson/interacting-with-the-wordpress-rest-api/)
         [Preview](https://learn.wordpress.org/lesson/interacting-with-the-wordpress-rest-api/)
      d.  [   Extending the WordPress REST API  ](https://learn.wordpress.org/lesson/extending-the-wordpress-rest-api/)
         [Preview](https://learn.wordpress.org/lesson/extending-the-wordpress-rest-api/)
 16.  4 lessons
 17.  a.  [   Securely developing plugins and themes  ](https://learn.wordpress.org/lesson/securely-developing-plugins-and-themes/)
         [Preview](https://learn.wordpress.org/lesson/securely-developing-plugins-and-themes/)
      b.  [   Fixing common security vulnerabilities  ](https://learn.wordpress.org/lesson/fixing-common-security-vulnerabilities/)
         [Preview](https://learn.wordpress.org/lesson/fixing-common-security-vulnerabilities/)
      c.  [   Tools to detect security vulnerabilities  ](https://learn.wordpress.org/lesson/tools-to-detect-security-vulnerabilities/)
         [Preview](https://learn.wordpress.org/lesson/tools-to-detect-security-vulnerabilities/)
 18.  3 lessons
 19.  a.  [   What is Internationalization?  ](https://learn.wordpress.org/lesson/what-is-internationalization/)
         [Preview](https://learn.wordpress.org/lesson/what-is-internationalization/)
      b.  [   The commonly used Internationalization functions  ](https://learn.wordpress.org/lesson/the-commonly-used-internationalization-functions/)
         [Preview](https://learn.wordpress.org/lesson/the-commonly-used-internationalization-functions/)
 20.  2 lessons
 21.  a.  [   Setting up a WordPress multisite network  ](https://learn.wordpress.org/lesson/setting-up-a-wordpress-multisite-network/)
         [Preview](https://learn.wordpress.org/lesson/setting-up-a-wordpress-multisite-network/)
      b.  [   Managing a WordPress multisite network  ](https://learn.wordpress.org/lesson/managing-a-wordpress-multisite-network/)
         [Preview](https://learn.wordpress.org/lesson/managing-a-wordpress-multisite-network/)
      c.  [   Advanced multisite management  ](https://learn.wordpress.org/lesson/advanced-multisite-management/)
         [Preview](https://learn.wordpress.org/lesson/advanced-multisite-management/)
      d.  [   Developing for a multisite network  ](https://learn.wordpress.org/lesson/developing-for-a-multisite-network/)
         [Preview](https://learn.wordpress.org/lesson/developing-for-a-multisite-network/)
      e.  [   Building plugins and themes that support multisite  ](https://learn.wordpress.org/lesson/building-plugins-and-themes-that-support-multisite/)
         [Preview](https://learn.wordpress.org/lesson/building-plugins-and-themes-that-support-multisite/)
 22.  5 lessons
 23.  a.  [   The built-in WordPress debugging options  ](https://learn.wordpress.org/lesson/the-built-in-wordpress-debugging-options/)
         [Preview](https://learn.wordpress.org/lesson/the-built-in-wordpress-debugging-options/)
      b.  [   Examining the state of your PHP code  ](https://learn.wordpress.org/lesson/examining-the-state-of-your-php-code/)
         [Preview](https://learn.wordpress.org/lesson/examining-the-state-of-your-php-code/)
      c.  [   Examining the state of your JavaScript code  ](https://learn.wordpress.org/lesson/examining-the-state-of-your-javascript-code/)
         [Preview](https://learn.wordpress.org/lesson/examining-the-state-of-your-javascript-code/)
      d.  [   Useful debugging plugins  ](https://learn.wordpress.org/lesson/useful-debugging-plugins/)
         [Preview](https://learn.wordpress.org/lesson/useful-debugging-plugins/)
 24.  4 lessons
 25.  a.  [   Quiz time  ](https://learn.wordpress.org/lesson/quiz-time/)
 26.  1 lesson, 1 quiz
 27.  a.  [   Time to test your skills  ](https://learn.wordpress.org/lesson/time-to-test-your-skills/)
 28.  1 lesson, 1 quiz
 29.  a.  [   Test your knowledge  ](https://learn.wordpress.org/lesson/test-your-knowledge/)
 30.  1 lesson, 1 quiz

### The programming languages of WordPress

# HTML

One of the first programming languages that you’ll learn as a WordPress developer
is HTML.

In this lesson, you’ll learn what HTML is, how it is used in WordPress, and where
to find more information on writing HTML.

## What is HTML?

HTML is synonymous with the web. The originator of the internet designed HTML to
be used to create web pages.

Whenever you visit a website in a browser, whether it’s one of the [biggest news portal](https://wordpress.org/showcase/time-com/)
in the world or your local [nonprofit’s home page](https://wordpress.org/showcase/helpcode/),
the document you are viewing is written in HTML.

HTML stands for HyperText Markup Language and is used to describe the structure 
of a web page.

HTML is made up of elements. Elements are the building blocks of HTML documents.

An HTML element usually has a start tag, an end tag, and content in between the 
tags.

Here’s an example of an HTML document:

    ```language-markup
    <html lang="en">
        <head>
            <title>My HTML document</title>
        </head>
        <body class="main">
            <h1>This is the heading of my HTML document</h1>
            <img src="https://picsum.photos/250" alt="A randomly selected image">
            <p>This is the content of my HTML document.</p>
        </body>
    </html>
    ```

In the above example, the `<html>` tag at the top is a start tag and the `</html
>` tag at the bottom is the end tag. Notice that the end tag starts with a forward
slash. The content in between these tags is the content of the `<html>` element.

HTML elements can be nested inside each other. In the above example, the `<head>`
element is nested inside the `<html>` element, and the `<title>` element is nested
inside the `<head>` element.

HTML elements are also semantic, which means that each tag has a specific meaning,
and should be used in a specific way. For example, the `<h1>` element is a heading
element and the `<p>` element is a paragraph element.

HTML elements can also have attributes. Attributes are used to provide additional
information about an element. In the above example, the `<body>` element has an 
attribute called `class` with a value of `main`.

Certain elements allow you to include media, such as images, audio, and video. In
the above example, the `<img>` element is used to include an image on the page. 
The `src` attribute is used to specify the location of the image, and the `alt` 
attribute is used to provide alternative text for the image.

HTML elements can also be self-closing. In the above example, the `<img>` element
is self-closing, and you will notice that it doesn’t have an end tag.

When you visit a web page in a browser, the browser reads the HTML document and 
displays the content in the browser window. The browser reads the HTML document 
from top to bottom and left to right.

By default, each of the elements is displayed in a different way. For example, the`
<h1>` element is displayed as a heading, and the `<p>` element is displayed as a
paragraph.

HTML is used everywhere across a WordPress site, from the dashboard to the theme
that powers the front end. Even plugins make use of HTML to display content.

## Accessible HTML

When writing HTML, it’s important to write accessible HTML. Accessible HTML is HTML
that is written in a way that makes it easy for people with disabilities to use.

For example, if you are using an image to display a logo, you should include alternative
text for the image. This allows people who are using a screen reader to understand
what the image is.

Additionally, you should always use semantic HTML elements, and use them in the 
correct way. For example, if you are creating a heading, you should use a heading
element, not a paragraph element.

## Additional Resources

For more information about HTML, you can visit the following online resources:

 * [HTML on MDN](https://developer.mozilla.org/en-US/docs/Web/HTML)
    - [Accessible HTML on MDN](https://developer.mozilla.org/en-US/docs/Learn/Accessibility/HTML)
 * [HTML on Web.dev](https://web.dev/learn/html)
    - [Accessible HTML on Web.dev](https://web.dev/learn/accessibility)
 * [freeCodeCamp Responsive Web Design Course](https://www.freecodecamp.org/learn/2022/responsive-web-design/)

 This is a preview lesson

Register or sign in to take this lesson.

 [ Take course ](https://learn.wordpress.org/course/beginner-wordpress-developer/)

 [ Sign in ](https://login.wordpress.org/?redirect_to=https%3A%2F%2Flearn.wordpress.org%2Flesson%2Fhtml%2F&locale=en_US)

##  Suggestions

 Found a typo, grammar error or outdated screenshot? [Contact us](https://learn.wordpress.org/report-content-feedback/).