Структура web-документа - Создание сайта
Каждый HTML-документ, отвечающий спецификации HTML какой-либо версии, должен начинаться со строки объявления версии HTML <!DOCTYPE...>, которая обычно выглядит примерно так:
<! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www. w3.org/TR/html4/loose. dtd">
В данном случае мы говорим браузеру, что HTML соответствует международной спецификации версии 4.01. Не пытайтесь запомнить эту строчку наизусть, главное - вы должны знать, что она необходима. Ведь именно она помогает сделать сайт, который будет одинаково смотреться во всех браузерах (обычно это три основных Internet Explorer, Opera, Firefox).
Далее обозначается начало и конец документа тегами <html> и </html> соответственно. Внутри этих тегов должны находиться теги головы (<head></head>) и тела документа(<body></body>).
Обычно основой головы документа является элемент TITLE - заголовок документа. Также там содержится вся техническая информация, различные таблицы стилей и. т. п. А основное содержимое: текст, таблицы, картинки, - находится в теле документа.
На этой смешной картинке схематически изображена структура:
Как вы видите голова находится над телом, поэтому никогда не размещайте голову документа в теле документа (или наоборот). Сначала закрываем голову документа </HEAD>, и лишь затем открываем тело <BODY>. И еще, у документа одна голова и одно тело, и не стоит пытаться создавать их большее количество.
Включение в документ заголовочной части не является обязательным. Задачей заголовка является представление необходимой информации для браузера и сервера HTTP. Информация, размещенная внутри заголовка документа, обычно не выводится на экран (кроме названия документа).
Заголовок документа открывается тегом <HЕAD>, который обычно следует сразу же за тегом <HTML>. Закрывающий тег </HEAD> показывает конец этого раздела, между ними располагаются остальные теги заголовка документа.
Чаще всего в заголовок документа включают парный тег <TITLE>... </TITLE>, определяющий Название документа. Так же, между тегами <HЕAD>... </HЕAD> вписываются различные Java - скрипты, которые отображаются непосредственно для всей Html-странички (JavaScript - язык, созданный (разработчик - фирма Netscape.) для организации выполнения в HTML - документе некоторой последовательности операций - сценария (скрипта) - на компьютере пользователя. Все, что стоит между тэгами <script> и </script>, интерпретируется как код на языке JavaScript.).
В отличие от заголовка, тело документа является обязательным элементом, так как в нем располагается весь материал вашего документа (есть только одно исключение, с которым мы познакомимся далее, когда документ содержит вместо тела группу фреймов). Тело документа размещается между тегами <BODY> и </BODY>. Все, что размещено между этими тегами, интерпретируется браузером в соответствии с правилами языка HTML, позволяющими корректно отображать страницу на экране монитора.
Тег <BODY> не только обозначает начало содержимого документа, но и задает его основные свойства: цвет фона, текста и многое другое. Эти свойства определяются с помощью атрибутов.
Очень полезным при создании сайтов является вставка комментария. Почему? да потому, что через месяц после создания, вам будет трудновато разобраться, что к чему, ведь кода будет очень много. А если вы будете комментировать свои действия - тогда разобраться будет значительно легче!
Закомментированный текст нужен только для Вас, т. е. при просмотре документа через браузер его видно не будет.
В начале комментарий нужно открыть тегом <!-- затем вписать текст, и закрыть тегом -->
Например:
<! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www. w3.org/TR/html4/loose. dtd">
<html>
<head>
<title>
Сайт о фирме ООО "ДИНАС"
</title>
</head>
<!-- начнем работать с телом документа -->
<body>
<!--пишем контактные данные о фирме, вставляем таблицу с ценами-->
</body>
<!--закончили с телом документа-->
</html>
Создаем Свою Первую Страничку для фирмы ООО "ДИНАС".
Шаг 1. Создайте свою личную папку (Ф. И.)и сохраните ее на SERVERЛичные папки. В ней создайте новую папку с названием "Сайт для ООО "ДИНАС".
Шаг 2. Создадим текстовый файл. Пуск - Программы - Стандартные - Блокнот.
Для написания сайта желательно разбираться в тегах. Основные будем запоминать.
Итак, начинаем написание с фразы:
<! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www. w3.org/TR/html4/loose. dtd">
Далее вставляем тег, обозначающий начало документа (<html>),
Тег головы(<head>), Тела (<body>)
<html>
<head>
<title> Составляем сайт для ООО "ДИНАС"
</title>
</head>
<body>
Далее напишите следующий текст:
Вас приветствует общество с ограниченной ответственностью "ДИНАС"
Наши контактные данные: Адрес: 600000, г. Владимир, ул. Большая Московская, дом № 28б телефон 43-52-89
Сохраните файл с расширением HTML, выбрав в окне сохранения тип файла - все файлы. Имя оставьте ООО ДИНАС.
Можете открыть сохраненный файл. Вот что у вас должно получиться:
Как вы заметили, текст идет слитно, без разделений на абзацы, также ничего не выделено заголовком, короче форматирование отсутствует! Т. е. чтобы Браузер правильно отображал текст, необходимо задать его форматирование.
Для того, чтобы внести изменения в страничку, Вам нужно открыть данный файл через обычный блокнот.
Для начала нового абзаца служит тег (тэг) <P>... </P>
После открытия страницы в окне Веб-браузера все абзацы ее текста, помеченные тегом (тэгом) <P>, разделяются пустыми строками, что улучшает ее компоновку и внешний вид.
По умолчанию браузер обычно форматирует абзац с выравниванием по левому полю. Для принудительного выравнивания служит атрибут align. С его помощью абзацы могут быть выровнены влево, вправо, по центру и по ширине.
Для перехода к новой строке используется тег (тэг) <BR>.
Он сообщает браузеру, что следует прекратить размещение текста и других элементов страницы в пределах текущей строки и перейти к новой строке. Этот тег (тэг) не имеет своего двойника с косой чертой, так называемого закрывающего тега (тэг).
Основное использование этого тега (тэга) - для принудительного размещения встроенных элементов в определенном месте страницы. Он удобен, также, в тех случаях, когда необходимо увеличить пустые области между отдельными элементами страницы.
Похожие статьи
-
Все тэги HTML начинаются с "<" (левой угловой скобки) и заканчиваются символом ">" (правой угловой скобки). Как правило, существует стартовый тэг и...
-
Что такое HTML. Hyper Text Markup Language (HTML) является стандартным языком, предназначенным для создания гипертекстовых документов в среде WEB....
-
Проектирование и разработка сайта Средства разработки Язык гипертекстовой разметки HTML В Интернете сосредотачивается и передается достаточно большое...
-
Для того, чтобы создать страницу сайта достаточно в текстовом редакторе, в блокноте сделать следующую надпись: Первая страница сайта создана. После...
-
За структуру HTML-документа отвечают следующие теги: <HTML> - в данном контейнере находится все содержимое HTML-документа. <HEAD> - содержит...
-
Оформление сайта, Язык HTML - Создание сайта
Оформление или дизайн - это внешний вид сайта. Эта та оболочка, которую вам придется надевать на ваш сайт, как этикетку на коробку с товаром. От этой...
-
Структура сайта - Компьютерная лингвистика в образовательной среде
Структура сайта разработана в соответствии с основными требованиями к веб-приложению. (Рис.3) Содержит в себе 3 основные страницы (одна из которых...
-
Шаблоны сайта Bootstrap3 Веб-дизайн является одним из основных элементов в процессе создания сайта. Именно от него зависит, насколько удобно и комфортно...
-
Для того, чтобы понять структуру и сценарий Web-документа, мы должны рассмотреть несколько Web-страниц и выявить общие элементы. Любой Web-документ...
-
Разработка структуры сайта Разработка структуры web-сайта является одним из ключевых моментов его создания, который в большой степени определяет...
-
Сервисы сайта - Создание сайта
Сервисы сайта направлены на облегчение использования сервисов компании. Так, например, онлайн-консультация позволяет пользователю быстро получить ответ...
-
Adobe Dreamweaver Adobe Dreamweaver - это HTML-редактор от компании Adobe, который на сегодняшний день очень известный. Первая его версия была выпущена в...
-
Общая структура HTML-файла - Основы HyperText Markup Language
Суммируя вышесказанное приведем общую структуру HTML-файл : <HTML> <HEAD> <Мета-теги> <Функции скриптов> <TITLE>Заголовок...
-
Программы (ресурсы) для создания презентаций - Структура презентации
1.Microsoft PowerPoint Говоря "программа для презентаций" большинство подразумевают PowerPoint, аналогично и с другими программами пакета Microsoft...
-
Принцип работы языка. Синтаксис Как и было сказано ранее основой для HTML-были приняты текстовые документы, содержащие в себе HTML5. Рассмотрим следующий...
-
Инвестиционная привлекательность рынка - Создание сайта
К настоящему времени наблюдается устойчивый тренд роста числа белорусских потребителей, использующих Интернет для получения всевозможной информации. По...
-
Термины, используемые в техническом задании Web-сайт - в компьютерной сети объединенная под одним адресом совокупность документов частного лица или...
-
Если сравнить исходные тексты различных Web-страниц, можно легко увидеть сходство их структур. Это объясняется тем, что документы создаются по...
-
"WWWSQLDesigner" позиционируется как абсолютно бесплатный, доступный для пользователей, универсальный веб-редактор, значительно упрощающий процесс...
-
Организация связи в Internet - Создание сайта
При организации связи между вычислительными машинами, используется специальный набор правил, которые называются протоколом связи. Схема связи: клиент -...
-
Создание списковых структур данных
Цель работы: Написать программу формирования и печати двусвязного списка Ваших друзей с указанием их телефонов и адресов. Признаком окончания списка...
-
Что такое Flash? Flash (от англ. Flash - "вспышка", произносится "флэш") Flash - это технология веб-мультипликации и создания интерактивного контента от...
-
Выводы и рекомендации к сайту - Создание сайта
Хотя полного аналога проекта компании "Музыкальная компания BOOM", найти на белорусском рынке не удалось, все же были выведены общие критерии, актуальные...
-
Математическое и программное обеспечение (МО, ПО)- совокупность математических методов, моделей, алгоритмов и программ для реализации целей и задач...
-
Инструментарий разработки - Современные средства создания электронного обучающего материала
Для разработки электронного учебного пособия был выбран язык HTML. Общие сведения о языке HTML. Для подготовки информации и сохранения ее в виде...
-
Информационное обеспечение - совокупность единой системы классификации и кодирования информации, унифицированных систем документации, схем информационных...
-
Автоматизированное извлечение текстов для корпуса политических статей сайта Lenta. ru Для создания полезного обучающего корпуса требуется постоянное...
-
Анализ целевой аудитории. - Создание сайта
Пользовательская аудитория - преимущественно мужчины (80%), а так же женщины (20%) в возрасте от 18 до 50 лет. Можно разделить на четыре (4) основные...
-
Разработка сайта, Среда разработки web-сайта - Разработка сайта для компании
Среда разработки web-сайта При разработке web-сайта используются: - HTML - язык разметки web-страниц; - CSS - формальный язык описания внешнего...
-
Структура сайта в виде блок-схемы (Рисунок 1) Рисунок 1 - Структура сайта в виде блок-схемы Mockup главной страницы Макет сайта (Рисунок 2) был выполнен...
-
Этапы создания сайта - Разработка интернет-магазина компьютерной техники
Разработка сайта - процесс трудоемкий, в котором обычно участвуют несколько специалистов. Чтобы проект был успешным, необходимо как минимум определить:...
-
Разработка структуры сайта Сайт состоит из множества страниц с информацией и среди них важные: главная, о компании, и контакты. Главная (начальная)...
-
Создание базы данных (структура таблиц) База данных предназначена для работников гостиницы. В базе данных должны храниться сведения о проживающих...
-
Объектом автоматизации сайта "вопрос-ответ" является предметная область "Проектирование информационных систем". Основное назначение сайта "вопрос-ответ"...
-
Структура ЭУП Пособие содержит две главы, каждая из которых разбита на параграфы. Первая глава рассматривает теоретический материал. Вторая глава...
-
Техническое обеспечение (ТО) - комплекс технических средств, предназначенных для работы информационной системы, а также соответствующая документация на...
-
Как создать свой сайт? Итак, создание сайта всегда начинается с идеи. Прежде, чем приступить к работе над сайтом, вы должны четко представлять, что вы в...
-
Структурная схема терминов Структуру АИС составляет совокупность отдельных ее частей, называемых подсистемами. АС состоит из двух подсистем:...
-
Резюме Наименование проекта: Компания услуги по созданию интернет-сайтов. Инициатор проекта: Иванов Иван Иванович Организационно-правовая форма -...
-
Тэги в HTML. - Создание электронного учебника (по HTML) в редакторе Microsoft Front Page
Тэги тела документа идентифицируют отображаемые в окне компоненты HTML-документа. Тело документа может содержать ссылки на другие документы, текст и...
Структура web-документа - Создание сайта