» » » Основы HTML (часть первая)

Основы HTML (часть первая)

Категория: Разработка сайтов / HTML

 


Если вы решили создать сайт самостоятельно, то вам необходимо владеть хотя бы минимум информации о языке гипертекстовой разметки — HTML HyperText Markup Language. Даже если вы решили создать свой сайт на базе определенного шаблона, то для редактирования шаблона вам не обойтись без основных понятий языка HTML.

HTML страница состоит из элементов. Текст, изображение, реклама и т.д.– это все элементы, входящие в состав страницы.

Элементы


Элементы состоят из тегов, атрибутов и содержимого.
Теги указывают браузеру на расположение элементов. Тег бывает открывающий (начало элемента) и закрывающий (конец элемента). Пример открывающего и закрывающего тега абзаца : <p>Основы HTML </p>. Обозначение открывающего тега указывается в угловых скобках, закрывающий тег обозначается так же, но с обратной косой чертой.


Атрибут


Атрибут определяет параметры элемента. Добавляя атрибуты к тегу, можно задать определенные параметры элемента. Пример атрибута задающего высоту 100 пикселей и ширину 200 пикселей изображения: <img width=”100” height=”200”>.

Содержимое элемента


Содержимое элемента — располагается внутри тега, между открывающим и закрывающим тегом:
<p>Основы HTML </p>

Практически любая веб-страница содержит элемент HTML, в состав которого входят элементы НЕAD и BODY.
<HTML>
<НЕAD>
</HEAD>
<BODY>
</BODY>
</НТМL>

Видимый контент страницы располагается внутри тега BODY.
Элемент HEAD содержит информацию описания страницы: заголовок, описание, ключевые слова и т.д.
В элементе HEAD расположен элемент TITLE — заголовок страницы, название которого будет отображаться в заголовке окна браузера.
<HEAD>
<ТIТLЕ> Основные понятия языка HTML </ТIТLЕ>
</HEAD>

Работа с текстом


Практически не один сайт не обходится без текстового наполнения. Текст — основное содержимое веб-сайтов.
Далее вкратце об основных элементах работы с текстом.

Абзацы:


Для обозначения абзаца используют теги <p> </p>
<p> Здесь располагается текст абзаца </p>
<br> — тег для перевода строки

Заголовки:


Шрифт текста заголовка отличается от основного используемого шрифта. Начиная от самого большого
<h1>Здесь располагается заголовок вашего сайта</h1>
до самого маленького заголовка
<h6> Здесь располагается заголовок вашего сайта </h6>
По мере возрастания номера заголовка уменьшается его шрифт и важность для поисковых систем. Заголовки очень важны в контенте сайта, они улучшают индексацию вашего сайта, поисковые системы придают им большое внимание.

Шрифты:


По умолчанию используется стандартный шрифт, для выделения текста используют следующие теги:
<b>Жирный шрифт</b>
<i>Курсив</i>

Атрибуты тега FONT:


Если вы хотите изменить гарнитуру шрифта, цвет или размер используйте тег <p><font…

Атрибут face

С помощью атрибута face можно изменить гарнитуру шрифта:
<p><font face="Times New Roman, Times, serif">Основы HTML</font></p>
Или
<p><font face="Arial, Helvetica, sans-serif">Основы HTML</font></p>
В кавычках выбираем гарнитуру шрифта.

Атрибут size

Используется для изменения размера шрифта
<p><font size="+2">Основы HTML</font></p>
или
<p><font size="-2">Основы HTML</font></p>
В кавычках выбираем размер шрифта.

Атрибут color

Меняет цвет текста
<p><font color="#66FF00">Основы HTML</font></p>
или
<p><font color="#FF3366">Основы HTML</font></p>
В кавычках выбираем цвет шрифта.

Атрибуты face + size + color

<p><font face="Courier New, Courier, monospace" size="+3" color="#330099">Основы HTML</font></p>
или
<p><font face="Palatino Linotype, Book Antiqua, Palatino, serif" size="-2" color="#00CC00">Основы HTML</font></p>

Таким образом можно добиться нужного оформления внешнего вида шрифта.


Автор: команда http://the-network.ru — Создание сайта самостоятельно. Поисковое продвижение сайта.