Hrefs vs JavaScript onclick (con respecto a Unobtrusive JavaScript)

Question

¿Cuál es la mejor práctica con respecto al uso de enlaces/<a> etiquetas con hrefs explícitas a otras páginas en su sitio (es decir, href = "/ blah/blah/blah.html) vs tener hrefs/divs/etc. que no tienen un href explícito y tienen su onclick establecido en el controlador de documento listo con JavaScript en decir un archivo main.js.

No soy un experto cuando se trata al desarrollo web, pero estoy disfrutando el aprendizaje de jQuery y demás, y me encuentro suscribiéndome a la noción de JavaScript discreto. Si bien las dos opciones anteriores no rompen la parte de esa mentalidad que dice "no tengo JavaScript dentro del HTML", supongo Estoy pendiente de la "Separación de la estructura y la presentación del comportamiento". Aunque es un anuncio Mittedly más natural para mí poner una etiqueta < > allí y explícitamente establecer el href, me encuentro pensando que esto es realmente el comportamiento y por lo tanto debe establecerse dentro de la JS.

¿Va a llegar tan lejos, o simplemente no estoy acostumbrado? El otro lado de mí ve el beneficio de ponerlo en el JS, b/c ahora tengo la capacidad de controlar completamente el comportamiento de ese enlace sin tener que cambiar nada en el HTML. Supongo que dirías que estoy en la valla proverbial. Por favor, ayúdame a bajar. =)

(Una nota:. El sitio web utiliza JavaScript en gran medida, por lo que la idea de proporcionar funcionalidad con JS desactivado en realidad no es una preocupación ya que la mayor parte del sitio no podrá funcionar sin ella)

Answer 1

Eso realmente está yendo demasiado lejos por una multitud de razones.

1. Es el código más complicado, que debe evitarse.
2. No proporciona ningún beneficio tangible a su sitio web.
3. No tiene una alternativa elocuente para no-js.
4. Tiene un efecto negativo en SEO. Específicamente, bots no ejecutará su script, y por lo tanto no verá los enlaces y finalmente no indexará su sitio correctamente.
5. probablemente lo más importante, este efecto puede afectar gravemente UX para los lectores de pantalla o usuarios con JS con discapacidad (por ejemplo, muchos navegadores de teléfonos móviles desactivar JS)

Al final, a menos que tenga necesidad explícita para romper el molde (por ejemplo, soporte heredado) debe hacer todo lo posible para seguir un diseño discreto, y esto es muy molesto en el sentido de que está usando JavaScript para crear una estructura estática, algo que es mucho mejor que hacer con HTML.

Answer 2

Los usuarios normales realmente no sabrá la diferencia. Sin embargo, los motores de búsqueda y las prácticas de SEO requieren que use href = "" para vincular a sus otras páginas si desea que las arañas las sigan. Lo mismo con si el visitante estaba usando algún lector de pantalla o si tenía algunas necesidades especiales de accesibilidad. Muchos de ellos leen el código fuente y no el DOM.

En general, si está enlazando páginas y acciones, use el href.

Si necesita adjuntar funcionalidad adicional o si no va realmente a otra página o acción, utilice javascript onclick style o use jQuery para adjuntar eventos.

Answer 3

De acuerdo con otros carteles. Añadiría que si el href es estático, es decir, las interacciones en esa página no cambian su valor, entonces puede considerarlo parte de la "estructura y presentación" de la página.En los casos inusuales en que es dinámico y algunas acciones en la página cambian su valor, es cuando se convierte en "comportamiento", y solo entonces sería apropiado dejar que JS lo maneje.

Por otro lado, si el código existente ya tenía 9 hrefs dinámicamente configurados y solo está agregando un href estático, probablemente seguiría el liderazgo del desarrollador anterior para la legibilidad.

Answer 4

El plugin de historia de jquery es bastante agradable, te permite establecer href = '#/url "de esta manera puedes tener urls reales, botones atrás reales, pero tus manejadores solo escuchan eventos vinculados a history.url.

.

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

no usar etiquetas probablemente podría también tener algún tipo de problemas de usabilidad para los usuarios con discapacidad visual con los lectores de pantalla

Answer 5

Los enlaces son no comportamiento - que representan los vínculos entre un documento y otro navegadores web. ofrecer el comportamiento de navigati ng a la página vinculada cuando hace clic en enlaces, pero este es el comportamiento del navegador, y cada navegador tiene sus propias convenciones para la mejor manera de hacerlo; por ejemplo, el clic primario podría abrir la página en la pestaña actual, el clic central podría abrir en una nueva pestaña, y M4 podría abrir el enlace en una página nueva. Reemplazar esta información sin procesar con el comportamiento rompe la capacidad del navegador para ofrecer este tipo de elección.

Y hay otros clientes que se verán afectados también. Las arañas y otros bots leerán tu página para la información en tus etiquetas de anclaje para determinar a qué se vincula la página. Si en cambio usas "comportamiento", estás eliminando esta información significativa de la página.