Сейчас мы создадим свою первую веб страницу, хочется попросить Вас внимательно повторять все описанное и делать все правильно. Конечно тут все очень просто, но это очень важно! Эти знания пригодятся даже при работе с Adobe Dreamweaver.

Шаг №1:

Первым делом Вам нужно создать на жестком диске папку под свой сайт. Называйте все свои документы и папки правильными именами, к примеру папка для сайта будет называться obuchenie_html. Внутри папки создайте вторую папку и назовите ее www. Это еще не все, внутри папки «www» нужно создать папку для изображений под названием img (по ходу обучения будем помещать в нее изображения). Структура наших папок выглядит следующим образом:

Создание папок под свой первый сайт

В дальнейшем, когда Вы начнете работать с Dreamweaver, вам станет понятно зачем нужна такая структура папок для сайта.

Шаг №2:

Зайдите в папку под названием WWW и создайте текстовый документ. Для этого нужно зайти в папку, кликнуть правой кнопкой по пустому месту,  появится меню, выберите Создать – Текстовый документ. На windows XP это выглядит примерно так:

Текстовый документ

Если у вас другая операционная система, то действия будут похожими.

Шаг № 3:

Теперь в созданном блокноте нужно написать код простой страницы, желательно все переписать в ручную, чтобы лучше запоминалось.

Вставляем этот код:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>

<title> Это моя первая страничка! </title>

</head>

<body>

<!--это мой первый комментарий -->
Ура!!!! Я создал свою первую страницу на html!!!

</body>

</html>

Практически готово! Ваша первая страница написана.

Шаг № 4:

Теперь нужно сохранить документ как «index.html» (Расширение можно указывать «.htm» они указывают что тип документа html. “.html” и “.htm” похожи, пониматься браузером они будут одинаково, большого значения не имеют). Для того чтобы сохранить документ с нужным разрешением, нужно выбрать из меню пункты Файл – Сохранить как:

Сохраняем первую страницу с нужным расширением

В параметре Тип файла нужно выбрать «все файлы». После сохранения страницы можно удалить созданный ранее текстовый документ.

Шаг № 5:

Теперь после того как Вы откроете файл веб странички «index.html» браузер обработает код и вы увидите результат обработки в окне браузера:

Как браузер будет отображать нашу страницу в окне

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

Если посмотреть код страницы и вид отображения браузером, видно что заголовок страницы называется «Это моя первая страничка!» А комментарии не отображаются браузером.

В следующих уроках будем совершенствовать свои знания, научимся форматировать текст, таблицы и другие вещи…