Make it a real page · Сделайте из этого полноценную страницу
This page needs a recent browser (with SharedArrayBuffer support). Please update Chrome, Edge, Firefox or Safari to the latest version. · Эта страница требует современного браузера (с поддержкой SharedArrayBuffer). Пожалуйста, обновите Chrome, Edge, Firefox или Safari до последней версии.
English
A real web page
- So far you wrote pieces of HTML. A full page wraps them in a frame.
- That frame is almost the same on every web page in the world.
- Let's meet it once — then it becomes a habit.
Русский
Настоящая веб-страница
- До сих пор вы писали кусочки HTML. Полная страница оборачивает их в каркас.
- Этот каркас почти одинаков на каждой веб-странице в мире.
- Давайте познакомимся с ним один раз — и это станет привычкой.
English
The four parts
<!DOCTYPE html>— the first line. It says: this is modern HTML.<html>— wraps the whole page.<head>— hidden information about the page (like its<title>).<body>— everything you see on the page.
Русский
Четыре части
<!DOCTYPE html>— первая строка. Она говорит: это современный HTML.<html>— оборачивает всю страницу.<head>— скрытая информация о странице (например, её<title>).<body>— всё, что вы видите на странице.
Explore · Исследовать
The page skeleton as a tree · Каркас страницы в виде дерева
Every page is a tree: <html> holds <head> (setup) and <body> (what you see). · Каждая страница — это дерево: <html> содержит <head> (настройка) и <body> (то, что вы видите).
<!DOCTYPE html>
<html>
<head>
<title>My first page</title>
</head>
<body>
<h1>Hello!</h1>
<p>This is a real web page.</p>
</body>
</html>
English
The title shows in the tab
- The
<title>does not appear on the page itself. - It is the name shown on the browser tab and in search results.
- Every page should have one.
Русский
Заголовок отображается на вкладке
<title>не появляется непосредственно на самой странице.- Это название, которое показывается на вкладке браузера и в результатах поиска.
- На каждой странице должно быть такое название.
English
Common mistakes
- A page needs
<html>, a<head>and a<body>. - The tab title comes from
<title>inside<head>.
Русский
Распространенные ошибки
- Страница требует ⟨
<html>⟩, ⟨<head>⟩ и ⟨<body>⟩. - Заголовок вкладки берется из ⟨
<title>⟩ внутри ⟨<head>⟩.
English
Now you try
- Notice how
<head>and<body>sit inside<html>. - Add a title, then give a page its doctype line.
Русский
Теперь попробуйте сами
- Обратите внимание, как ⟨
<head>⟩ и ⟨<body>⟩ находятся внутри ⟨<html>⟩. - Добавьте заголовок, а затем задайте странице строку doctype.
Give the page a title. Add <title>My Page</title> inside the <head>. · Задайте странице заголовок. Добавьте <title>My Page</title> внутри <head>.
Start this page properly. Add <!DOCTYPE html> as the very first line. · Начните эту страницу правильно. Добавьте <!DOCTYPE html> как самую первую строку.