Previous task
Structure of HTML page4/10
Back to the list of tasks
  1. 1. Where HTML begins
  2. 2. The simplest HTML page
  3. 3. HTML page title
  4. 4. HTML page encoding
  5. 5. Connecting styles
  6. 6. Connecting external styles
  7. 7. The mystery of the CSS editor
  8. 8. Connecting scripts
  9. 9. Connecting external scripts
  10. 10. Connecting external styles and scripts again
Nest task
  • Courses
  • Sign up
  • Log in

Loading...
It will be ready in a few seconds.

  • Theory
  • Theory

HTML page encoding

The HTML page encoding must be specified so that the web browser can correctly display the text on the page. If the browser guesses the encoding incorrectly, hieroglyphics will be displayed instead of text.

To tell the browser the encoding of an HTML page, you must use <meta> tag inside the <head> tag. For example:

<meta charset="encoding name">

The most common modern encoding is utf-8. Use it in all your projects.

For the example we used windows-1259 encoding. Let's replace it with a modern one.

  • index.html
  • style.css
HTML
<!DOCTYPE html> <html> <head> <meta charset="windows-1259"> <title>HTML page encoding</title> <link rel="stylesheet" href="style.css"> </head> <body> <h1>Encoding</h1> <p>When the document encoding is set incorrectly, some characters are displayed as "hieroglyphics" and some are not.</p> </body> </html>
CSS
body { margin: 20px; font-size: 18px; line-height: 24px; } h1 { font-size: 52px; line-height: 64px; font-family: "Monaco", "Courier", monospace; color: #618ad2; }

The code has changed, click "Update" or enable autorun.

You have moved to another page

Click inside the mini-browser to highlight this window.

100%
GoalsCompleted
0

    Right now the encoding is set incorrectly, so the text in the mini-browser does not display correctly.

    1. Set the correct encoding: utf-8.

    © 2023-2024, codehero.pro