Урок 2. Начало работы с сайтом

Для создания сайтов используем следующие инструменты:

  • Denwer — набор дистрибутивов и программная оболочка, предназначенные для создания и отладки сайтов (веб-приложений, прочего динамического содержимого интернет-страниц) на локальном ПК (без необходимости подключения к сети Интернет) под управлением ОС Windows.
  • Notepad ++ — свободный текстовый редактор для Windows с подсветкой синтаксиса большого количества языков программирования и разметки, либо другая альтернативная программа.
  • Paint.NET — растровый графический редактор для Windows NT, основанный на .NET Framework.
  • Браузеры (Interner Explorer, Opera, Google Chrome, Mozilla)

В папке home (C:\WebServers\home\) создадим папку site, в который будут размещены файлы нашего сайта. В папке site создадим папку www.

Запустим Denwer с рабочего стола или по траектории  C:\WebServers\etc\run.exe
Откроем блокнот (Notepad++), добавим новый файл и сохраним его в папке www нашего сайта под именем index.php

Определим тип нашего документа. Любая грамотно свёрстанная страница должна в самом начале содержать так называемый DOCTYPE.

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

 Тэг <html>

Тег <html> является контейнером, который заключает в себе все содержимое веб-страницы, включая теги <head> и <body>. В целом html документ имеет следующую структуру

<!DOCTYPE HTML PUBLIC «-//W3C//DTD HTML 4.01 Transitional//EN»     «http://www.w3.org/TR/html4/loose.dtd»>
<html>
<head>
<!— Этот раздел предназначен для заголовка страницы и технической информации —>
</head>
<body>

<!— Здесь размещается содержимое страницы —>

</body>
</html>
Следующий тэг после html идет тэг <head>. В нём содержится всякая служебная информация: название страницы (то, что входит в титл), кодировка, ключевые слова для поисковых роботов, описание страницы и т.п. Вся эта информация записана в служебных тэгах meta, которые также не отображаются на странице в браузере.

Мы запишем на нашей страничке следующую информацию:

<head>
<meta http-equiv= «content-type» content= «text/html; charset=windows-1251» />
<meta name= «description» content= «Сайт об электронном правительстве » />
<meta name= «keywords» content=»электронное правительство, электронная Россия » />
<link rel= «stylesheet» href= «style.css» type= «text/css» />
</head>

Первый мета-тэг показывает на кодировку сайта windows-1251.
Второй мета-тэг — это краткое описание сайта.
В третьем мета-тэге ключевые слова для поисковиков.
Последняя строка — это ссылка на наш лист стилей CSS, который мы создадим чуть позже.

Зададим после строки

<meta http-equiv= «content-type» content= «text/html; charset=windows- 1251» />
Тэг <title>

<title>Электронное правительство</title>

Сохраним файл index.php.

При заходе пользователя по адресу www.site станет сразу же искать у себя в заначке страницу с этим названием. Индексная страница всегда является главной (или стартовой).

Откроем браузер и в адресной строке наберем site. В результате в строке заголовка появится только содержимое тега <title>.

Добавить комментарий