Добавление ссылок на веб-страницы

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

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

Добавление ссылок

Ссылка в HTML называется якорем, поэтому представляющий ее тег - это тег A. Обычно люди просто называют эти дополнения «ссылками», но якорь - это то, что фактически добавляется на любую страницу.

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

instagram viewer

В href Атрибут означает «гипертекстовая ссылка», и его цель - указать URL-адрес, по которому вы хотите перейти по этой конкретной ссылке. Без этой информации ссылка бесполезна, так как она сообщала бы браузеру, что пользователь должен перейти где-то, но у него не будет информации о пункте назначения, где это "где-то" должно быть. Этот тег и этот атрибут идут рука об руку.

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

HTML5 позволяет связывать элементы уровня блока, такие как абзацы и DIV элементы. Вы можете добавить тег привязки вокруг гораздо большей области, такой как список разделов или определений, и вся эта область будет «интерактивной». Это может быть особенно полезно при попытке создать на веб-сайте более крупные и удобные для пальцев области просмотра.

Некоторые вещи, которые следует помнить при добавлении ссылок

  • Последний тег - обязательный. Если вы забудете включить его, все, что следует за этой ссылкой, также будет связано, пока другая ссылка не закроет тег.
  • В большинстве случаев лучше связывать отдельные изображения и короткие фрагменты текста, а не большие блоки текста. Ссылки могут добавлять на вашу страницу цвета и стили подчеркивания, которые могут быть трудночитаемыми. Конечно, вы можете использовать CSS для изменения стилей этих ссылок, редактирования цветов или удаления подчеркивания, но все же хорошо помнить об этой реальности.
  • Обязательно проверьте свои ссылки, чтобы они не испортились. Link Rot может заставить и пользователей, и поисковые системы посчитать ваш сайт недействительным. Регулярно используйте средство проверки ссылок, чтобы проверять ссылки на своих страницах. Это особенно верно, когда вы ссылаетесь на сторонние сайты (те, которыми вы не управляете) и которые могут со временем менять свои страницы, оставляя вам мертвые ссылки. Средство проверки ссылок найдет эти мертвые ссылки, чтобы вы могли внести любые необходимые обновления.
  • Избегайте текста типа «нажмите здесь» в вашей ссылке. Помните, что люди с сенсорными экранами не могут «щелкать», поэтому текст кажется продуктом прошлой эпохи и действительно не актуален в сегодняшней сети, ориентированной на несколько устройств.

Другие интересные типы ссылок

В А Элемент создает стандартную ссылку на другой документ, но есть и другие типы ссылок, которые могут вас заинтересовать:

  • Внутренние ссылки или якоря: Это ссылки на что-то внутри веб-страницы, не обязательно наверх.
  • Карты изображений: Карты изображений позволяют создавать ссылки на изображения, которые сопоставляются с определенными областями изображения. Их можно использовать для игр или творческой навигации. Вы часто видите их на картах, где области на карте доступны для нажатия. Обратите внимание, что карты изображений не используются на большинстве современных веб-сайтов, отчасти потому, что они могут вызвать проблемы на мобильных устройствах.
  • Элемент: этот элемент используется для привязки других документов и страниц к текущему. Это не создаст интерактивную область на вашей веб-странице, но это полезно для понимания.
instagram story viewer