Цель HTML-заполнителей

До выпуска HTML5 тег требовал один атрибут: href. Но HTML5 делает даже этот атрибут необязательным. Когда вы пишете тег без каких-либо атрибутов, он называется ссылкой-заполнителем.

Ссылка-заполнитель выглядит так:

предыдущий

Использование ссылок-заполнителей во время разработки

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

текст ссылки

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

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

Использование ссылок на живые сайты

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

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

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

Styling Placeholder Links

Ссылки-заполнители легко оформить и оформить иначе, чем другие ссылки на вашей веб-странице. Просто убедитесь, что стилизовали тег a и тег a: link. Например:

{
красный цвет;
вес шрифта: полужирный;
текстовое оформление: нет;
}
ссылка {
цвет синий;
Вес шрифта: нормальный;
текстовое оформление: подчеркивание;
}

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

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

Вес шрифта: нормальный;

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

Ссылка на основную публикацию