vertical sublime opciones menus lista horizontal hacer desplegable como codigo jquery html5 twitter-bootstrap semantic-markup

jquery - sublime - ¿Cuál fue el pensamiento detrás de la implementación del menú desplegable en Twitter Bootstrap?



menu desplegable vertical html (4)

Hay muchos hacks CSS y js por ahí para esta funcionalidad, pero todos están rompiendo algo.

Estoy en contra de usar hover, pero si alguien realmente necesita eso, entonces hágalo correctamente. Hice un complemento que utiliza solo la API de javascript de Bootstrap sin ningún tipo de pirateo, por lo que funciona en todos los dispositivos, sin frenar la usabilidad:

https://github.com/istvan-ujjmeszaros/bootstrap-dropdown-hover

He estado mirando el marco de Bootstrap de Twitter y estoy realmente impresionado. Sin embargo, no entiendo la forma en que funciona el menú de navegación desplegable.

En primer lugar, para ver los enlaces secundarios, debe hacer clic en el elemento principal. Puedo ver los beneficios de esto, pero ¿por qué no tener como opción predeterminada el menú desplegable más tradicional en el modo de desplazamiento?

En segundo lugar, parece que el pensamiento detrás del menú desplegable de Twitter Bootstrap ilumina las páginas principales. Probablemente no lo explique muy bien ... Supongamos que tiene una estructura de página web simple:

  • Casa
  • Acerca de
    • El equipo
  • Servicios
    • Diseño web
    • Alojamiento
    • Dominios
  • Contacto

En una estructura de menú desplegable tradicional, aparecería "sobre" y "servicios" y aparecerá el menú desplegable que contiene los enlaces secundarios (por ejemplo, "Diseño web", "Alojamiento", etc.). Sin embargo, también podría hacer clic en la página principal (es decir, "Acerca de" y "Servicios") y visitarlos.

Con Bootstrap no puede tener una página principal en la estructura, debe usar la etiqueta de anclaje ("#"). Cuando haces clic en esto, ves las páginas en el menú desplegable. Esto no es bueno si hay una página principal. Tampoco es genial desde el punto de vista semántico (¿qué significa "#"?) Y de accesibilidad (JavaScript desactivado, lectores de pantalla, etc.).

Probablemente me he perdido algo, pero ¿puede alguien explicar el pensamiento detrás de esto, particularmente en lo que respecta a las páginas principales y el acceso / html semántico?


La decisión de diseño fue hecha por la gente en Twitter, ver http://markdotto.com/2012/02/27/bootstrap-explained-dropdowns/

Si observa la cantidad de personas que buscan una solución para recuperarse (unos 1000 positivos / unos 700000 a partir de 2017-11):

Cómo hacer que el menú desplegable de Twitter Bootstrap se desplace al pasar el mouse en lugar de hacer clic

Puedes ver que la decisión no es hacer felices a todos. Especialmente si migras páginas web que han tenido menús flotantes durante muchos años, es incómodo ser "forzado" a un nuevo estilo por algún marco.