Hrefs vs JavaScript onclick (относительно ненавязчивого JavaScript)

Question

Что такое наилучшая практика использования ссылок/<a> теги с явным hrefs на другие страницы вашего сайта (например, href = "/ blah/blah/blah.html) vs имеет hrefs/divs/etc, которые не имеют явного href и имеют свой набор onclick в документе, готовый обработчик с JavaScript в файле main.js.

Я не эксперт, когда он приходит к веб-разработке, но мне нравится изучать jQuery и тому подобное, и я подхожу к понятию ненавязчивого JavaScript. Хотя оба варианта выше не разбивают часть «не имеют JavaScript в HTML» этого менталитета, я полагаю, Я повесил трубку на «Разделение структуры и представление от поведения». Пока это объявление для меня более естественным поставить < тег > и явно установить href, я считаю, что это действительно поведение и поэтому должно быть установлено в JS.

Неужели это далеко, или я просто не привык к нему? Другая сторона меня видит преимущество в том, чтобы поместить ее в JS, b/c, теперь у меня есть возможность полностью контролировать поведение этой ссылки, не изменяя ничего в HTML. Наверное, ты скажешь, что я на пресловутом заборе. Пожалуйста, помогите мне. =)

(одно примечание:. Сайт использует JavaScript сильно, поэтому понятие обеспечения функциональности с JS отключен в действительности не является проблемой, поскольку большая часть сайта не будет работать без него)

Answer 1

Это действительно слишком далеко по множеству причин.

1. Это в основном сложный код, которого следует избегать.
2. Это не дает ощутимых преимуществ для вашего сайта.
3. Не имеет красноречивого резерва для no-js.
4. Это оказывает негативное влияние на SEO. В частности, боты не будут запускать ваш скрипт и, следовательно, не будут видеть ссылки и в конечном итоге не правильно проиндексируют ваш сайт.
5. Вероятно, самое главное, этот эффект может серьезно повлиять на UX для чтения с экрана или пользователей с JS отключен (например, многими мобильными телефонами браузеры отключить JS)

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

Answer 2

Обычные пользователи не будет знать разницу. Тем не менее, поисковые системы и методы SEO потребуют от вас использовать href = "" для ссылки на ваши другие страницы, если вы хотите, чтобы пауки следовали им. То же самое, если посетитель использовал некоторый экранный ридер или имел некоторые особые потребности в доступности. Многие из них читают исходный код, а не DOM.

В целом, если вы ссылаетесь на страницы и действия, используйте href.

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

Answer 3

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

С другой стороны, хотя, если в существующем коде уже было 9 динамически настроенных hrefs, и вы просто добавляете один статический href, я, вероятно, следовал бы примеру предыдущего разработчика для удобства чтения.

Answer 4

Плагин истории jquery довольно хорош, он позволяет вам установить href = '#/url "таким образом, чтобы вы могли иметь настоящие URL-адреса, реальные кнопки назад, но ваши сторонники просто слушают события, связанные с history.url.

.

http://tkyk.github.com/jquery-history-plugin/

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

Answer 5

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

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