Si usted es un principiante o un experto en Hyper Text Markup Language (HTML) es importante seguir algunas de las mejores prácticas con el fin de mantener sus documentos HTML coherente y organizado. Con tantos elementos, atributos, propiedades, valores y más, hay mucho que aprender.
Aquí hay 10 mejores prácticas de HTML para tener en cuenta cuando se trabaja en su próximo proyecto.
1. Utilice una estructura de documento adecuada
Los documentos HTML seguirán funcionando sin elementos como <html>, <head> y <body>. Sin embargo, las páginas no se renderizarán correctamente en todos los navegadores, por lo que es importante ser coherente utilizando la estructura adecuada del documento.
Ejemplo:
2. Declarar el doctype correcto
Al crear un documento HTML, lo primero que hay que declarar es el doctype. Esto le dirá al navegador los estándares que está utilizando para renderizar su marcado correctamente. El doctype va antes de la etiqueta <html> en la parte superior de la página. Si no está seguro de qué declaración utilizar, W3.org proporciona información sobre cómo elegir el doctype adecuado.
3. Cierre siempre las etiquetas
Para evitar encontrarse con errores de validación, recuerde siempre tener una etiqueta de cierre para cada etiqueta que cree.
4. No utilice estilos en línea
Puede parecer una ruta fácil colocar el estilo en línea con el código en lugar de crear una hoja de estilo externa. Sin embargo, los estilos en línea no son una buena práctica de codificación porque hace más difícil la actualización y el mantenimiento de un sitio web. En su lugar, mantenga sus estilos separados de su marcado HTML.
5. Utilizar el atributo alt con las imágenes
No es obligatorio tener un atributo alt con las imágenes, lo que hace que sea fácil de ignorar. Sin embargo, es importante tener un atributo alt significativo por razones de validación y accesibilidad. El atributo alt proporciona contexto a los lectores de pantalla, por lo que debe ser descriptivo en cuanto a lo que contiene la imagen.
6. Valide con frecuencia
En lugar de esperar hasta que haya terminado con su documento HTML, valide su código varias veces mientras trabaja. Esto ayudará a ahorrar algo de tiempo al final mediante la identificación de errores desde el principio, especialmente si su documento es largo. Un validador de HTML muy popular es el servicio de validación de marcas del W3C.
7. Coloque las hojas de estilo externas dentro de la etiqueta <head>
Aunque las hojas de estilo externas pueden colocarse en cualquier parte del documento HTML, la mejor práctica es colocarlas dentro de la etiqueta <head>. Esto permitirá que su página se cargue más rápido.
8. Utiliza etiquetas con sentido
Cada sección de tu página web debe construirse utilizando la etiqueta HTML5 más apropiada para el contenido. Es mejor evitar el uso excesivo de etiquetas genéricas, como <div>, cuando podría haber una etiqueta más descriptiva para el trabajo como <sección>, <artículo>, etc..
9. Utilice el marcado en minúsculas
Su marcado HTML puede estar escrito en minúsculas o en mayúsculas y la página web se renderizará correctamente. Sin embargo, la mejor práctica es mantener los nombres de las etiquetas en minúsculas porque es más fácil de leer y mantener.
10. Reducir el número de elementos en una página
Los documentos HTML pueden llegar a ser complicados, especialmente para las páginas web con mucho contenido. Para reducir el tamaño de sus páginas, busque oportunidades para optimizar aún más su código una vez que haya terminado con su marcado.
¿Quiere aprender más sobre las mejores prácticas de HTML? Echa un vistazo a estos otros artículos:
- Mejores prácticas de HTML
- Estándares de código Front-end &Mejores prácticas
- Escribiendo tu mejor código
¿No quieres hacerlo tú mismo o necesitas ayuda?
TBH Creative siempre trabaja para estar al día en las mejores prácticas de desarrollo web.