Основы HTML и CSS
HTML (Hypertext Markup Language) – язык разметки гипертекста, который используется для размещения текста, графических изображений, аудио- и видеоклипов на web-страницах из которых состоит сайт. В состав гипертекста могут входить гиперссылки - и интерактивные кнопки, которые соединяют web-страницы одного сайта между собой и с другими сайтами.
Для просмотра страниц и сайтов, созданных при помощи языка HTML используется специальные программы- браузеры, которые расшифровывают код и воспроизводят его на экране в виде, который придает документу автор. При помощи web-браузера посетитель страницы может в определенной степени изменять внешний вид документа. HTML-документы создаются при помощи текстовых редакторов, HTML-генераторов и программ конвертеров. Редакторы используются для создания web-сайтов и дальнейшего редактирования контента. Генераторы позволяют создавать шаблон сайта. Перечислим несколько программ, подходящих под эти цели:
HTML-редакторы:
• Macromedia HomeSite – платный редактор с множеством встроенных инструментов, которые могут пригодиться как новичку, так и профессионалу. Поддержка XHTML HTML, VTML, ColdFusion, Java, а диалоговое окно позволяет одновременно просматривать локальные и удаленные файлы. Имеет внутренний анализатор, который проверяет корректность документа.
• Adobe Dreamweaver – платная программа. Позволяет проектировать и создавать web-сайты и web-приложения. Благодаря встроенным функциям генератора и конвертера давно заслужил популярность у разработчиков и web-дизайнеров. Поддержка формата CSS, XML, JavaScript, PHP, Adobe ColdFusion, ASP,
• KompoZer – бесплатная программа, которая позволяет без глубоких знаний сетевых технологий создавать простые сайты. Осуществлена поддержка таблиц и шаблонов.
• Incomedia Website – редактор отлично подходящийдля изучающих HTML с нуля. Позволяет последовательно создавать сайт благодаря предлагаемым программой действиям. Имеется большое количество шаблонов, визуальный редактор.
• HTML-Kit – бесплатный редактор с поддержкой HTML, XHTML, XML, CSS, JavaScript, ASP, PHP, Perl, Python, Java, C/C++, Delphi / Pascal, SQL. Создано более 400 плагинов, делающих эту программу достаточно удобной для создания web-сайтов.
HTML-генераторы:
• CSS3 Maker
• CSS3-Tricks Button Maker
• CSS3 Button Generator
• Color Zilla Gradient Editor
• Border-Radius
Основой HTML являются теги, при помощи тегов web-браузер определяет как интерпретируется документ. Например, самым первым тегом страницы является . Он сообщает браузеру, что документ создан с использованием языка HTML. Каждый тег должен использоваться дважды – в начале текста и в конце. Документ HTML состоит из двух частей – голова (HEAD) и тело (BODY).Начальный тэг головы используется сразу после тега, а конечный тэг - сразу после окончания документа. Тело документа находится между тегами и - это основная часть документа, которая отображается как текстовая информация документа.
Таким образом, минимальная структура HTML-документа выглядит так:
<HTML>
<HEAD>
Голова гипертекста
</HEAD>
<BODY>
Тело гипертекста
</BODY>
</HTML>
<HEAD>
Голова гипертекста
</HEAD>
<BODY>
Тело гипертекста
</BODY>
</HTML>
В документе автор должен использовать и другие теги, которые регулируют параметры текста, ссылки, заголовки. Чаще всего разработчики создают дизайн сайта при помощи CSS (Cascading Style Sheets), что переводится как «каскадные страницы стилей», предназначены для отделения дизайна страницы от ее содержимого. Иначе говоря, при помощи HTML создается структура страницы, размещается текст, а шрифт и оформление определяется посредством CSS. CSS, в сравнении с HTML, обладает большими возможностями. С его помощью можно менять стили, размер и цвет текста, устанавливать свой фон или создать выпадающее меню , применять сложные техники дизайна, при этом, не перегружая страницу и при этом существенно облегчая работу разработчику.