Понятие об HTML

Содержание: 

Введение …………………………………………………2 
1. Понятие об HTML……………………………………4 
1.1. Структура файла в формате HTML……………..7 
1.2. Отличительный признак HTML-документа ….10  
2. Гипертекстовые ссылки …………………………...12  
3. Создание документов в стандарте HTML………..15  
3.1. Заголовки…………………………………………...15   
3.2.Форматирование текста и изменение стилей…...16  
3.3. Фреймы……………………………………………..17  

4. Гиперссылки…………………………………………21

5. Таблицы в языке HTML……………………………23 
Заключение……………………………………………...25 
Литература……………………………………………....27   
 
 
 
 
 
 
 
 

 
Введение

 
Глобальная Сеть не только соединила  пользователей всего мира, но и  утвердилась в виде новых технологий на наших персональных компьютерах. Действительно, пользователь, который  приобрел и установил на своей  машине Microsoft Office, становится обладателем Internet-технологии в готовом виде, независимо от того, подключен его  компьютер к Сети или нет.  
Иными словами, средства, предназначенные для работы с Сетью, стали использоваться и в других целях, с нею не связанных, а среди программного обеспечения, устанавливаемого на большинство персональных компьютеров, приложения для Internet заняли свое почетное место.  
Актуальность темы. В результате работа многих пользователей стала иметь большее отношение к Сети, чем они того сами, может быть желали. Так, одним из способов самовыражения стало размещение личных страничек в Internet. Многие коммерческие фирмы стали использовать Сеть для рекламы и сбыта своей продукции. Людям, занятым поиском работы, стал доступен и такой сервис: составить резюме в формате Web-страницы и разместить эту информацию в Сети. Важную роль Internet стал играть для научных, учебных и общественных организаций. Подтверждение этому легко найти, выйдя на просторы киберпространства.  
Моя цель состоит в том, чтобы научиться создавать собственные страницы для WWW. Для этого придётся познакомиться с правилами, в соответствии с которыми страницы хранятся на диске компьютера. Любая страница представлена в виде отдельного текстового файла, который можно создать любым текстовым редактором. Так как страница может содержать не только текст, но и множество других элементов (шрифтовое оформление текста, иллюстрации и т. п.), то в текст встраиваются специальные управляющие конструкции, называемые тегами. Весь набор правил, по которым нужно создавать файл с web-страницей и записывать отдельные теги, называется языком разметки гипертекста (HyperText Markup Language, HTML). Браузеры при открытии файла в формате HTML способны расшифровать теги и показать страницу в своём окне так, как она была задумана создателем. В операционной системе Windows файлы web страниц должны иметь расширения "htm" или "html". При обучении правилам HTML нет необходимости помещать наши страницы на действующий сайт в Internet, достаточно хранить их в виде файлов на конкретной рабочей станции или на сервере локальной сети.  
 
 
 
 
 
 
 
 
 
 
 
 

 
1. Понятие об HTML

Компьютерные  сети.

Компьютерной  сетью называют связь двух или более компьютеров. Компютеры могут быть связанны между собой различными способами (типами соединения). Самыми распостраненными видами соединения является кабельное соединение (Ethernet, модем) или соединение по радиоканалу (WiFi).

Интернет.

Сетью интернет является объединение компьютерных сетей между собой в одну большую всемирную глобальную сеть. Иными словами это просто связь очень большого числа компьютеров для передачи информации между ними, при помощи различных типов соединений (кабельное, спутниковое, радиоканалы), и оборудования, которое позволяет передавать информацию от одного узла (компьютера) сети к другому (сетевые карты, модемы, WiFi точки доступа, свитчи, маршрутизаторы и т.д.).

Веб-сайты.

Одним из способов передачи (или, более правильно — размещения) информации в глобальной сети интернет стали веб-сайты.

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

Порталы. Веб-порталы. Интернет-порталы.

Все это  просто разновидности сайтов. По простому, порталом, можно назвать большой сайт, на котором расположенно много контента (информации).

Веб-программирование.

Под этим термином подразумевается процесс  создания веб-сайта или портала. Сайты бывают двух типов: статические и динамичческие.

Для создания статического сайта достоточно использовать язык разметки контента (X) HTML и CSS. Статичские сайты предназначены только для отображения контента, но не предоставляют никакого динамического формирования страниц и обратного взаимодействия с пользователем (хотя это условно). А вот для созданиядинамического сайта, кроме языка разметки, необходимо использовать язык программирования (для этих целей в настоящее время самыми распостраненными языками являюются PHP, Java, C#, VB.NET, Ruby) и, необязательно, базу данных для хранения в ней контента и других необходимых воспомогательных данных.

Верстка.

Верстка — это процесс создания макета сайта, на основании дизайна (шаблона).

Обычно  версткой занимается верстальщик, реже веб-программист, который получает от веб-дизайнера картинку (макет) сайта. Верстальщик на основании картинки, создает макет страницы (статическую страницу или несколько). После того как верстка (или еще другими словами — шаблон сайта) готова, на ее основании веб-программист создает движок для сайта.

Иногда  может быть наоборот, сначала создается  движок, а потом на него «натягивается» готовый макет (шиблон, верстка). 

Движок  сайта.

Движком называется набор скриптов (или программа) с помощью которых формируется сайт на основании информации хранящейся в файлах, либо, по большей части, в базе данных.

База  данных.

Под базой данных подразумевают структурированные данные размещенные в файлах (либо в одном файле) и к которой можно добраться (манипулировать данными) с помощью языка запросов SQL.

Часто, базой данных, ошибочно называют Системы Управления Базой Данных (СУБД).

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

При разработке веб сайтов, необходим инструментарий. А инструменты стоят денег. Как  же быть бедным студентам стремящимся  к получению знаний и не имеющих  достаточного количества денег? В их нелегком пути к знаниям, можно использовать бесплатное ПО для Windows, с помощью которого и можно будет изучить технологии и накопить денег на покупку профессиональных инструментов.

 
Html-документ- это текст, состоящий из HTML-кодов и основного текста документа. Для форматирования текста, задания структуры документа, встраивания ссылок и мулитимедиа-объектов в HTML-документах используются специальные кодовые слова, которые называются дескрипторами разметки (тегами). 

 
Итак, рассмотрим основные теги, входящие в каждый Web-документ.  
Отличительный признак HTML-документа. Одним из принципов языка является многоуровневое вложение элементов. HTML является самым внешним, так как между его стартовым и конечным тегами должна находиться вся Web-страница.  
Область заголовка Web-страницы. Иными словами, ее первая часть. Так же как и HTML, HEAD служит только для формирования общей структуры документа. Этот элемент заключает в себе гипертекст, который определяет собственно Web-страницу. Эта та часть документа, которую разрабатывает автор страницы и которая отображается браузером. Соответственно, конечный тег этого элемента надо искать в конце HTML-файла. Внутри BODY можно использовать все элементы, предназначенные для дизайна Web-страницы. Внутри стартового тега элемента BODY можно расположить ряд атрибутов, обеспечивающих установки для всей страницы целиком. 

1. Структура файла в формате HTML

В первую очередь нам потребуется создать  файл с расширением "htm" или "html" и открыть его для редактирования в текстовом редакторе (работая  под Windows, можно использовать стандартную  программу "Блокнот").  
Текст для HTML-документа набирается в том виде, в котором его должен показать браузер, а при выделения фрагментов, которые предназначены для разметки документа (тегов), используются угловые скобки (знаки "больше" и "меньше"), например: Любой документ HTML начинается с открывающего тега и заканчивается соответствующим ему закрывающим тегом . Закрывающий тег отличается от открывающего наличием косой черты перед названием тега. В языке HTML нет различий между большими и малыми буквами при записи тегов, однако принято записывать открывающий тег большими буквами, а закрывающий - малыми. Часть документа, которая находится в пределах от открывающего до соответствующего ему закрывающего тега, называется контейнером (to contain - содержать что-либо). Теги, у которых есть закрывающий и открывающий варианты записи называются парными, а те, которые используются только в одном виде (например, тег ), называются непарными. Весь файл web-страницы - это по сути дела один большой контейнер HTML (так как начинается и заканчивается).  
Внутри контейнера HTML последовательно записываются два контейнера:  
1. (заголовок документа). Внутри этого контейнера записываются параметры, общие для всей страницы. Для примера можно поместить сюда контейнер , позволяющий поместить текст для отображения в заголовке окна браузера.  
2. (тело документа). Этот контейнер содержит всё то, что должен показать браузер внутри своего окна при открытии документа. Если документ содержит только текст, то этот текст нужно записывать именно здесь, если есть другие элементы (графика, таблицы, ссылки и т. д.).  
Если сравнить исходные тексты различных Web-страниц, можно легко увидеть сходство их структур. Это объясняется тем, что документы создаются по определенным правилам. В основу синтаксиса языка HTML лег стандарт ISO 8879:1986 «Information processing. Text and Office systems. Standard Generalized Markup Language (SGML)». Правда, существует большое различие между стандартом официальным и стандартом фактическим.  
Ниже приведен шаблон типичного Web-документа. На его примере мы рассмотрим общие принципы построения HTML-страниц.  
Для того чтобы понять структуру Web-страницы, нам необходимо подробно рассмотреть все элементы, входящие в приведенный листинг.  
name=’’Author’’  
content=’’Irina’’>  
name=’’Keywords’’  
content=’’WWW, HTML, document, element’’>  
Переход в конец документа  
Переход к ссылке 1  
Заголовок1  
Заголовок2  
Заголовок3  
Заголовок4  
Заголовок5  
Заголовок6  
Здесь расположена ссылка 1  
Здесь должен располагаться оригинальный текст Web-страницы  
Переход в начало документа  
Текст комментария.  
В любом языке программирования есть конструкции, позволяющие создавать произвольные ремарки. HTML в этом смысле - не исключение. Текст, помещенный внутри COMMENT, игнорируется браузером. COMMENT может располагаться в любом месте кода Web-страницы. Без конечного тега, здесь по-видимому не обойтись: комментарий должен быть отделен от основного текста. 
Существует, правда, одно ограничение: внутри комментария не должны располагаться другие элементы. Так должно быть, разумеется, только в том случае когда необходимо, чтобы все содержимое элемента COMMENT не отображалось на экране монитора. Если в комментарии будет присутствовать другой элемент, то его содержимое будет выведено на экран, отформатированное соответствующим образом. С этой проблемой связана другая, похожая: обычный текст не может содержать фрагменты, имеющие вид тегов. Для того чтобы включать в текст подобные конструкции, существует элемент PLAINTEXT. Существует и другой способ обозначения комментария. Он заключается в использовании восклицательного знака и обрамлении текста комментария двойным тире.  
Внутри подобной конструкции можно помещать и теги: они не будут восприниматься браузером.  
 
                   1.2 Отличительный признак HTML документа

 
Одним из принципов языка является многоуровневое вложение элементов. HTML является самым внешним, так как  между его стартовым и конечным тегами должна находиться вся Web-страница. В принципе, этот элемент можно  рассматривать как формальность. Он имеет атрибуты4 version, lang и dir, которыми в данном случае мало кто пользуется и допускает вложение элементов HEAD, BODY и PLAINTEXT, определяющих общую структуру Web-страницы. Естественно, что конечным тегом заканчиваются все гипертекстовые документы.  
Область заголовка Web-страницы. Иными словами, ее первая часть. Так же как и HTML, HEAD служит только для формирования общей структуры документа. Этот элемент может иметь атрибуты lang и dir и допускается вложение элементов TITLE, ISINDEX, BASE, NAME, LINK, NEXTID.  
Элемент для размещения заголовка Web-страницы. Строка текста, расположенная внутри, отображается не в документе, а в заголовке окна браузера. Эта особенность часто используется для организации поиска в WWW. Поэтому авторы, создающие Web-страницы, должны позаботиться о том, чтобы строка внутри TITLE, не будучи слишком длинной, достаточно отображала назначение документа.  
Описание стиля некоторых элементов Web-страницы. В выше приведенном примере назначены шрифты для элементов Н2 и CODE. Естественно, что для каждого элемента существует стилевое оформление по умолчанию, поэтому употребление STYLE не обязательно.  
Этот элемент содержит служебную информацию, которая не отображается при просмотре Web-страницы. Внутри него нет текста в обычном понимании, поэтому нет и конечного тега. Каждый элемент NAME содержит два основных атрибута, первый из которых определяет тип данных, а второй - содержание. Далее приведены несколько примеров meta-данных.  
Дата, обозначающая «срок годности»документа:  
name=’’Expires’’ content=’’Дата’’  
Адрес электронной почты:  
name=’’Reply-to’’ content=’’Имя@Адрес’’  
Указание приложения, в котором был создан Web-документ:  
name=’’Generator’’ content=’’Название HTML-редактора’’  
Атрибут name используется приложением-клиентом для получения дополнительной информации о Web-страницах и их упорядочения. Этот атрибут часто заменяют атрибутом http-equiv. Он используется сервером для создания дополнительных полей при выполнении запроса.  
Кроме этого, элемент NAME может содержать URL. Шаблон соответствующего атрибута таков:  
URL=’’http://адрес’’  
Этот элемент заключает в себе гипертекст, который определяет собственно Web-страницу. Эта та часть документа, которую разрабатывает автор страницы и которая отображается браузером. Соответственно, конечный тег этого элемента надо искать в конце HTML-файла. Внутри BODY можно использовать все элементы, предназначенные для дизайна Web-страницы. Внутри стартового тега элемента BODY можно расположить ряд атрибутов, обеспечивающих установки для всей страницы целиком. Рассмотрим их по порядку.