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

Изменять шрифт можно с помощью тэгов <BIG> и <SMALL>. <BIG> укрупняет шрифт указанного фрагмента по отношению к предыдущему тексту, а <SMALL>, соответственно, уменьшает.

Меняя размер отдельных букв, можно добиться интересных эффектов. Например, таким образом можно получить буквицу - укрупненную прописную букву начала абзаца, например:

Поля страницы документа html

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

В IE 5.0 используются следующие атрибуты для задания полей страницы:

LEFTMARGIN - левой поле

RIGHTMARGIN - правое поле

TOPMARGIN - верхнее поле

BOTTOMMARGIN - нижнее поле

По умолчанию размер полей равен, примерно, 10 пикселям. [2]

7. Создание таблиц

Для создания таблицы служит тэг <TABLE>. Как известно таблица состоит из строк, а строки, в свою очередь состоят из ячеек. Для определения строк служит тэг <TR>, для создания ячеек - <TH>, <TD>.

Тэг <TH> используется для создания ячеек с заголовками.

Тэг <TD> - для обыкновенных ячеек с данными.

Для того, чтобы сделать видимой границы таблицы, служит атрибут BORDER тэга <TABLE>.

Определяя рамку таблицы, надо указать толщину ее внешних линий в пикселях. Чтобы задать толщину разграничивающих линий внутри таблицы, необходимо воспользоваться атрибутом CELLSPACING.

По умолчанию браузер отображает рамку таблицы темно-серым цветом. Чтобы изменить цвет рамки надо применить атрибут BORDERCOLOR.

Для создания заголовка таблицы служит тэг <CAPTION>.

По умолчанию браузер располагает заголовок таблицы по центру над ней. При помощи атрибута ALIGN со значением bottom можно разместить заголовок под таблицей.

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

Для группирования столбцов таблицы служат тэги <COLGROUP> и <COL>.

Дескриптор <COLGROUP> создает структурную группу столбцов, которая выделяет множество логически однородных ячеек. Так одна структурная группа может охватывать ячейки заголовков столбцов, а другая - ячейки, содержащие данные.

Дескриптор <COL> предназначен для формирования неструктурных групп столбцов, которые делят таблицу на разделы, не имеющих отношения к структуре. Это удобно в том случае, когда не все столбцы содержат информацию одного типа.

Для группирования строк таблицы служат тэги <THEAD>, <TBODY>, <TFOOT>.

<THEAD> - нужен для создания группы заголовков для столбцов таблицы. Этот дескриптор допускается использовать в пределах таблицы только одни раз.

<TBODY> - применяется для создания одной или нескольких групп строк таблицы, содержащих основные данные.

<TFOOT> - позволяет создать группу строк для представления информации о суммах или итогах, располагаемую в нижней части таблицы. Этот дескриптор допускается использовать в пределах таблицы только одни раз. Вовсе не обязательно создавать группы строк таблицы всех трех типов.

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

Для выравнивания данных в таблице предназначены атрибуты ALIGN, VALIGN.

Атрибут ALIGN предназначен для выравнивания по горизонтали. По умолчанию содержимое заголовков выравнивается по центру, а ячеек - влево.

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

Ширина таблицы задается атрибутом WIDTH. Значение можно задавать как в абсолютных единицах (WIDTH=250), так и в относительных (WIDTH="80%"). Например, задав значение ширины в 600 пикселей, можно быть уверенным, что таблица поместится в окне браузера при любом разрешении монитора.

То же самой можно делать и с высотой таблицы при помощи атрибута HEIGHT.

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

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

8. Свойство фона страницы

Свойство background позволяет снабдить графическим фоном любой элемент html-страницы.

Для использования графического фона надо указать имя и местоположение файла, содержащего соответствующее изображение. Для этого служит атрибут URL.

Атрибут repeat определяет степень повторяемости фоновой картинки и может иметь следующие значения:

repeat - картинка бесконечно повторяется по горизонтали и вертикали, заполняя собой все фоновое пространство браузера;

repeat-x - картинка повторяется по горизонтали;

repeat-y - картинка повторяется по вертикали;

no-repeat - картинка не повторяется.

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

Атрибут scroll - определяет подвижность/статичность фона:

scroll - фон перемещается вместе с содержимым страницы;

fixed - фоновая графика статична.

Свойство background-position определяет положение картинки в окне браузера (top, middle, bottom, left, center, right). При копировании изображения с целью заполнения площади элемента браузер воспринимает значение этого свойства в качестве отправной точки. Координаты начального положения изображения можно задавать в виде процентных отношений (20%), либо абсолютных значений в пикселях (15px), либо констант (top left).

Для изменения цвета фона служит свойство background-color.

Цвет фона может задаваться посредством наименования (red, yellow), шестнадцатеричным значением (#FF00AA), функцией RGB (25%,50%,0%), выражающей абсолютное или процентное содержание красной, зеленой и синей составляющих цвета. [2]

9. Вставка видеозаписи в Web-страницу

На Web-странице можно разместить встроенную видеозапись. Это значит, что видеозапись загружается, когда пользователь открывает страницу. Для видеозаписи можно задать два варианта воспроизведения: сразу после открытия страницы или после щелчка страницы мышью. Так как не все средства просмотра Web предусматривают возможность просмотра встроенной видеозаписи, возможно, будет полезным снабдить ее дублирующим текстом и изображениями или вообще не помещать важные сведения в форме видеозаписи.

10. Гиперссылка на другую страницу

Гиперссылка может связывать страницы как в пределах одного сайта, так и указывать на любую страницу в Интернете. При построении ссылки на чужие страницы всегда надо пользоваться абсолютным адресом страницы (http://www.site.com/page.html). Если создается ссылка на страницу в пределах сайта, то предпочтительнее использовать относительный URL (page.html, catalog/page.html). Делая графическую гиперссылку, необходимо помнить, что некоторым пользователям графика недоступна, поэтому обязательно включать соответствующие текстовые элементы.

Для создания гиперссылки служит дескриптор <A>, например: [2]

<a href="http://on-line-teaching.com/index.html">Ссылка на главную страницу сайта</a>

ЗАКЛЮЧЕНИЕ

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

Итак, поняв принцип построения Web-страницы, изучив возможности соединения в ней различных видов информации, можно смело сказать, что Web-страницы, с их огутіалом огут применятся   для различных целей.

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

СПИСОК ИСПОЛЬЗОВАННЫХ ИСТОЧНИКОВ

1.      Бородаев Д.В. Web-сайт как объект графического дизайна. Монография. — Х.: "Септима ЛТД", 2006. — С. 288.

2.      [электронный ресурс]. Режим доступа: http://on-line-teaching.com/html/lsn001.html. - Загл. с экрана.

3.      [электронный ресурс]. Режим доступа: http://htmlbook.ru/. - Загл. с экрана.

4.      [электронный ресурс]. Портал знаний.  Режим доступа: http://www.znannya.org/. - Загл. с экрана.

5.      [электронный ресурс]. Создание сайта. Все о Web дизайне. Режим доступа: http://webdesign.net-soft.ru/. - Загл. с экрана.

6.      [электронный ресурс]. Режим доступа: http://www.highstar.ru/. - Загл. с экрана.

30