Razones para cambiar a HTML5 y ejemplos que lo defienden aún más

30

Un tramo virtuoso de la innovación, HTML5 es de hecho una tecnología que ha traído sangre nueva al género del desarrollo de sitios web. Ya sea que desee que su sitio web cuente con funcionalidades que cambian de forma o desee que haga alarde de un atractivo visual abrumadoramente hermoso, HTML5 hace el trabajo por usted, y de la manera más formidable.

Si bien esta plataforma hizo su incursión en el ámbito del desarrollo web hace bastante tiempo, no hay escasez de webmasters que no la tengan en su lista de "las 3 mejores herramientas preferidas" cuando se trata de crear un sitio web. Y una gran parte de estos webmasters ya están utilizando otras plataformas para su sitio web, por lo que comprometen una variedad de funciones que HTML5 podría haber integrado en sus sitios web.

1 Da rienda suelta a las almas creativas

La innovación es la seña de identidad de los grandes diseñadores y desarrolladores, y cuando aparece una herramienta que les permite ejercitar su creatividad sin límites, hay que apostar por ella. HTML5 encaja a la perfección y de la manera más sólida. Como marco de desarrollo web, HTML5 es súper personalizable, lo que permite que los profesionales del diseño se expresen. Entonces, cuando estar a la vanguardia está en su agenda, el vagón de HTML5 está ahí para atraparlo.

2 El soporte de video muy mejorado está ahí para tomar

El soporte de video se ha mejorado mucho con el nuevo video incrustado HTML5 para los navegadores. Dado que no todos los navegadores admiten diversos formatos como H.264, cuando desee mostrar un video HTML5, debe utilizar lo siguiente:

<video controls preload>
    <source src="cohagenPhoneCall.ogv" type="video/ogg; codecs='vorbis, theora'" />
    <source src="cohagenPhoneCall.mp4" type="video/mp4; 'codecs='avc1.42E01E, mp4a.40.2'" />
    <p>Your browser does not support the format. <a href="cohagenPhoneCall.mp4">Download this format.</a></p>
</video>
3 Le permite crear sitios web "para dispositivos móviles", en lugar de obligarlo a crear múltiples versiones

Inicie sesión en el análisis de su sitio, rasque un poco la superficie y observe las plataformas de sistema operativo de las que obtiene la mayoría de sus visitas. Te sorprenderá ver que la mayoría de tus visitas provienen de usuarios móviles, a diferencia de las cifras que existían hace un año, cuando probablemente tenías más usuarios de escritorio en tu sitio web. Por lo tanto, es mucho más recomendable crear un sitio web para dispositivos móviles que crear un sitio web centrado en el escritorio y luego crear una versión compatible con dispositivos móviles del mismo. Y HTML5 hace que sea un ejercicio muy eficiente para crear sitios web hechos para dispositivos móviles que conservan su atractivo visual cuando se accede a ellos en pantallas más pequeñas y se adaptan al tamaño reducido sin arrojar compatibilidad o problemas de respuesta.

4 El enrevesado tipo de documento XHTML da paso a una versión más fácil y menos engorrosa

Para decirlo sin equívocos, el doctype XHTML no ha sido visto con pasión por la comunidad de desarrolladores. Y la razón de lo mismo es más que evidente con la forma en que está escrito como:

<!DOCTYPE html PUBLIC "-//KKK//DTD XHTML 1.0 Transitional//EN"
    "http://www.xyz.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

HTML5 ha hecho que la declaración sea mucho más breve y comprensible para los desarrolladores:

<!DOCTYPE html>
5 atributos que se pueden detectar de forma más intuitiva

En primer lugar, los atributos que utiliza en su programa deben poder determinar sin problemas si los navegadores los detectan adecuadamente. HTML5 le da a estos atributos los medios para hacer exactamente eso. La biblioteca Modernizr demuestra ser una herramienta ingeniosa, pero hay otras formas, como crear los elementos antes de diseccionarlos. De esta manera, será fácil evaluar la capacidad del navegador.

6 Tiene su conjunto de correcciones para IE

Ah, bueno, Internet Explorer es visto desapasionadamente por la comunidad de Internet en todo el mundo, y por razones muy justificadas. Como era de esperar, IE tiene sus propios problemas para lidiar con los nuevos elementos que HTML 5 incorpora. Por lo tanto, diseñar estos elementos de manera que sean más comprensibles para este navegador es importante para dar un sentido de estructura a la forma en que los elementos HTML5 están alineados como elementos de nivel de bloque:

header, footer, article, section, nav, menu {
   display: block;
}

Ahora, existe la posibilidad de que Internet Explorer siga siendo un dolor de cabeza, ya que es posible que no esté familiarizado con el elemento de encabezado. Por lo tanto, el estilo en HTML5 corre el riesgo de ser ignorado descaradamente. Dicho esto, hay una solución fácil para lo mismo:

document.createElement("article");
document.createElement("footer");
document.createElement("header");
document.createElement("nav");
document.createElement("menu");
7 Geolocalización

La geolocalización es, sin lugar a dudas, la característica principal de HTML5. Lo que hace es que te arroja los valores matemáticos que representan las coordenadas de la ubicación de tu usuario. Estas coordenadas de ubicación se calculan utilizando el navegador que el visitante está utilizando para acceder al sitio web.

8 Código libre de desorden y mucho más comprensible

Siempre se recomienda escribir programas que sean limpios, fáciles de comprender y escritos de la manera más reutilizable. HTML5 hace todo esto posible, y más al facilitar un código que es altamente sincrónico, semántico y te da la libertad de trazar una línea entre el estilo y el contenido para que se entiendan fácilmente. Un código de encabezado estándar con navegación se ve así:

<div id="header">
 <h1>Header Text</h1>
 <div id="nav">
  <ul>
   <li><a href="x">Link</a></li>
   <li><a href="x">Link</a></li>
   <li><a href="x">Link</a></li>
  </ul>
 </div>
</div>

Si bien puede argumentar que el código es bastante simple, veamos qué puede hacer HTML5 con él:

<header>
 <h1>Header Text</h1>
 <nav>
  <ul>
   <li><a href="x">Link</a></li>
   <li><a href="x">Link</a></li>
   <li><a href="x">Link</a></li>
  </ul>
 </nav>
</header>

Aparentemente, HTML5 agrega mucho sentido de estructura a todo el código al hacerlo más esclarecedor y usar los encabezados HTML para representar mejor su contenido.

9 No tiene que lidiar con ‘Tipo’ para secuencias de comandos y enlaces

No hay escasez de desarrolladores web que se inclinen fuertemente hacia el atributo Tipo, particularmente cuando necesitan aprovechar las etiquetas de los scripts. Con HTML 5, puede curar sus Tipos, en lugar de eliminarlos por completo. El código como resultado se vuelve descriptivo.

<link rel="stylesheet" href="path/to/stylesheet.css" />
<script src="path/to/script.js"></script>

Con el conjunto de características resaltadas anteriormente, no es difícil deducir que HTML5 está aquí para alterar la esfera de la tecnología web de una manera más dominante e influyente. Y ya ha impulsado algunos de los sitios web y temas más sorprendentes de Internet.

Excelentes ejemplos de potentes sitios web HTML5

Los siguientes ejemplos defienden aún más el hecho de que HTML5 está aquí para generar poderosas olas de cambio:

1 estudio de arte de escritor fantasma

Es posible que Ghost Writer Art Studio no te sorprenda, pero seguramente hará una declaración fuerte, gracias a los diseños inteligentes que resultan ser pegadizos, por decir lo menos. Las herramientas de HTML5 le han dado un atractivo difícil de igualar.

2 Bodega Valpolicella Negrar

El sitio web de Cantina Valpolicella Negrar crea una vibra que es difícil de ignorar, más bien una vibra en la que quieres quedarte. Las funciones HTML5 se utilizan de manera más inteligente para estos sitios web mínimamente diseñados que tienen el máximo impacto.

3 Waterloo: la película

El sitio web te conecta directamente con la batalla, sin necesidad de una máquina del tiempo. Hace su trabajo de darte una idea de lo que trata la película extremadamente bien con su buen uso de los colores, el diseño, la posición de los elementos y más.

4 Zizzi

Si aún no crees en el viejo adagio, "una imagen vale más que mil palabras", este definitivamente te convencerá. Desarrollado por HTML5, el sitio web de Zizzi es un buen testimonio de cómo la creatividad junto con una plataforma poderosa puede crear magia. Creado por la agencia de gran reputación, Propeller Communications, este se asegura de que la función API de geolocalización de HTML5 se utilice abundantemente.

5 Lienzo de agua

¡Y luego está eso! Water Canvas es increíblemente hermoso, pero también se ha centrado la atención en la capacidad de respuesta del sitio web. Las texturas y el diseño general se combinan lo suficientemente bien como para que esta pieza se destaque.

6 Lardini

La web de Lardini tiene suficiente moda para hablar por sí misma y por la marca. De hecho, HTML 5 les dio a sus diseñadores y desarrolladores un conjunto completo de herramientas y capacidades para ejercitar su creatividad de la manera más libre y potente.

Estos ejemplos deberían brindarle una causa auténtica para hacer una pausa e impulsar aún más esta creciente tracción hacia HTML5; algo que solo mantendrá la tecnología de desarrollo web en un buen lugar.

This website uses cookies to improve your experience. We'll assume you're ok with this, but you can opt-out if you wish. Accept Read More