Funcionamiento de las etiquetas HTML en el Desarrollo Web
Es uno de los cimientos de la creación de sites para internet y es uno de los conocimientos imprescindibles para quienes quieran trabajar como desarrolladores web, ¿quieres saber qué son las etiquetas HTML y cómo funcionan?
Es una de las profesiones con más presente y con mayores expectativas de futuro, un trabajo que cada vez se demanda más y que, por ende, requiere de profesionales con formación y experiencia. Nos referimos a los desarrolladores web, esos perfiles que están tras sites como este en el que en estos momentos navegan los internautas. Y en la base, cuatro letras que todo el mundo ha visto en alguna que otra ocasión: HTML. ¿Qué es exactamente la etiqueta HTML?
¿Qué es una etiqueta HTML?
Las siglas pertenecen al concepto ‘HyperText Markup Language’ y es esencial en la programación de páginas para internet y en aplicaciones. En esencia es un lenguaje informático que consiste en un código que da instrucciones a un navegador para ‘traducir’ lo que después se ve en la web, lo que llega al usuario final.
Una vez definido qué es etiqueta HTML es interesante conocer qué partes componen una de estas. Cuatro codificaciones fundamentales:
- El símbolo que equivale a ‘menor que’ <
- Carácter o palabra que permite identificar de qué etiqueta se trata, para que se utiliza
- Atributos HTML escritos como ‘valor’ que se vayan a usar, con un número indefinido de los mismos, según necesidades
- El símbolo que quiere decir ‘mayor que’ >
Estos puntos ayudan a entrar en el tema en cuestión y a empezar a dejar de ver como un auténtico jeroglífico los códigos HTML que seguramente se ven por redes o cuando se accede a la parte interna -al esqueleto- de un site. Con esta herramienta se consiguen desarrollar sesiones, se estructuran párrafos, se enlazan links, etc. En total se cuenta con hasta 142 etiquetas HTML que se usan para crear diferentes elementos que conforman lo que se ve como una página web.
Función de las etiquetas HTML
Las etiquetas HTML tienen distintas funciones y son archivos que acaban con la terminación .html o .htm. Los diferentes navegadores saben desencriptar los códigos y lo traducen para que el usuario de la red pueda verlo todo. Así, estas están tras diferentes páginas y secciones, desde la intro a páginas específicas de producto, formularios de contacto, blogs, entre otros.
Los diferentes tipos de etiquetas, unidos, es lo que hacen un comando, por así decir.
- Etiqueta de apertura, con corchete apertura y después de cierre.
- Contenido, qué es lo que leerá el usuario final.
- Etiqueta de cierre, que incluye una barra inclinada para que la programación lea que esa es la conclusión.
Un párrafo de texto podría ser así: <p>Estamos desarrollando un proyecto en Internet</p> , incluyendo los símbolos y caracteres que se citaban en el punto anterior. Esto son apenas pinceladas, por supuesto, pues al fin y al cabo hay que tener en cuenta que se dan formaciones muy específicas para que los desarrolladores web puedan desempeñar su trabajo. Además, cada vez se mejoran más los sites y eso conlleva avanzar en lo que a estructuras y codificación se refiere.
Tanto este aspecto tan específico como es el saber qué es etiqueta html y cómo funcionan como otros temas avanzados se imparten en programas tan amplios y específicos como el Máster en Big Data & Analytics y el Global Máster en Business Analytics and Data Strategy de EAE Barcelona. Las personas que quieran desarrollar su carrera en el mundo del desarrollo web han de ser conscientes de la importancia de optar por formaciones de calidad e ir actualizándose, pues a diario se dan avances, novedades e innovaciones en este sector.
Tipos de etiqueta HTML
Una vez determinadas las señas de identidad de estas y, grosso modo, cuáles son los códigos más necesarios para saber de qué se habla, es hora de abordar los diferentes tipos de etiqueta HTML que forman una página web. Las que se suelen utilizar prácticamente en todos los casos son las siguientes:
<body> para el contenido visible, el texto que se podrá leer.
<p> para párrafos, estructurando el texto mejor y ordenándolo.
<head> para información sobre el documento, metadatos como el estilo, el CSS, entre otros.
<div> división dentro del contenido, como plantilla de otros controles, ayudando a estructurar secciones.
<a> para enlaces, cuando se quiere incluir un link a otro site, y suele ir acompañado de ‘href’, la web a la que se dirige.
<strong> para poner el texto en negrita, una de las formas que hay de incluir estilos al texto, al body.
<br> para saltos de línea, para insertar la distancia entre párrafos, por ejemplo, lo que ayuda a que el texto tenga mayor legibilidad.
<H1>…<H6> para títulos dentro del contenido, que además van con diferente tamaño, de mayor -H1- a menor -H6- o el correspondiente.
<img> para añadir imágenes al documento, unido a otra codificación, ‘scr’, para que finalmente consiga ese objetivo.
Etiquetas <ol> <ul> <li>… Para poder establecer listas ordenadas con <ol>, <ul> listas desordenadas, <li> para elementos dentro de la lista.
<span> para estilos de una parte del texto.
A esto añadir que siempre debe ir el código de apertura, ese signo de ‘menor que’, y el de cierre, el ‘mayor que’. Un ejemplo sería <body>La casa roja<body>
Ventajas y desventajas de las etiquetas HTML
Las etiquetas HTML son especialmente útiles en el ámbito del desarrollo web. Pese a lo que pudiera parecer, frente a sus ventajas se dan inconvenientes.
Ventajas de etiquetas HTML
- Lenguaje apto para quienes se inician crear páginas para internet.
- Accesible y sencillo de utilizar.
- Código abierto, por lo que es gratuito.
- Se ejecuta en todos los navegadores de la red.
Desventajas de etiquetas HTML
- Limitaciones, pues según qué funcionalidad más avanzada se quiera implantar en una web es probable que se requiera de JavaScript o de otros lenguajes de programación.
- Navegadores antiguos podrían no reconocer las etiquetas más recientes.
- Los desarrolladores web deben crear páginas individuales para este código HTML.
Como se puede comprobar, todo un universo por descubrir y esto es apenas una introducción al mundo del desarrollo web y de las etiquetas HTML, que se consideran imprescindibles a este respecto. En EAE contamos con programas de formación especializados para quienes quieran orientar su carrera profesional hacia este tipo de trabajos.
