Какое расширение должны иметь html документы

What’s on this Page

Что такое HTML-файл?

HTML (Hyper Text Markup Language) — это расширение для веб-страниц, созданных для отображения в браузерах. HTML, известный как язык Интернета, развивался с учетом новых требований к информации, которая должна отображаться как часть веб-страниц. Последний вариант известен как HTML 5, что дает большую гибкость для работы с языком. HTML-страницы либо принимаются с сервера, на котором они размещены, либо также могут быть загружены из локальной системы. Каждая HTML-страница состоит из HTML-элементов, таких как формы, текст, изображения, анимация, ссылки и т. д. Эти элементы представлены тегами и несколькими другими, где каждый тег имеет начало и конец. Он также может встраивать приложения, написанные на языках сценариев, таких как JavaScript и таблицы стилей (CSS), для общего представления макета.

Краткая история

С момента своего создания и первой роли спецификации HTML поддерживаются Консорциумом World Wide Web (W3C) с 1996 года. В 2000 году он также стал международным стандартом (ISO/IEC 15445:2000). В 1999 году был опубликован HTML 4.01. В 2004 году Рабочая группа по технологиям веб-гипертекстовых приложений (WHATWG) начала работу над версией HTML5, которая стала совместным результатом с W3C в 2008 году. Она была завершена и стандартизирована 28 октября 2014 года.

Структура формата файла HTML

Документ HTML 4 состоит из трех частей:

1. строка, содержащая информацию о версии HTML
2. раздел декларативного заголовка
3. тело, содержащее фактическое содержание документа. Тело может быть реализовано элементом BODY или элементом FRAMESET, чтобы содержать тело в кадрах.

Каждый раздел может начинаться или сопровождаться пробелами, новыми строками, вкладками и комментариями. Пример простого HTML-документа показан ниже:

     Hello World!  

Информация о версии

Первая строка кода, , называется объявлением типа документа и сообщает браузеру, в какой версии HTML написана страница. В зависимости от версии HTML существует несколько различных объявлений типа документа, которые называют определение типа документа (DTD), используемое для документа. Каждое DTD отличается от других элементами, которые оно поддерживает, и отличается следующим образом:

• HTML 4.01 Strict — включает все элементы и атрибуты, которые не были устарели или не отображаются в документах с набором фреймов.
• HTML 4.01 Transitional — включает все в строгом DTD, а также устаревшие элементы и атрибуты (большинство из которых касается визуального представления
• HTML 4.01 Frameset — включает все элементы переходного DTD, а также фреймы.

Для HTML5 информация о версии выглядит так, как указано ниже.

Информация заголовка HTML

Заголовок документа HTML может включать ряд элементов HTML, которые не отображаются браузером. Такие элементы являются либо метаданными, описывающими информацию о странице, либо включают разделы, которые используются для получения информации из внешних ресурсов, таких как таблицы стилей CSS или файлы JavaScript. Заголовок страницы представлен тегом head.

Для установки заголовка страницы элемент title является единственным, который требуется в теги. То же самое используется поисковыми системами для определения заголовка страницы.

Информация о теле HTML

Это основной раздел файла, содержащий все содержимое файла, отображаемое браузерами. Тело HTML может содержать разметку, которая может ссылаться на различные стандартные блоки в виде тегов. Он может содержать несколько различных типов информации, таких как текст, изображения, цвета, графика и т. д. Кроме того, аудио- и видеоэлементы также могут быть встроены в тело html для отображения браузерами. При наличии современных таблиц стилей для визуального представления атрибуты представления BODY, такие как цвет фона, цвет ссылки, цвет текста и т. д., устарели. Таким образом, те же эффекты могут быть достигнуты с помощью таблиц стилей, как показано ниже:

    BODY < background: white; color: black>A:link < color: red >A:visited < color: maroon >A:active . document body.  

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

     . document body.  

HTML-элементы

Как упоминалось ранее, содержимое внутри тела HTML представлено тегами, также известными как элементы HTML. Каждый тег может иметь дополнительную информацию в виде атрибутов, которые записываются как , хотя нет необходимости иметь атрибуты для каждого тега. Если атрибуты не указаны, в каждом случае используются значения по умолчанию. Ниже приведены некоторые примеры элементов:

Заголовок

Заголовки

Heading level 1
 
Heading level 2
 
Heading level 3
 
Heading level 4
 
Heading level 5
 
Heading level 6
 

Пункты

Paragraph 1





 
Paragraph 2
 

Использованная литература

See Also

• AN — файл проекта Adobe Edge Animate
• APKG — формат файла колоды флеш-карт Anki
• ASAX — файл серверного приложения ASP.NET
• ASMX — файл веб-службы ASP.NET
• ASP — формат файла страниц активного сервера

Какое расширение должны иметь html документы

Главное меню

Соглашение

Регистрация

Английский язык

Астрономия

Белорусский язык

Информатика

Итальянский язык

Краеведение

Литература

Математика

Немецкий язык

Обществознание

Окружающий мир

Русский язык

Технология

Физкультура

Для учителей

Дошкольникам

VIP — доступ

Автор: Акьюлов Тимур Робертович | ID: 6657 | Дата: 19.12.2015

Помещать страницу в закладки могут только зарегистрированные пользователи
Зарегистрироваться

Получение сертификата
о прохождении теста

5. Введение в сценарии

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

5.1. Сценарии выполняемые сервером

Для того чтобы понять, что такое серверные сценарии расмотрим (достаточно упрощенно) схему взаимодействия Web-клиент/Web-сервер. При вводе пользователем, в адресной строке броузера, URL необходимого ресурса или активизации гиперссылки, Web-броузер посылает http-запрос серверу:

[Метод запроса] [URL ресурса] [Заголовок]

Например для получения документа — doc1.htm запрос выглядит примерно так:

GET /doc1.htm HTTP/1.0

Результатом обработки запроса Web-сервером является http-ответ:

[Заголовок] [Код возврата] [MIME-заголовок] [Пустая строка-разделитель] [Тело ответа]

Например если наш предыдущий запрос Web-серверу прошел успешно, ответ будет примерно таким:

HTTP/1.0 200 ОК
Content-Type: text/html

В результате данного взаимодействия мы получим от Web-сервера и увидим в окне Web-броузера содержимое HTML-документа — doc1.htm . Такое взаимодействие позволяет получать и просматривать любые статические ресурсы сервера, но как быть когда мы хотим большего. Например мы хотим обрабатывать данные, введенные пользователем в формы на нашей Web-странице, или наоборот отправить пользователю результаты работы прикладной программы в формате HTML. Все эти задачи решаются при помощи сценариев выполняющихся на сервере.

Итак сценарий выполняющийся на сервере это программа написанная на одном из языков программирования, которые поддерживются платформой Web-сервера. Какие они бывают, на чем и для чего пишутся ?

По большому счету сценарии можно разделить на две больших группы: сценарии внедряемые в HTML-документы и CGI-сценарии.

Внедряемые сценарии

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

Технология внедрения сценария в документ и язык разработки зависят от типа платформы Web-сервера и его настройки.

Для платформы NT/IIS существует реализация данной технологии под названием ASP (Active Server Pages — Активные страницы сервера). Документы-активные страницы должны иметь расширение ASP, сценарии пишутся на VBscript или Jscript, а их внедрение осуществляется при помощи директивы .

Для платформы UNIX/Apache выбор средств гораздо больше, один из вариантов реализации данной технологии это внедрение сценариев на языке PHP. Данные документы должны иметь расширение PHP, а внедрение сценария в документ осуществляется при помощи директивы .

HTML-документ содержащий, внедряемый сценарий сервера, выглядит примерно так (так он выглядит на Web-сервере, а в окне своего броузера вместо кода сценария вы увидите результаты его работы) :

Добрый день !

Вы являетесь
$counter=0; $filename = «count.dat»; $fp = @fopen($filename,»r»); if ($fp) < $counter=fgets($fp,10); fclose($fp); >$counter++; print $counter; $fp = fopen($filename,»w»); if ($fp)
?> посетителем моего сайта .

. данные страницы .

CGI-сценарии

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

В общих чертах алгоритм разработки CGI-сценария выглядит следующим образом:

А переменная среды QUERY_STRING = поле1=знач1&. &полеN=значN

Для метода POST данные передаются в STDIN сценария как тело http-запроса, в переменную среды сервера CONTENT_LENGTH записывается количество символов входного потока, а в переменную CONTENT_TYPE записывается MIME-тип передаваемых данных.
Для получения данных необходимо считать CONTENT_LENGTH символов из STDIN сценария. Например при отправке данных из формы HTML-документа, на обработку сценарию-prg, http-запрос будет выглядеть так:

POST http://www.site.ru/cgi-bin/prg HTTP/1.0
Content-Type: application/x-www-form-urlencoded

Реализации вышеуказанного алгоритма для различных платформ Web-серверов могут существенно отличаться, но приведенные этапы создания сценария достаточно общие.

Вот пожалуй и все о сценариях сервера. Как я уже говорил, изложенный в этой главе материал, носит ознакомительный характер. Я не являюсь экспертом в области разработки приложений Web-сервера (моя основная работа с этим не связана). Информация данного раздела пригодится вам для понимания общих принципов разработки приложений Web-клиент/Web-сервер.

Для углубленного изучения материала вам придется прикупить литературы по конфигурированию ПО Web-серверов, программированию и сетевым протоколам. Много полезного можно найти в Internet (благо ключевых слов, вы теперь знаете много: CGI, ASP, PHP. ).

Рекомендую вам посетить сайты, материалы которых я использовал для подготовки данной главы:

&nbsp

&nbsp

Ваши вопросы и замечания прошу направлять dmitriy_v_k@hotmail.com
&copy 2001 Дмитрий Красюк
Дата последней модификации: Вторник Май 15, 2001.

Лекция 1.3 Основы языка HTML

HTML-документы представляют собой файлы с текстом и дополнительными инструкциями языка HTML, называемыми тегами. Теги позволяют задавать форматирование текста, а также размещать в документе мультимедийные файлы (изображения, звук, Flash-анимацию), гипертекстовые ссылки на дру-гие документы, табличные данные, формы ввода данных. HTML-документы имеют расширение имени файла htm или html. Редактирование HTML кода производят в текстовом редакторе (например, в обычном блокноте), а про-смотр – в браузере.

Тег состоит из имени тега, за которым может следовать список атрибутов, помещаемых между открывающей и закрывающей угловыми скобками (< и >). Атрибуты позволяют управлять поведением тега. Они могут иметь конкретные значения, задаваемые после знака равенства. Значения атрибутов заключаются в одиночные или двойные кавычки («). Атрибуты отделяются друг от друга пробелом, порядок следования атрибутов значения не имеет. Имена тэгов и атрибутов нечувствительны к регистру.

Тег FONT предназначен для управления внешним видом текста. В примере он задает начертание текста шрифтом Arial, красным цветом.

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

Для выделения текста жирным используется тег . Пример:

HTML-код: текст жирный текст текст

В браузере: текст жирный текст текст

Примером непарного тега является тег
– перевод строки. Обычный пе-ревод строки клавишей браузер игнорирует (как и несколько постав-ленных подряд пробелов или знаков табуляции).

первая строкавторая строка

первая строка
вторая строка

Парный тег обязательно должен иметь закрывающий! Например, если не за-крыть тег , весь текст на странице за ним станет жирным.

При вложении тегов друг в друга закрывать теги нужно начиная с самого последнего, в обратном порядке.

Тег используется для выделения текста курсивом.

Неправильно: HTML-код: жирный курсив

Правильно: HTML-код: жирный курсив

в браузере: жирный курсив

Структура документа HTML

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

Пример: простейший HTML-документ

Цвет в HTML может быть задан ключевыми словами – названиями цветов на

Стандартные цвета HTML

Основные теги, работа с текстом, списки

Теги структуры документа

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

Работа со списками

• HTML есть возможность создавать нумерованные и маркированные спи-ски.

start=»N» – начать нумерацию с числа N type=»…» -определяет формат нумерации

1 – арабские цифры (по умолчанию)

A – прописные буквы (A, B, C)

• – строчные буквы (a, b, c)

I – прописные римские цифры (I, II, III)

i – строчные римские цифры (i, ii, iii)

type=»…» – определяет формат маркера disk – диск (по умолчанию)

и
) value=»N» – задает номер элемента списка

Для создания ссылок используется тег … .

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

Абсолютный адрес содержит в себе имя хоста и полный путь к ресурсу, на-пример: http://www.example.com/docs/about.html. С помощью абсолютного адреса можно ссылаться на любой открытый ресурс в Интернете. Если нужно поставить ссылку на главную страницу сайта, указывают его адрес и слеш.

Пример для абсолютного адреса:

Например, чтобы поставить ссылку из файла file1.html на файл file2.html (см. рис. 2.3.), необходим следующий HTML-код:

Две точки (..) означают переход к родительскому каталогу.

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

Для открытия ссылки в новом окне используется атрибут target со значе-нием _blank.

Цвет ссылок в документе можно указать атрибутами тега : alink=»цвет» – устанавливает цвет активных ссылок link=»цвет» – задает цвет непосещенных ссылок vlink=»цвет» – определяет цвет посещенных ссылок

Вставка изображений на странице

Осуществляется непарным тегом . Обязательный атрибут src указыва-ет абсолютный или относительный URL изображения (см. Лк 2.3.). Стан-дартными форматами изображений являются GIF, PNG и JPEG.

GIF – формат, реализующий сжатие без потери качества с ограниченной цветностью (от 2 до 256 цветов) и поддержкой анимации – используется для хранения графики, когда достаточно 256 (и меньше) цветов. Обычно это не-большие изображения. Также GIF поддерживает прозрачность.

JPEG реализует сжатие изображений с потерями качества, при этом ограни-чения на цвет отсутствуют (поддерживается 16 миллионов цветов). Размер JPEG-файла зависит от параметра «качество», который указывается при его сохранении: от 0 до 100. Чем выше качество, тем больше размер файла. Оп-тимальная степень качества зависит от изображения, в большинстве случаев она равна 70-80. Не стоит выставлять этот параметр меньше 50 – на изобра-жении появятся заметные дефекты или больше 95 – размер файла сильно возрастет без видимого улучшения качества.

Формат PNG существует в двух вариантах: PNG-8 и PNG-24. PNG-8, как и GIF, поддерживает 256 цветов, обеспечивает по сравнению с ним лучшее сжатие, но не поддерживает анимацию. Формат PNG-24, как и JPEG, не име-ет ограничений на количество цветов, но проигрывает ему в размере файла. Осуществляет сжатие изображений без потери качества, поэтому его стоит применять для изображений, содержащих мелкие детали.

align=»…» – определяет режим выравнивания изображения относительно текста в строке:

top – по верхнему краю

middle – по центру строки

bottom – по нижнему краю (по умолчанию)

left – по левому краю окна

right – по правому краю окна

alt=»…» – определяет текст, описывающий изображение для браузеров без поддержки графики (или с отключенной графикой), поисковых машин и т.п. border=»N» – устанавливает толщину рамки вокруг изображений, равной N пикселей, 0 – для отключения рамки

height=»N» – высота изображения в пикселях или процентах width=»N» – ширина изображения в пикселях или процентах

Браузер определяет размер изображения автоматически. Для ускорения за-грузки рекомендуется указывать размер изображения атрибутами height и width, чтобы браузер не вычислял этот размер автоматически после загрузки изображения. Также этими атрибутами можно растянуть/сжать изображение

Фоновое изображение страницы

Можно задавать адрес фонового изображения для страницы в атрибуте background тега . Фоновое изображение отображается в натураль-ную величину. Если размер изображения меньше размера окна браузера, то рисунок повторяется по горизонтали вправо и по вертикали вниз. Например, зададим фоновым изображением страницы рисунок bg1.jpg.