Volver al blog

Etiquetas HTML básicas que deberías conocer para salir de un apuro

En este artículo te explico las entradas HTML básicas que deberías conocer si quieres lanzarte a diseñar tu página web o ha realizar modificaciones...

Etiquetas HTML básicas que deberías conocer para salir de un apuro

Las etiquetas HTML son la base principal del lenguaje que se usa para elaborar páginas web y que entienden los navegadores para construir la página correctamente y mostrarla al usuario a través de éste.

En esta entrada te enseñaré las etiquetas básicas que deberías conocer por si necesitas hacer alguna modificación en tu página web, o por si al contrario te has animado a tocar el código y has hecho algún desajuste.

Etiquetas HTML, lo mínimo que deberías conocer

Primero de todo hay que saber que una etiqueta HTML se caracteriza por ir entre corchetes <> para la apertura y </> para el cierre.

Por ejemplo, para poner el texto en negrita:

Negrita

Prácticamente todas las etiquetas se abren y cierran de este modo, a excepción de dos o tres que veremos mas adelante.

Estructura básica de una página web

La estructura básica de una página web con sus correspondientes etiquetas la tenéis a continuación:

[code language=»html»]

Aquí va todo lo relacionado con el título, estilos css, etc.Aquí va el contenido de la página.

[/code]

La etiqueta html engloba toda la página y es imprescindible para que el navegador sepa que lo que está cargando es una página web.

La etiqueta head incluye el título de la web, estilos css, scripts, palabras claves y demás información que es interpretada por los navegadores para comenzar a construir la web y por los buscadores para indexar la página web en sus directorios.

Dentro de la etiqueta body es donde va todo el contenido de la web, las imágenes, el texto… lo que el usuario final verá en la pantalla.

Etiquetas HTML que más se utilizan

: Define el título de la página web. Es una etiqueta importante para el SEO. También es la que se muestra en la barra de título del navegador. Se inserta siempre dentro de la etiqueta head.

… hasta

: Encabezados. Existen seis tipos de encabezados por orden de relevancia. Estas etiquetas también son importantes para el SEO, ya que Google los rastrea para encontrar contenido relevante.

: Usaremos esta etiqueta para añadir enlaces tanto internos como externos a nuestra web. Añadiremos el atributo href=»url_web» para la dirección web, y target=»_blank» para hacer que el enlace se abra en una nueva ventana del navegador.

: Como indican sus siglas se emplea para añadir imágenes, siempre va a ir acompañado del atributo src=»ruta_de_la_imagen» para mostrar la imagen. En este caso en concreto la etiqueta img no se cierra.

: Para poner el texto en negrita. De nuevo importante para el SEO, especialmente para destacar palabras clave.

: Etiqueta HTML que pone el texto en cursiva.

:  Delimita un párrafo normal, o lo que es lo mismo, añade un salto de linea.

: La etiqueta div se emplea para definir un bloque de contenido o una sección de nuestra página web. Es una etiqueta muy compleja que se apoya en la hoja de estilos CSS para darle color, o posicionarlo para colocar el bloque en cualquier parte de la página que estemos diseñando.

Bonus, etiquetas HTML 5

HTML5 es la actualización del antiguo HTML, pero no te asustes, las etiquetas HTML siguen siendo las mismas, simplemente se añaden nuevas. HTML5 tiene unas características especiales para el desarrollo de aplicaciones modernas basadas en el navegador y para hacer la experiencia web mas semántica.

Algunas de las nuevas etiquetas HTML 5 son las siguientes:

Saltar al contenido