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; }

GoalsCompleted

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

Set the correct encoding: utf-8.