СОЗДАНИЕ HTML СТРАНИЦ
a) Базы языка HTML
b) Форматирование
c) Таблицы
d) Графика
e)Гиперссылки
f) -последовательности
g) Режимы браузеров
h)Логическая и физическая структура сайта
a) Базы языка HTML
Понятия языка разметки
HTML-документ представляет собой простой текстовый файл в формате ANSI ASCII, содержащий фактически специальные теги и текст для его разметки, и ссылки на другие документы, графические изображения и каждые иные файлы. Теги задаются в файле и обрабатываются браузером в соответствии с правилами особого языка HTML (Hyper Text Markup Language – Язык Разметки Гипертекста).
HTML не есть языком программирования.
HTML – это обычный язык разметки, т. е. с его помощью возможно оформлять документы, создавать ссылки, но никак не писать программы.
Гипертекст это текст, в котором имеются ссылки для автоматического перехода на другие тексты – гиперссылки.
Тег (от англ., tag – ярлык, метка) – элемент языка HTML, применяемый для разметки Web-страниц.
Элементы разметки складываются из заключённых в угловые скобки ( и ) дескрипторов – тэгов (tags) и их атрибутов. Совокупность открывающего () и закрывающего () дескрипторов — имеется контейнер. Элементы HTML подразделяются на структурные — каковые организуют текст и на форматирующие — каковые задают его стиль. Для документа HTML нужно создать текстовый файл с содержимым, засунуть необходимые тэги и по окончании внесения трансформаций текстовый файл сохраняется с расширением .htm либо .html.
Язык HTML был создан Тимом Бернерс-Ли. В 1990-х годах HTML взял широкое признание благодаря стремительному росту Web.
История развития HTML
HTML 1.0 – был направлен на представление языка как такового, где описание его возможностей носило скорее рекомендательный темперамент.
HTML 2.0 (ноябрь 1995) – был создан под руководством Internet для упорядочения общепринятых положений.
HTML+ (1993) и HTML 3.0 (1995) – это более широкие предположения языка HTML. Не обращая внимания на то, что в простых дискуссиях по стандарту согласие между разработчиками браузеров не было достигнуто, эти предположения содержат последовательность новых неспециализированных особенностей.
HTML 3.2 (январь 1997) создан упрочнениями Коммисии World Wide Web Consortium по HTML для упорядочения последовательности общепринятых изменений и положений прошлых предположений.
4.0 (с 1999 г.) – вводятся механизмы таблиц стилей, скриптов, кадров, внедрения объектов, улучшенная помощь различных направления и направлений письма справа налево, таблицы с громадным числом возможностей и новые свойства форм.
Типы HTML-редакторов
Для любого файла нужна какая-нибудь программа.
HTML-редакторы подразделяются на два типа:
§ редакторы тегов (HTMLPad, LightPad, HomeSite, Visual HTML Workshop) – предполагают, что пользователь знаком с языком HTML
§ WYSIWYG-редакторы (Netscape Composer, Front Page Express, Front Page 2000, Микрософт Word) – довольно часто именуют редакторами типа «что видишь, то и возьмёшь» (what you see is what you get).
Не все WYSIWYG-редакторы смогут генерировать код HTML, абсолютно тождественный форматируемой странице. К примеру, MS Word теряет при преобразовании в HTML данные о стиле линий.
Редакторы тегов
Подготовка сайта посредством редакторов тегов включает в себя этапы:
Создание HTML-документа;
Оформление (изменение цвета и формата шрифта; форматирование структуры таблиц; изменение фона страниц; внедрение графических элементов; использование эффектов; связывание страниц сайта);
Сохранение;
Просмотр взятой Web-страницы в браузере;
Размещение сайта в Интернете.
Остановимся на том, из каких главных этапов состоит процесс создания документа HTMLвручную, не прибегая к специальным приложениям:
- Комплект содержимого в любом из текстовых процессоров (к примеру, Блокнот) и сохранение простого текстового файла.
- Логическое и физическое форматирование текста (разбивка на абзацы, блоки, заголовки и пр., внешнее их оформление) при помощи тэгов и сохранение текстового файла с расширением .htm либо .html (делается в Блокноте в кодировке Unicode).
- Организация переходов по гиперссылкам документа при помощи элемента — главного связующего элемента языка HTML.
- Внедрение в документ нужных объектов: картинок, таблиц, видео видеоклипов, аудио файлов, Java, скриптов и т.д. и т.п. снова же при помощи тэгов языка HTML.
Чтобы в последствии поменять любой из созданных файлов, достаточно открыть его при помощи того же приложения Блокнот, откорректировать и сохранить трансформации. Браузер Internet Explorerпозволяет сделать трансформации прямо в нем самом, для этого нужно в меню Вид выбрать просмотр В виде HTML, либо кликнуть правой кнопкой мыши и выбрать тот же пункт меню. Чтобы заметить трансформации в документе достаточно в меню Вид выбрать Обновить, или кликнуть в панели управления браузера на значке
5. Структура -документа
Любой -документ складывается из следующих главных частей:
§ Строки с информацией о версии HTML, применяемой в данном документе
§ Блока заголовка документа
§ Тела документа.
Любой тег HTML принадлежит к определенной группе тегов, к примеру, табличные теги направлены на формирование таблиц и не смогут использоваться для других целей.
Условно теги делятся на следующие типы:
- теги верхнего уровня;
- теги заголовка документа;
- блочные элементы;
- строчные элементы;
- универсальные элементы;
- перечни;
- таблицы;
- фреймы.
Отличие между блочными и строчными элементами следующая:
Строчные элементы смогут содержать лишь эти либо другие строчные элементы, а в блочные возможно вкладывать другие блочные элементы, строчные элементы, и эти. Иными словами, строчные элементы никак не смогут хранить блочные элементы.
Блочные элементы постоянно начинаются с новой строчка, а строчные таким методом не акцентируются.
Блочные элементы занимают всю дешёвую ширину, к примеру, окна браузера, а ширина строчных элементов равна их содержимому плюс значения отступов, границ и полей.
Перечни новостей либо статей — те же перечни. Но с одной маленькой изюминкой: у элементов для того чтобы перечня имеется что-то общее, то есть дата. Исходя из этого предлагается следующая HTML-конструкция:
| 02.10.05 новость 3 новость 2 01.10.05 новость 1 |
Таблица 1. Главные тэги по типам
| Тип | Тэг | Назначение |
| теги верхнего уровня | конец и Начало страницы Содержимое веб-страницы Описание страницы | |
| теги заголовка документа | Имя страницы Для хранения информации для поисковых систем и браузеров | |
| блочные элементы | ,…, | Для выделения долгих цитат универсальный блочный контейнер Заголовок (уровни от 1 до 6) Горизонтальный разделитель Абзац Блок предварительно форматированного текста |
| строчные элементы |
|
Ссылка на другую страницу Жирный Увеличивает размер шрифта на единицу Перевод строчка Устанавливает курсивное начертание шрифта Для отображения на веб-странице изображений Сокращает размер шрифта на единицу Универсальный тег, предназначенный для определения строчного элемента в документа Верхний индекс Нижний индекс |
| универсальные элементы | Для выделения текста, что был удален в новой версии документа Для акцентирования снова добавленного текста Комментарий | |
| перечни |
|
Нумерованный Ненумерованный Одельный элемент перечня Перечень определений |
| таблицы |
Б) Форматирование
Оформление занимает особенное место при создании WEB-сайта.
Оживляет страницу применение разных стилей шрифтов – полужирного, курсива, подчеркивания и т.д. Верный выбор шрифта, его стиля, размера и цвета акцентирует содержимое страницы, не завлекая внимание визитёра сайта к самому шрифту.
Ответственное место при оформлении страниц занимают перечни, каковые разрешают выделить группы перечислений и оформить их разными маркерами.
Применение линий разрешает поделить смысловые части страницы и оживить ее.
Громадное значение для увеличения наглядности страницы имеют таблицы, разрешающие довести до визитёра сайта предельное число информации при минимальном занимаемом на странице месте. Наряду с этим нужно выбирать цвет и толщину рамок так, дабы они не подавляли текстовую данные.
Особенное внимание при оформлении страниц занимает размещение фоновых рисунков и изображений. Картинки должны соответствовать с остальным оформлением страницы, не завлекая к себе чрезмерного внимания.
Весьма оживляет оформление страницы применение эффектов, таких как бегущая строчок, но не нужно злоупотреблять применением эффектов, в большинстве случаев на странице достаточно одной бегущей строчка.
Изменение шрифта
Изменение шрифта текста в HTML может производиться посредством тега …. Наряду с этим появляется возможность поменять у текста, появлявшегося в этого контейнера, начертание, цвет и размер шрифта.
…содержимое контейнера…
Тег FONTизменяет цвет и размер шрифта лишь для текста его содержимого, а для задания базисных значений (действующих По-умолчанию) для всего документа, употребляется тег BASEFONT, что устанавливает заблаговременно значения для атрибутов тегов FONT, находящихся по окончании него.
Тег BASEFONTне имеет закрывающего тега и обязан размешаться в начале содержимого контейнера BODY.
Тип шрифта
Для трансформации типа шрифта (гарнитуры) употребляется атрибут FACE, значением которого есть перечень шрифтов, приведенных через запятую в порядке уменьшения приоритета. В случае, если в совокупности клиента имеется шрифт с указанным заглавием, то он будет употребляться при воспроизведении данного фрагмента. В случае, если в заглавии шрифта имеются пробелы, то нужно забрать его в кавычки.
FACE = «Courier New, Arial, Tahoma»
В случае, если атрибут FACEне указан, браузеры будут применять по умолчанию шрифт Times New Roman
Courier New
Arial
Tahoma
System
3. Размер шрифта
Для трансформации размера шрифта в тексте употребляется атрибут SIZE. Размер шрифта задаётся по некой шкале, самостоятельно определяемой браузером конечного пользователя и не имеющей связи с размером типографской точки и другими единицами измерения.
SIZE= полный размер
SIZE= относительный размер
Атрибут SIZE устанавливает размер шрифта текста, содержащегося в пределах тега FOND. Возможно задать полный размер шрифта, указав какое-либо целое число от 1 до 7. Для шрифта возможно кроме этого показывать относительный размер (нужно в кавычках), присваивая атрибуту целое число со знаком, к примеру, SIZE= «+1» либо SIZE= «-2». В последнем случаи настоящий размер шрифта определяется суммированием указанного в атрибуте значения и текущего базисного размера, заданного тегом BASEFONT.
В случае, если в теге BASEFONT не употребляется атрибут SIZE, то По-умолчанию употребляется размер 3.
Цвет текста
Изменение цвета текста производится с применением атрибута COLOR. Этот атрибут показывает цвет, которым будет выделен этот фрагмент текста. Цвета задаются в виде RGB-значения с шестнадцатеричной нотацией, или правильным заглавием цвета на английском.
К примеру,
COLOR = #FF0000
COLOR = Red.
Для получения любого другого оттенка цвета возможно применить разные комбинации RGB-значений, записанные в шестнадцатеричном формате. На прилагаемом диске находится файл Таблица цветов.htm в котором приведены 216 цветов, отлично отображающихся браузерами на мониторах в 256-цветном режиме, конечно заглавия этих цветов.
С) Таблицы
Оформление таблиц
HTML воображает довольно широкие возможности оформления таблиц. Оформление может выполняться как посредством атрибутов главных тегов таблицы, так и посредством особых тегов.
Тег
BORDER – определяет ширину внешней рамки таблицы (в пикселях).
CELLPADDING – определяет расстояние (в пикселях) между рамкой каждой ячейки таблицы и содержащимся в ней материалом.
CELLSPACING – определяет расстояние (в пикселях) между границами соседних ячеек.
ALIGN – определяет метод горизонтального выравнивания таблицы. Вероятные значения: left – по левому краю, center – по центру, right – по правому краю. Значение по умолчанию – left.
WIDTHиHEIGHT – определяет ширину и высоту таблицы, значение задается или в пикселях, или в процентном отношении к ширине окна браузера.
BGCOLOR – определяет цвет фона ячеек таблицы. Он задается или RGB-значением в шестнадцатеричной совокупности, или одним из 16 базисных цветов.
– особый парный тег для описания заголовка таблицы. Атрибут этого тега ALIGN определяет место размещения заголовка. Его значение top помещает заголовок над таблицей, а bottom – под таблицей.
Оформленная таблица
При применении чёрного фона таблицы, возможно поменять цвет текста в ячейках, к примеру:
Текст… .
Нужно иметь в виду, что тег … обязан пребывать в тегов изменяемой ячейки таблицы.
Сложные таблицы
Размещая в ячеек одной таблицы теги вторых таблиц либо объединяя соседние ячейки, возможно создавать сложные таблицы.
Не считая тега
Для оформления содержимого ячеек возможно применять следующие атрибуты: ALIGN, WIDTH, HEIGHT, BGCOLOR, каковые определяют метод горизонтального выравнивания содержимого ячейки, её ширину, цвет и высоту соответственно.
VALIGN — определяет метод вертикального выравнивания содержимого ячейки. Вероятные значения: top — по верхнему краю, bottom — по нижнему краю, middle — по центру.
COLSPAN — определяет количество столбцов, на каковые простирается эта ячейка (ширина ячейки в столбцах). По умолчанию имеет значение 1.
ROWSPAN — определяет количество последовательностей, на каковые простирается эта ячейка (высота ячейки в строчках). По умолчанию имеет значение 1.
Высокая ячейка
Время от времени комфортно применять атрибут NOWRAP, что блокирует непроизвольный перенос слов в пределах текущей ячейки (текст в ячейке помещается в одну строчок).
d) Графика
Изображения в HTML
Для размещения изображений на Web-страницах употребляются разные графические форматы, чаще всего используются — JPEG и GIF.
JPEG употребляется для фотоизображений и полутоновой графики, живописи, изображений и градиентов с множеством небольших многоцветных подробностей.
GIF употребляется для рисованных изображений, векторной графики, картин без полутонов, градиентов (переходов от цвета к цвету) и громадного количества небольших подробностей различного цвета. Кроме того, формат GIF употребляется для сохранения анимированных изображений и картинок с прозрачными частями.
Для размещения изображений существует особый тег , имеющий необходимый параметр SRC= «адрес».
IMG – тег изображения
SRC= «адрес» — атрибут источника
атрибут1, атрибут2…- атрибуты изображения
В качестве параметра (адрес) может употребляться пара типов доводов:
имя файла с изображением (для изображений, находящихся в текущем каталоге)
адрес файла с изображением (для изображений, находящихся в других каталогах)
URL изображения (для изображений, находящихся в Интернете либо на вашем сервере)
Выравнивание изображений
Для определения и выравнивания изображений их положения относительно текста используется атрибут ALIGN.
Он может принимать следующие значения:
leftили right –сглаживает изображение по левому либо правому краю документа.
top — сглаживает верхнюю линию текущей текстовой строки довольно верхней кромки изображения.
middle — сглаживает базисную (нижнюю) линию текущей текстовой строки с вертикальным центром изображения.
bottom — сглаживает базисную линию текстовой строки довольно нижней кромки изображения.
Также для центрирования изображения по горизонтали всего HTML – документа употребляется тег .
E)Гиперссылки
Что такое гипертекст?
Гипертекст – метод структурирования документов методом размещения ссылок в одного документа либо между документами. В отличие от обычного текста гипертекст разрешает осуществлять мгновенный переход от одного фрагмента текста к второму. Совокупности помощи многих популярных программных продуктов устроены конкретно по гипертекстовому принципу. При нажатии левой кнопкой мыши на некий выделенный фрагмент – гиперссылку текущего документа – происходит переход к некоему заблаговременно назначенному документу либо фрагменту документа.
В HTML переход по гиперссылке задается посредством тега вида:
ссылка
”[адрес]” – адрес перехода;
ссылка — текст, активизация которого приводит к переходу.
В качестве параметра [адреса перехода] может употребляться пара типов доводов:
§ адрес документа
§ адрес сайта сети Интернет либо внешнего сервера
§ адрес электронной почты
§ адрес перехода к определенному месту в документа.
Переходы в документа
При необходимости возможно задать переход не просто к некоему документу, но и к определенному месту в документа. Для этого нужно создать в документе некую опорную точку либо анкер. Это тег особого вида, в котором употребляется атрибут NAME. Допустим , что нужно осуществить переход к слову »Параграф 1».
В первую очередь нужно создать анкер, находящийся в месте размещения требуемого слова и «охватывающего» его:
Параграф 1 где : Метка 1- имя анкера.
Слово “Параграф 1”наряду с этим не как не будет выделен в тексте документа браузером. После этого нужно выяснить ссылку для перехода на данный анкер: Переход к слову – Параграф 1 .
При активизации данной ссылки браузер переместит изображение страницы так, дабы текст «Анкер1» был в верней видимой строке окна.
f) -последовательности
В HTML имеется возможность вывести на экран особые либо зарезервированные знаки, это делается посредством -последовательностей (их еще именуют символьными объектами либо эскейп-последовательностями). Браузер показывает на экране знак «» кодируется последовательностью gt (по первым буквам британских слов greater than – больше, чем). Знак «» (амперсант) кодируется последовательностью amp. Двойные кавычки (») кодируются последовательностью quot. Часто употребляется неразрывный пробел- nbsp.
-последовательности — символьные объекты либо эскейп- последовательности — кодовая комбинация, разрешающая вывести на экран особые знаки.
Ниже приведено пара довольно часто применяемых -последовательностей
| larr | Стрелка влево | cent | Цент |
| uarr | Стрелка вверх | pound | Фунт стерлингов |
| rarr | Стрелка вправо | curren | Финансовая единица |
| darr | Стрелка вниз | yen | Иена либо юань |
| harr | Стрелка влево-вправо | brvbar | Порванная вертикальная черта |
| iexcl | Перевернутый восклицательный символ | sect | параграф |
G)Режимы браузеров
?На протяжении противостояния браузеров MSIE и Netscape любой из разработчиков старался улучшить собственный продукт. Netscape 4 и IE4 не хорошо поддерживали веб-стандарты, исходя из этого следующая версия, IE5 должна была не только исправить неточности IE4, но и продемонстрировать улучшенную помощь спецификации CSS. Это было нужно еще и по политическим мотивам, потому, что компания Микрософт вошла в группу W3C и начала оказывать сильное влияние на разработку HTML и CSS.
В ходе работы над браузером IE5 его разработчики столкнулись с неожиданной трудностью. Отличие при отображении страницы в различных предположениях браузера была так громадна, что множество сайтов были бы неработоспособными при просмотре в IE5. Мысль сделать кнопку для переключения в режим совместимости пришла лишь в версии 8.0, исходя из этого разработчики IE5 пошли вторым путём. Все ветхие страницы отображались по ветхим правилам, а для включения режима помощи стандартов в код страницы нужно добавить элемент (доктайп).
Режим браузера для просмотра конкретной веб-страницы устанавливается через элемент , что есть необходимым в соответствии с спецификации HTML и XHTML. Сложности появляются по причине того, что по сути доктайп несколько, а различается дополнительными параметрами, воздействующими в итоге на режим отображения страницы.
Практически обычный режим
?Данный режим основан на стандартном режиме с некоторыми исключениями: отображение изображений в рисунков и ячеек таблицы приятель под втором происходит как в режиме совместимости. Для переключения в практически обычный режим используется один из следующих доктайпов.
Для HTML:
Для фреймов в HTML:
Для XHTML:
Для фреймов в XHTML:
Не считая переключения браузера в один из режимов, доктайп кроме этого информирует, в соответствии с каким правилам синтаксиса проводить диагностику текущего документа. К примеру, для HTML 4.01 и XHTML 1.0 существует по три различных типа доктайпа, для HTML5 только один.
Строгий доктайп
Используется строгий синтаксис языка, допускается включать все атрибуты и теги, не считая осуждаемых.
Для HTML 4.01:
Для XHTML 1.0:
Правила синтаксиса зависят от применяемой версии, но в целом должны соблюдаться следующие.
- Осуждается применение следующих тегов:
, , , , ,, , , , , , . Вместо по возможности рекомендуется применять стили.
- Текст, изображения и элементы форм запрещено напрямую додавать в , эти элементы должны непременно пребывать в блочных элементов наподобие
либо .
- Осуждается использование атрибутов
target, start (тег
- ), type (теги
- ,
- ,
- ) и др.
Конечно, кроме этого обязан соблюдаться синтаксис языка — верное вложение тегов, закрытие тегов, должны находиться необходимые теги и др. Документ с неявными неточностями приведён в примере 1
Пример 1. Невалидный код HTML
Заголовок
В данном примере у тега нет необходимого атрибута action, тег находится напрямую в формы, не смотря на то, что должен быть заключён в блочный тег. Кроме этого не указана кодировка через метатег. Это не есть неточностью, но пользователям в некоторых случаях придется самостоятельно показывать её в браузере. Валидный код XHTML с учётом исправленных неточностей при строгом доктайпе показан в примере 2.
Пример 2. Валидный код XHTML
Заголовок
Переходный доктайп
Используется «мягкий» синтаксис языка, допускается применять все атрибуты и теги, включая осуждаемые.
Для HTML 4.01:
Для XHTML 1.0:
Цель переходного доктайпа содержится в постепенном знакомстве с синтаксисом языка. При переходном доктайпе добавление target к тегу полностью валидно (пример 3).
Пример 3 Применение переходного доктайпа
Ссылка в новом окне Открыть в новом окне
HTML5
В HTML5 существует только один тип доктайпа, что переводит браузер в обычный режим.
Режимы MSIE
СОЗДАНИЕ HTML СТРАНИЦ
a) Базы языка HTML
b) Форматирование
c) Таблицы
d) Графика
e)Гиперссылки
f) -последовательности
g) Режимы браузеров
h)Логическая и физическая структура сайта
a) Базы языка HTML
Понятия языка разметки
HTML-документ представляет собой простой текстовый файл в формате ANSI ASCII, содержащий фактически специальные теги и текст для его разметки, и ссылки на другие документы, графические изображения и каждые иные файлы. Теги задаются в файле и обрабатываются браузером в соответствии с правилами особого языка HTML (Hyper Text Markup Language – Язык Разметки Гипертекста).
HTML не есть языком программирования.
HTML – это обычный язык разметки, т. е. с его помощью возможно оформлять документы, создавать ссылки, но никак не писать программы.
Гипертекст это текст, в котором имеются ссылки для автоматического перехода на другие тексты – гиперссылки.
Тег (от англ., tag – ярлык, метка) – элемент языка HTML, применяемый для разметки Web-страниц.
Элементы разметки складываются из заключённых в угловые скобки ( и ) дескрипторов – тэгов (tags) и их атрибутов. Совокупность открывающего () и закрывающего () дескрипторов — имеется контейнер. Элементы HTML подразделяются на структурные — каковые организуют текст и на форматирующие — каковые задают его стиль. Для документа HTML нужно создать текстовый файл с содержимым, засунуть необходимые тэги и по окончании внесения трансформаций текстовый файл сохраняется с расширением .htm либо .html.
Язык HTML был создан Тимом Бернерс-Ли. В 1990-х годах HTML взял широкое признание благодаря стремительному росту Web.
История развития HTML
HTML 1.0 – был направлен на представление языка как такового, где описание его возможностей носило скорее рекомендательный темперамент.
HTML 2.0 (ноябрь 1995) – был создан под руководством Internet для упорядочения общепринятых положений.
HTML+ (1993) и HTML 3.0 (1995) – это более широкие предположения языка HTML. Не обращая внимания на то, что в простых дискуссиях по стандарту согласие между разработчиками браузеров не было достигнуто, эти предположения содержат последовательность новых неспециализированных особенностей.
HTML 3.2 (январь 1997) создан упрочнениями Коммисии World Wide Web Consortium по HTML для упорядочения последовательности общепринятых изменений и положений прошлых предположений.
4.0 (с 1999 г.) – вводятся механизмы таблиц стилей, скриптов, кадров, внедрения объектов, улучшенная помощь различных направления и направлений письма справа налево, таблицы с громадным числом возможностей и новые свойства форм.
Типы HTML-редакторов
Для любого файла нужна какая-нибудь программа.
HTML-редакторы подразделяются на два типа:
§ редакторы тегов (HTMLPad, LightPad, HomeSite, Visual HTML Workshop) – предполагают, что пользователь знаком с языком HTML
§ WYSIWYG-редакторы (Netscape Composer, Front Page Express, Front Page 2000, Микрософт Word) – довольно часто именуют редакторами типа «что видишь, то и возьмёшь» (what you see is what you get).
Не все WYSIWYG-редакторы смогут генерировать код HTML, абсолютно тождественный форматируемой странице. К примеру, MS Word теряет при преобразовании в HTML данные о стиле линий.
Редакторы тегов
Подготовка сайта посредством редакторов тегов включает в себя этапы:
Создание HTML-документа;
Оформление (изменение цвета и формата шрифта; форматирование структуры таблиц; изменение фона страниц; внедрение графических элементов; использование эффектов; связывание страниц сайта);
Сохранение;
Просмотр взятой Web-страницы в браузере;
Размещение сайта в Интернете.
Остановимся на том, из каких главных этапов состоит процесс создания документа HTMLвручную, не прибегая к специальным приложениям:
- Комплект содержимого в любом из текстовых процессоров (к примеру, Блокнот) и сохранение простого текстового файла.
- Логическое и физическое форматирование текста (разбивка на абзацы, блоки, заголовки и пр., внешнее их оформление) при помощи тэгов и сохранение текстового файла с расширением .htm либо .html (делается в Блокноте в кодировке Unicode).
- Организация переходов по гиперссылкам документа при помощи элемента — главного связующего элемента языка HTML.
- Внедрение в документ нужных объектов: картинок, таблиц, видео видеоклипов, аудио файлов, Java, скриптов и т.д. и т.п. снова же при помощи тэгов языка HTML.
Чтобы в последствии поменять любой из созданных файлов, достаточно открыть его при помощи того же приложения Блокнот, откорректировать и сохранить трансформации. Браузер Internet Explorerпозволяет сделать трансформации прямо в нем самом, для этого нужно в меню Вид выбрать просмотр В виде HTML, либо кликнуть правой кнопкой мыши и выбрать тот же пункт меню. Чтобы заметить трансформации в документе достаточно в меню Вид выбрать Обновить, или кликнуть в панели управления браузера на значке
5. Структура -документа
Любой -документ складывается из следующих главных частей:
§ Строки с информацией о версии HTML, применяемой в данном документе
§ Блока заголовка документа
§ Тела документа.
Любой тег HTML принадлежит к определенной группе тегов, к примеру, табличные теги направлены на формирование таблиц и не смогут использоваться для других целей.
Условно теги делятся на следующие типы:
- теги верхнего уровня;
- теги заголовка документа;
- блочные элементы;
- строчные элементы;
- универсальные элементы;
- перечни;
- таблицы;
- фреймы.
Отличие между блочными и строчными элементами следующая:
Строчные элементы смогут содержать лишь эти либо другие строчные элементы, а в блочные возможно вкладывать другие блочные элементы, строчные элементы, и эти. Иными словами, строчные элементы никак не смогут хранить блочные элементы.
Блочные элементы постоянно начинаются с новой строчка, а строчные таким методом не акцентируются.
Блочные элементы занимают всю дешёвую ширину, к примеру, окна браузера, а ширина строчных элементов равна их содержимому плюс значения отступов, границ и полей.
Перечни новостей либо статей — те же перечни. Но с одной маленькой изюминкой: у элементов для того чтобы перечня имеется что-то общее, то есть дата. Исходя из этого предлагается следующая HTML-конструкция:
| 02.10.05 новость 3 новость 2 01.10.05 новость 1 |
Таблица 1. Главные тэги по типам