«Единственный способ творить великие дела – это любить то, что ты делаешь»
HTML
site.komp36.ru Создание сайтов. Твой сайт фотографа Что есть на сайте? Несколько фото галерей: свадебная, постановочная съемка, love story, детские фото. Договор на фотосъемку, прайс-лист.
site.komp36.ru Продающий лендинг. Создание сайтов Установка и продажа окон, установка дверей, перегородок. Одностраничный продающий сайт. Заявки прямо с сайта
site.komp36.ru Универсальный лендинг. Выбрать тему для сайта! Лендинг адаптируется под любую тему: ремонт, отделка, продажа окон, дверей, лестниц, мебели и многое другое
site.komp36.ru Создание сайтов. Сайт сервисного центра. Сайт компании. Новости и отзывы. Несколько прайс-листов – под каждый отдельная страница. Возможность размещения статей


Определение в Википедии: HTML (от англ. HyperText Markup Language - язык разметки гипертекста) – стандартный язык разметки документов во Всемирной паутине. Большинство веб-страниц создаются при помощи языка HTML (или XHTML). Язык HTML интерпретируется браузером и отображается в виде документа, в удобной для человека форме. 

Все что Вы видите в окне браузера, каждый элемент веб страницы: текстовые блоки, абзацы и заголовки, фотографии, реклама, различные меню, формы для заполнения и т.д., - все это создано и размещено на странице веб разработчиком при помощи HTML.

Язык HTML отвечает за разметку страницы, за порядок и последовательность расположения ее элементов. При помощи HTML элементам страницы задают определенные свойства и характеристики. Редактирование текста - это тоже HTML.

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



Теги парные и одиночные

Основой языка HTML являются теги. Каждый элемент страницы обозначен тем или иным тегом.

Тег - это «метка», состоящая из буквы или нескольких букв, заключенных между символами «меньше чем» - "<" и «больше чем» - ">". Теги бывают парные и непарные (одиночные).

- парные теги. У таких тегов сначала идет открывающий тег - между символами "<" и ">", сообщающий браузеру о начале своего действия в данном месте; затем закрывающий тег – между символами "</" и ">" (то есть у закрывающего тега к символу «меньше чем» - "<" добавляется слэш /), сообщающий браузеру о завершении своего действия .

Закрывающий тег не всегда является обязательным.

- одиночные теги не имеют закрывающего элемента.

Парный тег <q> - открывает кавычки. Он имеет обязательный, закрывающий кавычки, тег </q>.

Фрагмент кода
<q> Кавычки </q>
Результат

Кавычки

Парный тег

Парный тег <p> - создает новый параграф. Он имеет закрывающий тег </p>, который не является обязательным!

Каждый следующий тег <p> не только создает новый абзац, но и завершает предыдущий. Новый абзац будет отделен от предыдущего пустой строкой.

Здесь же введем еще одно из ключевых понятий языка HTML - Атрибут тега.

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

Например, атрибут align тега <p> определяет выравнивание содержимого тега (текста) по горизонтали.

Многие теги имеют несколько атрибутов, среди которых есть обязательные. Есть теги не имеющие атрибутов!

Фрагмент кода
<p> Первый абзац - его завершение не обозначено закрывающим тегом.
<p align="center"> Второй абзац имеет закрывающий тег. Атрибут align задает выравнивание текста по центру в горизонтальной плоскости!</p>
Результат

Первый абзац - его завершение не обозначено закрывающим тегом.

Второй абзац имеет закрывающий тег. Атрибут align задает выравнивание текста по центру в горизонтальной плоскости!

Одиночный тег

Одиночный тег <br>, использующийся для переноса строки, не имеет закрывающего тега и не имеет атрибутов.

Фрагмент кода
<p> С помощью тега <br> установим перенос строки внутри текущего абзаца. </p>
Результат

С помощью тега
установим перенос строки внутри текущего абзаца.

Редактор HTML

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

Естественно, существует несколько визуальных редакторов для работы с HTML, лидером среди которых является Dreamweaver - HTML-редактор от компании Adobe.

Но Dreamweaver и другие специализированные HTML-редакторы - это помощники, которые автоматизируют работу с кодом. И перед тем, как приступать к их помощи и начинать с ними работать, необходимо этот код знать. Поэтому первые шаги в изучении HTML и CSS (Cascading Style Sheets - каскадные таблицы стилей) следует делать, используя Блокнот. При этом набирать код Вы будете вручную - с клавиатуры. А это как раз то что нужно для начинающих изучение языка HTML и технологии CSS.

В дальнейшем, естественно, необходимо переходить к специализированным HTML-редакторам.

site.komp36.ruТвой сайт фотографа. Создание сайтов Что есть на сайте? Несколько фото галерей: свадебная, постановочная съемка, love story, детские фото. Договор на фотосъемку, прайс-лист.
site.komp36.ru Акция Как начать свое дело? Свой сайт «Укладка плитки» 9 000 руб. Лендинг адаптируется под любой вид отделочных работ, продажу товаров или услуг. Сайт поможет найти новых клиентов
site.komp36.ru Акция Продающий лендинг «Установка и продажа окон» 9 000 руб. Одностраничный продающий сайт. Установка и продажа окон, установка дверей, перегородок. Заявки прямо с сайта

HTML по шагам

Все теги HTML
Тематические публикации
site.komp36.ru Как начать свое дело? Свой сайт «Укладка плитки» 9 000 руб. Лендинг адаптируется под любой вид отделочных работ, продажу товаров или услуг. Сайт поможет найти новых клиентов
site.komp36.ru Продающий лендинг «Установка и продажа окон» 9 000 руб. Одностраничный продающий сайт. Установка и продажа окон, установка дверей, перегородок. Заявки прямо с сайта