Сайт начинающего верстальщика

Допустим ли пустой href?

Один из наших веб-разработчиков использует следующий html в качестве заполнителя для создания выпадающего списка.

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

Это не работает в IE, хотя! Ну, это работает в IE, но с совершенно другим поведением, против спецификации. Так что это действительно для спецификации, но не на практике: (((

Расширяя сказанное bayou.io, IE ссылается на каталог над документом: stackoverflow.com/questions/7966791/…

Да, пустой href в старых версиях IE (7/8 и т. Д.) Может иметь плохие последствия, такие как список каталогов. Есть много задокументированных по этому вопросу, если вы гуглите это

например: gtmetrix.com/avoid-empty-src-or-href.html . Не берите в голову только старые браузеры, это затрагивает текущие браузеры IE, Edge, а также Webkit.

10 ответов

Хотя этот вопрос уже ответил ( tl; dr: да, пустое значение href ), ни один из существующих ответов не ссылается на соответствующие спецификации.

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

HTML 4.01

HTML 4.01 использует RFC 2396, где говорится в разделе 4,2. Ссылки на один и тот же документ (смелый акцент мой):

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

RFC 2396 устарел RFC 3986 (который в настоящее время стандарт IETFs URI), который в основном говорит то же самое.

HTML5

HTML5 использует (действительный URL, потенциально окруженный пробелами → действительный URL) Спецификация URL W3Cs, которая была прекращена. WHATWGs URL Standard следует использовать вместо этого (см. последний раздел).

HTML 5.1

WHATWG HTML

WHATWGs HTML использует (действительный URL, потенциально окруженный пробелами) определение допустимой строки URL от WHATWGs URL Standard, где говорится, что это может быть строка relative-URL-with-fragment, которая должна быть как минимум относительной URL-строкой, который может быть строка path-relative-schem-less-URL, которая является строка path-relative-URL, которая не начинается со строки схемы, за которой следует : , и ее определение говорит (смелый акцент мой):

Строка относительного URL-адреса должна быть ноль или больше строк сегмента URL-адреса, отделенных друг от друга U + 002F (/) и не начинаться с U + 002F (/).

Источник

Как ставить пустые ссылки

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

Есть несколько способов указывать пустые ссылки. Рассмотрим, чем грозит использование того или иного способа.

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

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

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

Можно сделать полноценную якорную ссылку, но при этом без элементов с id=»noscroll» . Этот способ работает во всех браузерах, не скроллит страницу к началу, но меняет ссылку, добавляя #noscroll в конец адреса.

Достаточно старый способ, который благодаря JavaScript буквально просит ссылку ничего не делать. Правильнее было бы написать javascript: undefined; , но этот вариант длиннее, поэтому придумали более короткую замену void (0) , который также возвращает undefined . Этот вариант был создан ещё в то время, когда JavaScript инлайнили в разметку. Ссылка в этом случае никуда не прокручивается, что лучше, чем в предыдущем варианте. Сам же метод позволял создать AJAX-запрос без перезагрузки страницы. Например, при открытии попапа делается запрос у сервера на его контент, затем попап открывается, и отрисовывается полученный контент от сервера.

На самом деле, когда программистам нечем заняться, они начинают придумывать новые способы. Просто потому что они могут. В этом методе ничто никуда не прокручивается и не прыгает. В href можно добавить что угодно, а в JavaScript не добавлять новый onclick . Хотя раньше это было важно. Сейчас новое событие можно добавить с помощью addEventListener .

В новой спецификации разрешили вообще не указывать href , если он не нужен. Ссылка как будто превращается в : удаляется стандартное подчёркивание снизу и синий цвет, указанный по умолчанию. С такой ссылки удаляются состояния: active, focus, так как с ней нельзя взаимодействовать. Это очень хорошо, так как ссылки, действительно, пока нет. Но при этом пользовательская стилизация, которую пишете вы, продолжает работать. В целом, можно сказать, что это самый ленивый и правильный вариант, однако он не всем подходит.

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

«Доктайп» — журнал о фронтенде. Читайте, слушайте и учитесь с нами.

Источник

Как создать пустую ссылку в HTML?

a target = ”_ blank” Открыть в новой вкладке браузера (или в окне) Атрибут target указывает, где связанный документ будет открываться при щелчке по ссылке. По умолчанию — текущее окно. Если target = «_ blank», связанный документ откроется в новой вкладке или (в старых браузерах) в новом окне.

Как сделать пустую ссылку в HTML?

Как создать пустой URL-адрес?

1. Ctrl + N.
2. Файл> Создать> HTML.
3. Щелкните Файл> Создать> Страница> Общие> HTML. Посмотреть снимок экрана.
4. Щелкните раскрывающееся меню «Новый документ» на панели инструментов> выберите «Просмотр снимка экрана в формате HTML».

Как создать гиперссылку в HTML?

Чтобы сделать гиперссылку на HTML-странице, используйте теги и , которые являются тегами, используемыми для определения ссылок. Тег указывает, где начинается гиперссылка, а тег указывает, где она заканчивается. Любой текст, добавленный в эти теги, будет работать как гиперссылка. Добавьте URL-адрес ссылки в .

Как сделать так, чтобы ссылка никуда не уходила?

Если ваша ссылка никуда не идет, не надоt использовать элемент . Используйте или что-то еще подходящее и добавьте CSS (: hover), чтобы стилизовать его по своему усмотрению. Презентацию нельзя смешивать с содержанием. Это означает отсутствие javascript: action и атрибутов onclick, вместо этого предотвращение события по умолчанию с использованием простого Javascript.

Как сделать ссылку без href?

Почему при нажатии на ссылку появляется пустая страница?

Страница about: blank в браузере не является реальной страницей. . Браузер не может понять, что отображать, поэтому отображает страницу about: blank. Нажав на ссылка, открывающая новую вкладку браузера для загрузки файла или другой цели. Щелчок по вредоносной веб-ссылке, которая открывает новую вкладку перед загрузкой скрипта или приложения.

Как получить пустую страницу?

1. Запустите Internet Explorer. .
2. Перейдите к about: blank в браузере. .
3. Выберите «Свойства обозревателя» в меню настроек IE. .
4. Нажмите кнопку «Использовать текущий» под главной страницей на вкладке «Общие».
5. Щелкните ОК.
6. БОЛЬШЕ: 15 основных сочетаний клавиш для Windows 8.

Когда я нажимаю на ссылку, появляется пустая страница Chrome?

Ошибка пустого экрана Google Chrome может быть из-за поврежденного кеша браузера. Таким образом, очистка кеша Chrome может исправить ошибки в браузере.

Может ли тег быть пустым?

Пустые теги также известны как пустые или непарные теги. Элементы HTML без содержимого называются пустыми элементами. — пустой элемент без закрывающего тега (тег определяет разрыв строки). Пустые элементы можно «закрыть» в открывающем теге следующим образом:
.

Должен ли я использовать javascript void 0? Используйте Javascript: void (0); если вы хотите, чтобы страница обновлялась без открытия на новой вкладке, но убедитесь, что прослушиватель событийвозвращает ложь в функции, чтобы он оценил работу undefined, иначе возникнет ошибка.

1. Как правильно обрабатывать значение href в ссылке при выполнении вызовов ajax?
2. Сделайте так, чтобы в строке состояния отображался URL-адрес, на который ведет ссылка.

Разрешить пользователям копировать расположение ссылки и сделать его действительным URL-адресом.

1. Как сделать гиперссылку в Google Документах с помощью мобильного приложения
2. Откройте документ в приложении Google Docs на своем iPhone или телефоне Android.
3. Выделите текст, который хотите превратить в гиперссылку. .
4. Нажмите «Вставить ссылку».

На странице «Вставить ссылку» введите или вставьте URL-адрес, на который вы хотите создать ссылку.

1. На планшете или телефоне Android
2. На планшете Android коснитесь вкладки «Вставка». На телефоне Android коснитесь значка «Изменить». в верхней части экрана нажмите «Домой», а затем нажмите «Вставить».
3. Коснитесь Link.
4. Введите текст для отображения и адрес вашей ссылки.

Источник

Ссылки с пустым href, атрибут title

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

Когда мы удаляем атрибут href у ссылки, то лучше оставить подсказку о том, почему мы это сделали. Также подсказки помогают разъяснить назначение непонятных ссылок и ссылок-изображений. Подсказку можно добавить с помощью атрибута title . Например:

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

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

После выполнения этого шага можно смело скачивать архив со сделанным нами Сайтом начинающего верстальщика.

Хотите научиться профессионально писать код на самом востребованном языке программирования? Записывайтесь на профессию «React-разработчик», которая стартует 5 сентября 2023. Всего от 4 410 ₽ в месяц.

Блог

Спасибо! Мы скоро всё исправим)

Код изменился, нажмите «Обновить» или включите автозапуск.

Вы перешли на другую страницу

Кликните внутри мини-браузера, чтобы поставить фокус в это окно.

1. Удалите атрибут href у ссылки Вперёд .
2. Затем добавьте ей атрибут title c текстом Фото в галерее закончились .

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

Практикум

Профессии

• HTML и CSS.
  Профессиональная вёрстка сайтов
• HTML и CSS.
  Адаптивная вёрстка и автоматизация
• JavaScript.
  Профессиональная разработка веб-интерфейсов
• JavaScript.
  Архитектура клиентских приложений
• React.
  Разработка сложных клиентских приложений
• Node.js.
  Профессиональная разработка REST API
• Node.js и Nest.js.
  Микросервисная архитектура
• TypeScript. Теория типов
• Алгоритмы и структуры данных
• Паттерны проектирования
• Webpack
• Vue.js 3. Разработка клиентских приложений
• Git и GitHub
• Анимация для фронтендеров

Информация

Источник