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

Говоря о логической разметке текста, можно выделить две основные части:

Выделение заголовков в документе; логическое выделение элементов текста.

Название документа, задаваемое с помощью тега

Заголовок 1 уровня

Заголовок 2 уровня

Заголовок 3 уровня

Заголовок 4 уровня

Заголовок 5 уровня

Заголовок 6 уровня

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

Теги заголовков поддерживают атрибут ALIGN, действие которого аналогично действию такого же атрибута тега выделения абзаца.

Элементы логического выделения фрагментов текста, а также возможное оформление каждого из них приведены в таблице.

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

Для выделения длинных цитат из основного текста в HTML существует тег

. Этот элемент является контейнером и может содержать любые форматирующие теги.

Современные браузеры реагируют на элемент

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

позволяет авторам внести в текст некоторое визуальное разнообразие.

Разобравшись с сутью и предназначением логической разметки текста настало время познакомить Вас с тегами которые способны разбавить сухой текст неким смыслом.

Буду перечислять..

Тег

Выделяет в тексте аббревиатуру. Браузерами обычно подчеркивается пунктирной линией.

CSS

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

title="Cascading Style Sheets">CSS позволит Вам без труда изменить стиль любого тега логического форматирования текста!

Тег

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

Вступай в title="коммунистический союз молодёжи">комсомол !!

Так же как и с аббревиатурой для расшифровки текста желательно использовать атрибут title .

Вася Пупкин г. Урюпинск Макаронная фабрика 2010г.

Тег

Выделяет в тексте цитату или сноску на другой документ. Обычно браузеры отображают её курсивом.

Как сказал Остап Бендер

Тег

Отмечает текст как некий программный код. Обычно отображается моноширинным шрифтом.

function() - так обозначается функция в PHP

Тег

Выделяет удалённый текст в новой версии документа. Выделенный текст станет перечёркнутым.

Напоминает теги физического форматирования и сокращённый - перечёркнутый текст.

Использование тега , более предпочтительно, так как помимо того, что он разбавляет текст логикой еще и заменяет собой теги и , которые помечены спецификацией 4.01 как нежелательные.

Старая цена 1000р. - Новая 999 р.!!!

Тег

Выделяет текст как определение. Как правило, когда в тексте встречается новый термин, авторы выделяют его курсивом и дают его определение, собственно для этого и нужен тег

Акроним - аббревиатура, образованная из начальных букв, слов или словосочетаний, произносимая как единое слово, а не побуквенно.

Тег

Выделяет новый текст в новой версии документа. Выделенный текст в большинстве браузеров станет подчёркнутым.

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

Старая цена 1000р. - Новая 999 р. !!!

Тег

Выделяет особенно важный фрагмент текста. Обычно отображается курсивом.

Как создать сайт? - узнай на Вебремесло.ру!!

Тег

От английского keyboard - клавиатура. Указывает текст вводимый с клавиатуры, или для названия клавиш. Обычно отображается моноширинным шрифтом.

Нажмите Ctrl + Z для того чтобы отменить последнее действие.

Тег

Выделяет в тексте цитату. В отличие от тега цитата обозначенная тегом автоматически берётся браузерами в кавычки.

Как сказал Остап Бендер Лед тронулся! господа присяжные заседатели!

Кстати, есть еще и тег физического форматирования текста

данный тег тоже помечает текст как цитату и при этом выделяет его отступами и переносами строк от остального текста.

логического форматирования текста : - браузеры автоматически берут такую цитату в кавычки. Кстати выходя за рамки темы, видом кавычек легко управлять с помощью CSS псевдокласса lang и его значения quotes - кавычки.

Эта цитата создана с помощью тега логического форматирования текста : Лед тронулся! господа присяжные заседатели.. Остап Бендер. 12 стульев. - обычно браузерами она отображается курсивом. Второе призвание такого вида цитаты это выполнение роли сноски на другой документ.

А эта цитата создана с помощью тега физического форматирования текста

:

Лед тронулся! господа присяжные заседатели..

- в основном тексте она выделяется отступами и переносами строк, как правило, такой цитатой помечают длинные куски текста взятые из других источников.

Такие вот различия..

Тег

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

В процессе решения задачи 2+2 программа выдаст ответ: 4

Тег

Выделяет особенно важный фрагмент текста. Обычно отображается полужирным.

Как создать сайт? - узнай на Вебремесло.ру!!

Тег

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

Данная функция использует переменную $count

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

Полезные советы:

· Стиль всех тегов как логического, так и физического форматирования текста, великолепно настраивается с помощью средств CSS! Мой Вам совет учите CSS: (http://www.webremeslo.ru/css/glava0.html) , если до этого момента ещё незнакомы с ним. При использовании свойств CSS в работе с текстом Вы забудете про проблему кроссбраузерности т. е. Ваш текст будет отображаться во всех браузерах именно так как нужно Вам, а не так как вздумается браузеру. Кроме того СSS открывает куда более широкие возможности связанные как со стилем текста, так и с дизайном сайта в целом.

· Старайтесь правильно размечать текст на страницах Вашего сайта.. а именно:

Для начала, разбейте весь Ваш текст на параграфы с помощью тега

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

Соблюдайте значимость заголовков

-

т. е. допустим заголовок страницы берите в тег

подзаголовки в тег

еще менее значимые подзаголовочки в тег

и т. д. В идеале на странице должен быть всего один заголовок

, потом текст разбивается несколькими

и далее по значимости заголовков.

Используйте теги логической разметки лишь там где они действительно необходимы т. е. не стоет например выделять аббревиатуру с помощью цитаты и наоборот.. на то она и логика что бы всё было логично!!

Используйте и в тех случаях, если Вы хотите акцентировать внимание на тексте не только людей, но поисковых систем, в иных ситуациях используйте и .

· Когда выучите CSS забудьте и выкиньте из головы тег и все его атрибуты!! Им уже давно никто не пользуется, ну за редким исключением конечно..

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

К элементам и приемам, нарушающим этот принцип, относятся:

• использование тегов физического, или визуального, форматирования текста (начиная с привычного и заканчивая динозаврами наподобие ); а также указание дополнительных параметров визуального форматирования в валидных тегах (таких, как BGCOLOR в теге ),
• искажение смысла тегов (например, использование
  и вместо

  и ),

  использование невидимых таблиц с целью создания «каркаса» страницы и позиционирования блоков.

  Очевидно, принцип логического форматирования не подразумевает подобных отступлений от «буквы закона». И, конечно, эти отступления нашли широкое применение.

  Логическое форматирование

  На сегодняший день предложены методы форматирования HTML-документов, альтернативные визуальному. А именно:

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

  Зачем?

  Возникает закономерный вопрос: зачем ради «чистоты языка» менять привычные способы верстки и усложнять себе работу? На самом деле работать с «чистым» унифицированным кодом становится проще и удобнее. Кроме того, концепция CSS предоставляет веб-строителю дополнительные степени свободы за счет создания единого центра управления стилями.

  Реальность и частности

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

  Подведем итоги

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

  Литература

  1. Бандурина Л. Каскадные таблицы стилей, или CSS для начинающих. Мир Internet. 2000; 10: 66-70.
  2. Бандурина Л. Каскадные таблицы стилей, или CSS для начинающих. Мир Internet. 2000; 11: 70-73.
  3. Матросов А.В., Сергеев А.О., Чаунин М.П. HTML 4.0. — СПб.: БХВ-Петербург, 2000.

  Таблицы достаточно широко применяются в электронной документации, причем для Web-страниц они используются не только в традиционном смысле, как метод упорядоченного представления данных, но и для форматирования самих этих страниц. Описание таблицы на языке HTML размещается внутри тела документа, т. е. в контейнере и . Внутри документа допускается любое число таблиц, причем некоторые из них могут быть вложенными. Каждая таблица создается в пределах контейнера <ТАВLЕ> и , где размещается описание структуры самой таблицы и ее содержимое.

  Каждая строка таблицы размещается после тега (Table Row). Каждая ячейка таблицы в пределах строки оформляется тегом <ТН> (Table Header) - для заголовочной части таблицы или (Table Data) - для ячеек, в которых размещаются данные. В заголовочной части по умолчанию применяется полужирный шрифт и выравнивание по центру. Для отображения данных по умолчанию используется нормальное (светлое) начертание и выравнивание влево. Можно отметить, что для всех тегов, перечисленных в этом абзаце, закрывающий тег не обязателен, т. е. он может быть опущен.

  Количество строк в таблице определяется количеством строчных тегов , а число столбцов - максимальным количество тегов <ТН> или в одной из строк. Строкой считается все то, что следует после очередного тега и до следующего такого тега. Для ячейки таблицы, не содержащей данных, надо использовать пустой контейнер и . Если пустые ячейки расположены в конце строки, то их описание может быть опущено - браузер самостоятельно оставит необходимое число ячеек пустыми.

  Таблица может иметь название - то, что в редакционной практике называется тематическим заголовком (в отличие от нумерационного), причем если в печатном издании заголовок обязательно расположен над таблицей, то в электронном он может быть расположен как сверху, так и снизу. Заголовок расположен внутри контейнера и . Указанный контейнер должен быть помещен внутрь тега-контейнера <ТАВLЕ>, но вне области описания тегов , или

  В теге первоначально был предусмотрен один необязательный параметр ALIGN, который предназначался для вертикального выравнивания и мог принимать одно из двух значений ТОР (по умолчанию) или BOTTOM. Затем выяснилась необходимость и горизонтального выравнивания стремя стандартными параметрами LEFT, RIGHT и CENTER. Однако нельзя в одном теге дважды использовать один и тот же параметр. Поэтому в современных версиях языка HTML параметр ALIGN (по умолчанию ALIGN=LEFT) оставлен для выравнивания по горизонтали, а вертикальное выравнивание (точнее - размещение заголовка над или под таблицей) осуществляется с помощью параметра VALIGN.

  В теге

  могут использоваться следующие параметры: BORDER, CELLSPACING, CELLPADDING, WIDTH, ALIGN, HEIGHT и BACKGROUND. Параметр BORDER управляет отображением рамки вокруг каждой ячейки таблицы (т. е. задает вертикальные и горизонтальные линии сетки) и вокруг всей таблицы, причем его значение задаеттолщину рамки в пикселах вокруг всей таблицы, а само наличие этого параметра задает линии сетки. Значение параметра BORDER появилось лишь в версии 3.2 спецификации HTML, до это го тол щи на рамки вокруг таблицы не регулировалась.

  Параметр CELLSPACING задает расстояние между смежными по горизонтали и вертикали ячейками, причем это расстояние задается в пикселах, т. е. внутри каждой ячейки создается нечто вроде рамки и лишь при CELLSPACING=0 эти рамки отдельных ячеек сливаются в единую сетку. Параметр CELLPADDING определяет расстояние между рамкой вокруг ячейки и данными внутри ее, т. е. величину отступа символов от рамки. При значении CELLPADDING=0 текст может касаться рамки, что в плане дизайна едва ли можно приветствовать. По умолчанию значение CELLSPACING=2, a CELLPADDING=1, в этом случае расстояние между данными в соседних ячейках будет равно б пикселам.

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

  Надо отметить, что и при задании значений параметров WIDTH и HEIGHT нет гарантии в том, что они будут выдержаны браузером. Если ширина таблицы больше ширины окна просмотра, браузер сделает попытку уменьшить ширину до требуемой, пропорционально уменьшая размеры колонок, и только если это не удастся, установит заданную ширину таблицы, снабдив окно слайдером.

  Параметр ALIGN задает горизонтальное выравнивание таблицы в окне просмотра браузера. Возможны два значения этого параметра: LEFT и RIGHT, каждый из которых обеспечивает обтекание таблицы текстом документа с противоположной стороны. Это соответствует оборочной таблице в печатном издании. По умолчанию параметр ALIGN принимает значение LEFT. Если параметр ALIGN опущен, то текста рядом с таблицей не будет вообще, т. е. таблица будет форматной или полосной (когда она занимает всю страницу по вертикали), если использовать термины, принятые в печатных изданиях. Значение параметра ALIGN=CENTER не предусмотрено. Однако если мы хотим ориентировать таблицу по центру, можно пойти другим путем: заключить контейнер

  n, который описывает всю таблицу целиком, в контейнер и . Напомним, что последний имеет уровень блока, т. е. форматирует любое количество данных, размещенных внутри его (см. § 2.2).

  Отметим, что параметр ALIGN может использоваться и для форматирования данных внутри каждой ячейки таблицы, например:

  Пример отображения браузером документа, включающего в себя приведенный выше фрагмент, показан на рис. 2.8. На рисунке хорошо видна рамка вокругтаблицы и то, что таблица выровнена влево, а справа обтекается текстом. В качестве текста использован фрагмент второго абзаца, начинающегося на данной странице. Следует обратить внимание на то, что хотя вся таблица выровнена влево, данные в каждой строке выравниваются вправо. Формально можно было бы в каждой ячейке выравнивать текст по-своему. Однако визуально это выглядело бы очень неприглядно.

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

  Параметр BACKGROUND, который уже был показан в примере, приведенном выше, также может использоваться как в теге <ТАВLЕ>, так и в тегах <ТН> и

  Фамилия	Оценка
  Иванов A.H.
  Сергеев И.Д.	5
  Лавров В.В.	3	, определяющих характеристики отдельных ячеек таблицы. Во всех случаях он определяет фоновый рисунок с помощью параметра HREF. В последней версии спецификации HTML в теге <ТАВLЕ> появился параметр COLS, задающий общее число колонок в таблице. Эта дополнительная информация ускоряет процесс построения таблицы браузером. При создании заголовочной части таблицы, реже боковика и прографки (основной части таблицы, где размещаются данные), возникает потребность в объединении нескольких ячеек по горизонтали (в строке) или по вертикали в единое целое. Для этого используются параметры ROWSPAN и COLSPAN, первый из которых объединяет несколько строк, а второй - столбцов в одну ячейку. Пример описания такой таблицы приводится ниже. Объединение ячеек в заголовочной части 3aголовок Заголовок 2 Заголовок 2-1<ТН>Заголовок 2-2 1 2 3 Показанный ниже рис. 2.9построен на основании HTML-документа, в теле которого содержится приведенный выше контейнер и со всем его содержимым. По сравнению с таблицей, показанной на рис. 2.8, здесь с помощью тега добавлен тематический заголовок, выровненный по центру таблицы. В таблице хорошо видны рамки ячеек и рамка вокруг таблицы в целом. В ячейке «Заголовок 1» объединены две строки, а в ячейке «Заголовок 2» - два столбца, что соответствует исходному HTML-коду. В третьей строке, как это часто делают для длинных узких таблиц, указаны номера колонок, что позволяет при переносе на следующую полосу не повторять заголовка целиком. Отметим, что используя параметры ROWSPAN и COLSPAN можно составить многоуровневые заголовки таблиц любой степени сложности Логическое форматирование и четкое структурирование являются признаками хорошо составленного документа. Они обеспечивают большую гибкость в его использовании. Существует целая группа форматирующих элементов, согласно своему назначению названных логическими. Ниже перечислены элементы логического форматирования. - используется для выделения цитат или названий книг и статей, при этом текст обычно выводится курсивом. - Применяется для вывода небольшого куска программного кода шрифтом фиксированной ширины. - используется для выделения важных фрагментов текста. Браузеры обычно отображают такой текст курсивом. - элемент, выделяющий шрифтом фиксированной ширины текст, вводимый пользователем с клавиатуры. - используется для выделения нескольких символов шрифтом фиксированной ширины. - обычно используется для выделения важных фрагментов текста. Браузеры отображают такой текст полужирным шрифтом. - используется для отметки имен переменных, обычно такой текст отображается курсивом. Все перечисленные тэги являются контейнерами, то есть требуют закрывающего тэга. Можно заметить, что некоторые контейнеры дают одинаковый результат. Возникает законный вопрос: зачем это сделано ? Ответ - в названии этой группы элементов. Они предназначены для расстановки логических ударений, выделения логических частей и подчеркивания сути высказываний. Их использование весьма актуально, поскольку, вероятно, в ближайшем будущем станет возможен, например, поиск цитат в Web - пространстве. Иногда возникает необходимость включения в документ какой-либо цитаты. Для ее выделения из основного текста существует тэг . Этот элемент является контейнером и может содержать любые форматирующие тэги. Современные браузеры реагируют на элемент смещением текста цитаты вправо. Последней инстанцией определения внешнего вида документа, как уже отмечалось, является программа просмотра читателя. Создатель документа имеет ограниченные возможности повлиять на этот процесс с помощью элементов физического форматирования, список которых приведен ниже. - выделяет текст полужирным шрифтом. - выделяет текст курсивом. - выводит текст шрифтом фиксированной ширины. - элемент подчеркивания. - элемент зачеркивания. - выводит текст шрифтом большего размера. - выводит текст шрифтом меньшего размера. - сдвигает текст ниже уровня строки и выводит (если возможно) шрифтом меньшего размера. - сдвигает текст выше уровня строки и выводит (если возможно) шрифтом меньшего размера. Все элементы физического форматирования являются контейнерами. Элементы физического форматирования могут быть вложенными друг в друга. При этом нужно внимательно следить, чтобы один контейнер находился целиком в другом контейнере. Одной из важных особенностей, воплощенных в HTML, начиная с версии 3.2, является полный контроль облика создаваемого документа. Такая возможность отсутствовала в предыдущих версиях языка. Можно сказать, что единственной существенной проблемой осталось отсутствие на машине пользователя каких-либо шрифтов, которые используются в документе. FONT впервые появился в HTML версии 3.2 и представляет собой контейнер. После стартового тэга обязательно указание атрибутов, без которых элемент не имеет никакого влияния на текст, помещенный в контейнер. Элемент FONT может находиться внутри любого другого текстового контейнера. служит для указания размеров, типа и цвета шрифта, стандартных для данного документа. Эти величины обязательны для всего документа, если только не переназначаются при помощи элемента FONT . После закрытия элемента FONT значения тэга восстанавливаются. Значения атрибутов BASEFONT могут быть изменены другим тэгом в любом месте документа. Тэг не является контейнером и использует те же атрибуты, что и элемент . Возможно вас заинтересует Windows 8 Обзор: creative aurvana in-ear3 plus — великолепные арматурные наушники с двойными излучателями Впечатления от прослушивания Windows 7, XP Легкая запись образа на флешку Гаджеты Orange Pi Lite - обзор, установка и настройка операционной системы Распаковываем Orange Pi One Телевизоры Прошивка или перепрошивка телефона Prestigio MultiPhone