Respuestas:
HTML5 es compatible con todos los navegadores ahora, ¡incluso IE5! (Si usa el script html5shiv). Recomiendo leer http://diveintohtml5.org. Es uno de los mejores recursos HTML5 que existen.
En cuanto a CSS3, si lo usa, asegúrese de usar también el prefijo del proveedor, además de la sintaxis normal. p.ej
radio de borde
-moz-border-radius
-webkit-border-radius
Creo en la mejora progresiva. El soporte css3 de IE9 suena muy prometedor.
Probablemente.
Hay partes de HTML5 que puede usar ahora, hoy. Formas por ejemplo. Si tiene <input type="email">
un navegador que no admite HTML5 (sí, incluso IE6), simplemente verá lo mismo que vería si lo usara <input type="text">
. Sin embargo, en un navegador que admite elementos de formulario HTML5, obtiene las ventajas del email
tipo: es decir, el cliente verificará por error el valor sin necesidad de JS adicionales. Si bien sí, aún necesitará el JS para navegadores que no sean HTML5, tendrá una capa más de validación en los navegadores compatibles.
Otra pregunta en este sitio proporciona una buena descripción de las nuevas funciones disponibles para usted a través de HTML5 y CSS3. También hay muchos buenos datos sobre formularios en esa pregunta.
Debido a que Internet Explorer (y las versiones anteriores de Safari y Firefox, por muy raras que sean) no son compatibles con muchas de estas características, le quedan bibliotecas de JavaScript para llenar el vacío. Estos incluyen un éxito en el rendimiento (aunque es solo para los navegadores que necesitan usarlos), así que tenga en cuenta a sus usuarios cuando los emplee.
Para mitigar los problemas con la falta de compatibilidad de funciones, si decide que estas nuevas funciones valen la pena, use los siguientes recursos:
.htc
archivo) que hace que Internet Explorer 6-8 sea capaz de representar varias de las características de decoración CSS3 más útiles. Cuando se aplica a un elemento, que permite reconocer IE y la pantallaborder-radius
,box-shadow
,border-image
, múltiples imágenes de fondo, y lalinear-gradient
imagen de fondo.true
si es compatible yfalse
si no. Agrega compatibilidad para diseñar e imprimir elementos HTML5 para que pueda usar elementos como<section>
,<header>
y<nav>
.src
de un<img />
elemento o como unabackground-image
propiedad de CSS. A diferenciaAlphaImageLoader
,background-position
ybackground-repeat
funcionan según lo previsto, y los elementos responderán a laa:hover
pseudoclase..htc
archivo) que agrega compatibilidad con PNG con opacidad alfa a IE 6. El posicionamiento completo de fondo CSS y la repetición son compatibles (incluidos sprites CSS) con JavaScript adicional (incluido)..htc
archivo) que parchea automáticamente: hover,: active y: focus para las peculiaridades de IE6, IE7 e IE8, permitiéndole usarlas como lo haría en cualquier otro navegador. Incluye compatibilidad con AJAX, lo que significa que cualquier html que se inserte en el documento a través de JavaScript también se activará:hover
,:active
y los:focus
estilos en IE.Es interesante notar que DD_belatedPNG resuelve ambos problemas abordados por Whatever: hover y IE PNG de TwinHelix Fix con JavaScript puro, mientras que Whatever: hover y IE PNG de TwinHelix Fix utilizan una combinación de comportamientos adjuntos de JavaScript e IE ( .htc files
).
En general, las personas que usan navegadores que no son IE los actualizan cuando se les solicita, por lo que IE lleva la peor parte de "¡Pero algunos navegadores no son compatibles con esta función!" quejas Modernizr agregará la capacidad de usar HTML5 / CSS3 a cualquier navegador que pueda ver y no solo a IE. ie-css3.js hará lo mismo, simplemente tiene que implementarlo sin un comentario condicional de IE (lo que significa que todos los navegadores terminarán obteniéndolo a menos que lo incluya con verificaciones de agente de usuario del lado del servidor; esto reducirá en gran medida el rendimiento para todos sus visitantes, en lugar de solo sus usuarios de IE).
Utilice la tecnología que mejor se adapte a sus necesidades.
Eric Meyer escribió un buen artículo sobre por qué comenzar a usar prefijos específicos del proveedor en las reglas CSS no es tan aburrido como solía ser el uso de hacks de filtros CSS.
Creo que lo mismo se aplica a HTML5. Si puede consultar el soporte del navegador para diferentes funciones, ¿por qué no usarlo? Mientras el sitio se degrade con gracia, vívelo.
Algunos otros enlaces útiles, al decidir qué características de CSS3 puede que desee utilizar: http://caniuse.com/ (ofrece un buen desglose de qué elementos y selectores se pueden utilizar en qué plataformas)
http://css3please.com/ (un área de juegos editable en la página para jugar con las características CSS3, esto también da algunos consejos sobre qué técnicas y características son compatibles con qué plataformas para los estilos comúnmente solicitados, como esquinas redondeadas, fondos degradados, etc.)
Lo uso para mejorar la experiencia en los navegadores modernos para que los usuarios con un buen navegador sean "recompensados" con una interfaz de usuario más bonita (esquinas redondeadas, sombras, esas cosas). Supongo que no deberías usarlo como un reemplazo para, digamos, tu validación actual del formulario del lado del cliente, a menos que tengas algún tipo de respaldo de JS para ello.
Si está comenzando un nuevo proyecto con HTML5 que también debería ser compatible con navegadores antiguos, la mejor opción es usar Initializr:
Utiliza HTML5 Boilerplate en el backend y agrega algunas opciones propias para darle una plantilla que puede implementar en su propio sitio. Incluye las bibliotecas Javascript (como HTML Shiv o Modernizr), que harán que su sitio sea compatible con navegadores más antiguos.
Depende de lo que sea la audiencia y de las características que quieras usar. Espero que pasen varios años más antes de que el proyecto promedio pueda abandonar el soporte para ie6 :(
Si su sitio es una intranet privada y usted controla el navegador o tiene una gama limitada de navegadores con los que lidiar, entonces no dude en trabajar con la tecnología más avanzada.
Si no, no importa lo que use, siempre tendrá que tener en cuenta el mínimo común denominador. En este caso, es probablemente una combinación de IE 6 y una variedad de navegadores móviles. Entonces, si avanzas con HTML 5, tienes el problema adicional de asegurarte de que tu sitio se 'degrada' bien.