address в HTML


Содержание

Тег ADDRESS

Браузер Internet Explorer Netтscape Опера Safari Mozilla Firefox
Версия 5.5 6.0 7.0 8.0 8.0 9.0 7.0 8.0 9.2 9.5 1.3 2.0 3.1 1.5 2.0 3.0
Поддерживается Да Да Да Да Да Да Да Да Да Да Да Да Да Да Да Да
ШТМЛ: 3.2 4 XШТМЛ: 1.0 1.1

Описание

Синтаксис

Закрывающий тег

Параметры

Пример 1. Использование тега

ШТМЛ 4.01 IE 5.5 IE 6 IE 7 Op 9.5 Sa 3.1 Ff 2.0 Ff 3.0

Результат примера показан на рис. 1.

Рис. 1. Вид контента, добавленного в контейнер

Адреса в HTML

Абсолютный и относительный пути

Адреса в HTML могут указывать путь: на сайт, страницу сайта или файл расположенный на сайте. Обычно адрес HTML выступает в качестве значений у атрибутов, тега a (ссылки) или img (изображения):

Где в качестве имяСайта , выступает название сайта, например gabdrahimov.ru

Адреса в языке HTML бывают трёх видов:
1. Адрес сайта,
2. Абсолютный адрес (абсолютный путь к странице или файлу),
3. Относительный адрес (относительный путь к странице или файлу).

Адрес сайта

Адрес сайта в HTML это просто имя сайта c приставкой http:// , например:
http://ya.ru — Яндекс
http://google.ru — Гугл
http://vk.com — Вконтакте и т.д.

Абсолютный адрес

Абсолютный адрес — это абсолютный путь к странице или файлу. Абсолютный адрес начинается с адреса сайта, на котором находится страница или файл.

Примеры абсолютных адресов (абсолютных путей):

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


Относительный адрес

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

Допустим в папке product находится страница list.html , её абсолютный адрес выглядит следующим образом:
http://имяСайта/product/list.html — страница list.html расположена в папке product

Есть еще одна страница, чей абсолютный адрес выглядит следующим образом:
http://имяСайта/about.html — страница about.html находится в корне (на одном уровне с главным файлом index.html) сайта.

На странице list.html нужно поставить ссылку, которая будет ссылаться на страницу about.html находящуюся на том же сайте. Сослаться на неё можно двумя способами:
1. http://имяСайта/about.html «> — используя абсолютный путь,
2. ../about.html «> — используя относительный путь.

Символ ../ означает, что нужно подняться на одну папку вверх (на один уровень),
Символ ../../ означает, что нужно подняться на две папки вверх (на два уровня).

Если страница list.html тоже будет находится в корне сайта:
http://имяСайта/list.html , то для того чтобы сослаться на страницу about.html , нужно будет в HTML-документе list.html прописать следующий код:
about.html «> — относительный путь.

Далее, если страница list.html будет находится в папке soft :
http://имСайта/product/soft/list.html , то для того чтобы сослаться на страницу about.html , нужно будет в HTML-документ файла list.html прописать следующий код:
../../about.html «> — т.е. два раза подняться вверх по папкам.

Чтобы сослаться на страницу online.html , которая находится по адресу:
http://имяСайта/service/online.html , нужно в HTML-документе файла list.html , который находится по адресу:
http://имяСайта/product/soft/list.html , прописать следующий код:
../../service/online.html «> — два раза подняться вверх по папкам, затем «зайти» в папку service и написать имя файла online.html

Точкой отсчета относительного адреса является то место, где находится ссылающаяся страница.

Также, в качестве точки отсчета относительного адреса может выступать корень сайта / , пример:
/about.html «>
/service/online.html «>

Разница между абсолютным и относительным путями

Рассмотрим различия между абсолютным и относительным путями:

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

HTML тег address

Тег определяет информацию об авторе документа или статьи.

Если тег расположен внутри тега , то он представляет информацию об авторе документа. Если тег расположен внутри тега , то он представляет информацию об авторе статьи.

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

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

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


в HTML

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

Атрибуты

Личные атрибуты: нет.

  • accesskey — устанавливает клавишу быстрого доступа для фокусировки на HTML-элементе.
  • class — задает имя класса или классов тега, используемых в CSS (Каскадные таблицы стилей).
  • dir — указывает направление текста внутри элемента.
  • id — задает имя идентификатора тега, который может использоваться в качестве «якоря» или в таблицах стилей.
  • lang — указывает язык, на котором написан текст внутри элемента.
  • style — необходим для применения встроенных стилей CSS к тегу.
  • tabindex — устанавливает порядок табуляции между элементами (клавиша Tab ).
  • title — выводит всплывающую подсказку при наведении курсора мыши на элемент.

Тип тега

Модель тега: block (блочный, уровня блока).

Может содержать: inline-теги, обычный текст и спецсимволы HTML (мнемоники).

Открывающий тег: необходим. Закрывающий тег: необходим.

Синтаксис

Пример HTML: применение тега ADDRESS

Результат. Применение тега ADDRESS.

Учебник HTML5

» Всё о HTML5 на русском

Использование тега address

Этот элемент был введен еще в спецификации HTML3 в 1995 году и дожил до сегодняшних дней в спецификации HTML5. Но на протяжении всех пятнадцати лет разработчики спорили как правильно использовать этот элемент. Давайте вместе разберемся с этим!

Давайте обратимся к спецификации, где говорится примерно следующее:

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

Из всего вышесказанного можно построить небольшой пример:


p > Над сайтом работали следующие люди: p >
address >
a href =»http://alexandersavelev.com/» > Александр Савельев a > ,
a href =»http://example.com/» > Вася Пупкин a > ,
a href =»http://хтмл5.рф/» > Василий Тёркин a > ,
address >

Теперь давайте разберемся как не следует использовать элемент address? На следующем примере показано неправильное использование этого тега:

address >
Вася Пупкин br >
Чичканова, br >
Тамбов, br >
Россия br >
Tel: +7 (920)XXX XX XX
address >

Никак не можете понять, что тут неправильно? Все очень просто! В спецификации сказано, что элемент address нельзя использовать для выделения почтовых адресов, кроме тех, что явно связаны с данным документом.

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

div class =»vcard» >
p class =»fn» > a class =»url» href =»#» > Вася Пупкин a > p >
p class =»adr» >
span class =»street-address» > Чичканова 35 span > br >
span class =»region» > Тамбов span > br >
span class =»postal-code» > 392008 span > br >
span class =»country-name» > Россия span >
p >
p class =»tel» > +7 (920)XXX XX XX p >
div >

Тег address

Тег address (с англ. адрес) — тег-контейнер содержит информацию об авторе.
Блочный элемент.

HTML: 3.2 | 4 / XHTML: 1.0 | 1.1

Синтаксис

Атрибуты

class определяет имя используемого класса
dir определяет направление символов:
  • ltr — слева направо
  • rtl — справа налево
id уникальный идентификатор
lang определяет язык отображаемого документа
onclick щелчок на элементе
ondblclick двойной щелчок на элементе
onkeydown нажатие клавиши, когда элемент имеет фокус
onkeypress нажатие и освобождении клавиши, когда элемент имеет фокус
onkeyup освобождение ранее нажатой клавиши, когда элемент имеет фокус
onmousedown нажатие кнопки мыши, когда элемент имеет фокус
onmousemove движение указателя мыши, когда элемент имеет фокус
onmouseout смещение указателя мыши с элемента
onmouseover помещение указателя мыши на элемент
onmouseup освобождение ранее нажатой кнопки мыши, когда элемент имеет фокус
style задает встроенную таблицу стилей
title всплывающая подсказка

Пример

Рекомендации по использованию

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

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

Непонятый многими. Тег address.

Тег address относится к малоизведанным тегам, которые редко использует среднестатистический веб разработчик. А зря, не от нечего делать его же придумали. Давай разбираться зачем же этот тег увидел свет, да еще так давно — в 1995 году вместе со спецификацией HTML 2.0.

Неверное предположение

Можно предположить, что все просто и очевидно — address переводится с английского как адрес потому и следует его использовать для обозначения адресов на веб страницах. Но, если не гадать, заглянуть в спецификации, становится очевидным, что такое предположение ошибочно.

Рекомендации W3C о теге address

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

Из приведенного примера в спецификации можно сделать вывод какую именно информацию может содержать этот тег:

  • ФИО автора материала
  • его контактные данные: почтовые адреса, номера телефонов, адреса сайтов и email, icq и так далее
  • дата создания (последней модификации) материала

Примеры

В тему использование address для контактной информации автора статьи (вакансии, резюме, заметки и т.п.):

Если материалы, расположенные на сайте, принадлежат владельцам сайта, тогда контактную информацию расположенную в шапке (подвале или любом другом месте) тоже следует заключить в address:

На странице с контактной информацией тоже можно использовать address, т.к. тут предоставлены координаты и каналы связи с владельцем (автором) сайта.

Но не следует применять address для адресов, не связанных с авторством материала. Например, в каталогах компаний его применение будет ошибкой :

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

Выводы

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

Что такое html тег address и как он работает?


Всем хорошего и бодрого утра! На линии обучения азам сайтостроительства Макс Метелев и сегодня мы рассмотрим такой интересный тег, который применяется в html 5 версии – address.

В него можно включить информацию об авторе и владельце ресурса, а также любые элементы html – ссылки, выделения, текст и т.д.

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

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

Тег address парный, т.е его нужно закрывать.

Как использовать HTML-тег

Когда имеет значение каждый байт, можно использовать HTML-тег base href , чтобы указать атрибуты target по умолчанию для всех относительных URL-адресов на странице:

Для небольших ресурсов с несложной структурой это не даст большого эффекта. Но для сайтов с многоуровневой структурой каталогов тег существенно уменьшит объем страниц, а также обеспечить четкость и краткость URL-адресов .

Преимущества тега

Преимущества использования тега :

  • Уменьшает объем страницы;
  • Экономит трафик;
  • Более короткие URL-адреса ;
  • Чистая разметка;
  • Помогает при просмотре страниц в автономном режиме;
  • Упрощает миграцию ( нужно изменить всего одну ссылку, а не многие );
  • Упрощает перенаправление относительных URL-адресов.

Даже с учетом всех этих преимуществ base href base url используется не на многих страницах. Это связано с тем, что данный тег имеет несколько недостатков.

Потенциальные недостатки тега

  • Проблемы при прозрачной перезаписи URL-адресов;
  • Могут возникать проблемы при просмотре в старых браузерах.

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

Таким образом, мы имеем в наличии одну реальную проблему — если ваш сайт использует прозрачную перепись, то лучше не использовать тег .

Пример. Указание URL-адреса по умолчанию


Рассмотрим пример использования тега для указания URL по умолчанию, который будет применяться ко всем относительным URL-адресам на странице, включая атрибуты src и href . Это означает, что относится к изображениям, гиперссылкам, iframe , формам, скриптам.

Например, все изображения содержатся где-то в каталоге:

Его можно указать с помощью относительного пути:

Это короче, но все равно добавляет несколько байтов к объему, особенно если на странице используется несколько изображений. Например, использование подобного пути для каждого изображения в галерее уменьшает общий объем. Можно сделать еще лучше, указав URL-адрес по умолчанию с помощью тега . Для этого добавьте следующий код base href site url в раздел head :

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

можно просто добавить приведенный ниже код:

В зависимости от количества файлов, которые вы используете, может существенно уменьшить объем страницы и сохранить разметку чистой.

Пример: Указание атрибута target по умолчанию

Тег HTML base href также может применяться для указания атрибута target , используемого по умолчанию в ссылках, формах, iframes и т.д. Например:

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

можно сделать следующим образом:

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

Исключение URL-адресов из значения по умолчанию

Что делать, если вы хотите включить ссылки на ресурсы, расположенные не по тому адресу, который указан в ? Тег base href http применяется только к URL-адресам , которые относятся к базовому URL- . Например, на странице мы ссылаемся на следующие URL-адреса :

Без тега эти URL-адреса будут обрабатываться как есть. А теперь добавим через URL-адрес по умолчанию:

При этом предыдущие примеры URL-адресов меняются следующим образом:

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

Поддержка браузерами

Тег поддерживается основными браузерами:

  • Chrome ;
  • Firefox ;
  • Opera ;
  • Safari ;
  • Internet Explorer .


Заключение

Несколько полезных заметок по base href :

  • Необходимо использовать абсолютные URL-адреса для идентификаторов фрагментов ( анкоры / хэш-ссылки ), например #whatever ;
  • Нужно использовать абсолютные URL для адресов строки запроса, например ?whatever=something ;
  • Всегда указывайте конечную косую черту в базовом URL-адресе ( чтобы это была ссылка на каталог, а не на файл );
  • Тег должен быть включен в раздел ;
  • На каждой веб-странице может быть только один тег ;
  • Тег должен включать в себя атрибут href , атрибут target или оба сразу;
  • Добавляйте перед всеми другими тегами в разделе , чтобы он применялся для URL-адресов скриптов, стилей и т. д.

Я надеюсь, что данная статья помогла вам разобраться с HTML base href .

Данная публикация представляет собой перевод статьи « How to use the HTML base tag » , подготовленной дружной командой проекта Интернет-технологии.ру

HTML учебник. Бесплатные уроки HTML для начинающих разработчиков и веб-мастеров. Пробуем создать простой HTML сайт.

Ссылки в HTML. Якоря в HTML. Виды HTML навигации. Пути ссылок в HTML

Привет, посетитель сайта ZametkiNaPolyah.ru! Этой записью мы продолжаем рубрику: Верстка сайтов, в которой есть раздел HTML. Ссылка — один из самых важных элементов веб-страницы, при помощи ссылок посетители могут перемещаться по сайтам, ссылки мы используем, чтобы делиться информацией, найденной в интернете с другими людьми. В общем, если бы в HTML не было ссылок, то их обязательно придумали, иначе сейчас мы бы не пользовались сетью Интернет.

Ссылки в HTML. Якоря в HTML. Виды HTML навигации. Пути ссылок в HTML

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

Применение ссылок в HTML

Ссылки – один из самых важных элементов HTML документа, по-другому их еще называют гиперссылками. При помощи HTML ссылок мы можем переходить между страницами на сайте, между сайтами и между разделами HTML документа. Но ссылки могут вести пользователя не только между гипертекстовыми документами, но и на другие документы и файлы других форматов.

При помощи HTML ссылок поисковые системы «ходят» по вашему сайту и оценивают его, но важнее то, что при помощи ссылок посетители вашего сайта могут переходить по различным страницам. Самое важное правило использования ссылок в HTML заключается в том, что для создания ссылки путь к файлу должен быть доступен или иначе: если вы можете ввести какой-то URL или путь к файлу в строке браузера, то, соответственно, для такого файла вы можете создать HTML ссылку.

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

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

Виды ссылок в HTML

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

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

Но HTML ссылки можно разделить еще и на абсолютные и относительные. Абсолютные ссылки содержат абсолютные URL (такие URL не зависят от своего физического расположения и работают везде), например URL главной страницы моего сайта ZametkiNaPolyah.ru является абсолютным и доступен с любого компьютера, подключенного к сети Интернет, по HTTP протоколу. Относительные адреса HTML ссылок строятся относительно какой-нибудь физической области на жестком диске, например, относительно корня сайта или относительно корня диска C, можно даже относительно какой-нибудь отдельной папки.

SEO оптимизаторы делят еще ссылки на внутренние и внешние. Внутренняя HTML ссылка ведет на другую одного и того же сайта. А внешняя HTML ссылка ведет на страницу другого сайта.

Подведем промежуточный итог о видах HTML ссылок. HTML ссылки в HTML делятся на внутренние и внешние, если смотреть на них с позиции SEO. Ссылки делятся на постраничные и межстраничные. А также HTML ссылки можно разделить по значению атрибута href на относительные и абсолютные.

Атрибуты HTML ссылок

Для HTML ссылок доступны все универсальные HTML атрибуты и события. Но также у HTML ссылок есть довольно-таки большое количество уникальных HTML атрибутов. Давайте посмотрим на атрибуты, доступные при создании HTML ссылок а дадим им короткую характеристику:

  1. Атрибут accesskey. Позволяет активировать HTML ссылку при помощи определенных комбинаций клавиш, которые указываются в данном атрибуте.
  2. Атрибут coords. Позволяет установить координаты активной области HTML ссылки внутри тэга .
  3. Атрибут download. Позволяет сказать браузеру, что данная ссылка является ссылкой на скачивание.
  4. Атрибут href. При помощи этого атрибуты мы можем указать путь, по которому ведет HTML ссылка.
  5. Атрибут hreflang. Этот атрибут определяет язык документа, на который ведет HTML ссылка.
  6. Атрибут name. При помощи данного атрибута мы указываем имя HTML якоря.
  7. Атрибут rel. При помощи атрибут rel мы указываем в каком отношение находится ссылаемая HTML страница, с текущей (на которой находится пользователь).
  8. Атрибут rev. Данный атрибут позволяет задать отношение между текущим документом и тем документом, на который ведет HTML ссылка.
  9. Атрибутs shape Изображения в HTML могут быть ссылками, данный атрибут поможет вам задать область HTML изображения, которая является ссылкой.
  10. Атрибут tabindex. Не у всех ваших посетителей есть мышка, поэтому можно задать порядок получения фокуса HTML ссылки при помощи данного атрибута, чтобы посетителю было удобнее пользоваться вашим сайтом.
  11. Атрибут target. Данный атрибут позволяет указать имя окна или фрейма, куда браузер будет загружать документ, указанный по ссылке.
  12. Атрибут title Полезный атрибут, который позволяет создать подсказку при наведении курсора мыши на HTML ссылку.
  13. Атрибут type Этот атрибут служит для указания MIME-типа документа, на который ведет ссылка.

Итак, мы разобрались с HTML атрибутами ссылок и теперь можем более детально поговорить про создание ссылок на HTML страницах в браузере.

Внешние ссылки в HTML. Межстраничная навигация по сайту

Начнем с самого простого – с внешних HTML ссылок или с ссылок, которые ведут на другие страница сайта. Обычно такие ссылки используются для создания меню на сайте или для организации внутренней перелинковки сайта. Мы уже упоминали, что любая ссылка имеет атрибут href, который служит для указания пути к документу. Давайте создадим простой пример HTML ссылки:

Илон Маск рекомендует:  Google maps api работаем с информационными окнами
Понравилась статья? Поделиться с друзьями:
Кодинг, CSS и SQL