1. Главная / Блог / Создание веб страницы

Создание веб страницы


Нет комментариев.


Чтобы создать веб-страницу своими руками, давайте разберёмся, как она устроена.

На любом сайте, кликните правой кнопкой мыши, выберите «посмотреть код страницы».

Сейчас там много не понятного для вас, поэтому будем практической работой разбираться.

Создадим простейшую текстовую веб-страницу страницу.

Для этого нам понадобится текстовый редактор, можно использовать стандартный блокнот Windows, я предпочитаю notepad++, он бесплатный, поддержка синтаксиста различных языков, удобное переключение между вкладками и многое другое.

Создайте папку, на компьютере, в удобном месте. Откройте текстовый редактор и создайте и сохраните файл index.html в этой папке. Все главные страницы сайтов имеют название index.

index.html


<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8"/>
<title>Моя первая страница</title>
</head>
<body>
<header>
<h1>Страница HTML</h1>
</header>
<main>
<p>Эта страница сделана на языке гипертекстовой разметки HTML5.</p>
</main>
<footer>
<p>Сайт cwmax.ru</p>
</footer>
</body>
</html>

Скопируйте этот код в свой файл, сохраните и откройте в браузере.

Должно получиться так.

Моя первая страница

Синим цветом окрашены элементы страницы стандарта HTML5, они не обязательны, но очень полезны. Их использование оставим на потом.

<!DOCTYPE html>
Сообщает браузеру, что страница стандарта html5.

<html lang="ru">
сообщает браузеру, что надо начинать чтение документа на русском языке до тех пор, пока не появится закрывающий тег </html> (он внизу разметки).

<head>
Описывает служебную информацию страницы, для браузера и поисковых роботов. Пользователь только видит название страницы, на вкладке браузера, и иконку сайта.
Теги внутри head

</head>
Этот тег обязательно должен закрываться.

<body>
Тело страницы, тут располагается информация, которую видит пользователь.

</body>
Этот тег обязательно должен закрываться.

</html>
Закрытие документа, всё что написанно после него, браузер будет игнорировать.

Создание одностраничного сайта




Нет комментариев.


Оставить комментарий

Ваше имя:

Оценка