Главная :: Архив рассылки :: Первая страничка

Первая страничка

Доброго Вам времени суток, уважаемые подписчики!

Представляю Вашему вниманию первый выпуск рассылки "Уроки веб-дизайна в примерах".

Содержание выпуска:

Цель и структура рассылки.
Термины.
Что нужно для написания сайта?
Первая страничка (шаблон). Описание кода.
Анонс следующего выпуска.

Цель и структура рассылки.

Основная цель данной рассылки просто и понятно объяснить все тонкости веб-строительства (написания сайтов) и веб-дизайна (их оформление). Уже после прочтения этого выпуска Вы сможете сделать простую страничку. Выпуски будут идти от простого к сложному. Вначале будут изложены основы веб-строительства, основные теги HTML, подкрепленные примерами и их подробным описанием. Все примеры будут сопровождаться кодом (шаблоном) так, что Вы сможете их просто копировать на свою страничку и изменять по своему усмотрению. В более поздних выпусках будут представлены уроки по веб-дизайну и таблицам стилей (CSS). Каждый выпуск будет состоять из базовой теории, примеров (шаблонов) и их описаний.

Термины.

Вначале введем термины, которые мы будем в дальнейшем активно использовать:

Браузер - программа для просмотра сайтов.
HTML (Hyper Text Markup Language) - язык гипертекстовой разметки документа. С его помощью Вы можете писать тексты с ссылками на другие страницы, создавать таблицы, списки, включать изображения и многое другое. Этот язык используется для написания сайтов.
Тег - структурный элемент HTML, определяющий свойства отображения информации на странице или несущий служебные (информационные) функции (например, информацию для поисковых систем). Тег - служебное слово, заключенное в треугольные скобки (например, открывающийся тег <BODY>). Большинство тегов требую закрывающийся тег, который начинается с дробной четры (например, </BODY>). Действие тега распространяется на код, заключенный между открывающимся и закрывающимся тегом.
Свойство тега, описывает характер действия тега и располагается внутри скобок тега. Например, свойство цвета символов COLOR для тега <BODY>: <BODY COLOR="blue">. Свойству присваивается значение (в нашем примере blue - синий цвет).
Элемент - более общее понятие, чем тег. Если что-то находится внутри элемента (например, <BODY>), значит оно находится между открывающимся и закрывающимся тегом (в нашем примере, между <BODY> и </BODY>).

Что нужно для написания сайта?

Для начала Вам нужно выбрать текстовый редактор. Это может быть любой редактор, сохраняющий документ как текстовый файл. Можно воспользоваться обычным Блокнотом (Notepad) или редактором Bred3. Преимущество последнего в возможности цветового выделения тегов, что значительно облегчает редактирование и чтение HTML документов. И, конечно же, желание и хорошее настроение!

Первая страничка (шаблон). Описание кода.

Набираем (или копируем) пример простой HTML страницы, представленный ниже. Все комментарии, выделенные черным, можете удалять, текст, выделенный красным, заменяете по своему усмотрению.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 FINAL//EN">
<HTML>
<HEAD>

<META http-equiv="Content-Type" content="text/html; charset=windows-1251">
<TITLE>
Здесь заголовок Вашей страницы
</TITLE>
</HEAD>
<BODY>
Здесь содержание Вашей страницы (текст, картинки, таблицы и т.д.)
</BODY>
</HTML>

Записываем в файл с расширением *.htm или *.html (название нужно давать латинскими буквами, можно использовать цифры, знак "тире" и "подчеркивание") и открываем в браузере. Поздравляю! Вы сделали свою первую страничку!

Теперь рассмотрим более подробно приведенный выше пример.

В первой строке примера тэг <!DOCTYPE> определяет используемую версию HTML документа. Этот тэг необходим для правильной интерпретации HTML документа браузером.

HTML документ располагается между тэгами <HTML> и </HTML>. Внутри содержатся два раздела: заголовок HTML документа (<HEAD></HEAD>, содержит служебную информацию для поисковых систем и для браузера, например, кодировка страницы, название документа, ключевые слова и т.д.) и тело HTML документа (<BODY></BODY>, содержит видимую часть документа, т.е. то, что отображается в окне браузера).

Анонс следующего выпуска.

После того как создана первая страничка, ее нужно наполнить. Чем? Конечно же текстом и несколькими ссылками. Как? Об этом будет рассказано в следующем выпуске рассылки. Оставайтесь с нами.

Благодарю за внимание! сайт: http://design.wmplace.net

P.S. Если Вы используете почтовую программу The Bat!, то письмо может отображатся некорректно. Для того, чтобы просмотреть правильный вариант, щелкните два раза на аттачменте Part.html и откройте письмо (кнопка "No/Нет").