Hoy toca explorar una etiqueta que, aunque puede ser muy útil, a menudo pasa desapercibida: la etiqueta <base>.
Esta etiqueta es especialmente útil para aquellos que buscan optimizar su tiempo, y en esta era digital, ¿quién no quiere hacerlo?
Quizá no hayas oído hablar mucho sobre esta etiqueta, pero como verás a continuación, en ocasiones nos puede ser muy útil.
Recuerda que esta lección forma parte del diccionario de etiquetas de HTML de dropcoding. Si tienes alguna duda sobre este lenguaje, ya sabes donde acudir 😉
¡Empezamos!
¿Qué es la etiqueta base y cómo funciona HTML?
La etiqueta o elemento «base» se utiliza para determinar una URL que se podría utilizar como base para todas las direcciones de URLs relativas en el mismo documento HTML.
En otras palabras, si tenemos que repetir muchas veces la misma URL, la etiqueta «base» nos puede servir para no tener que repetir todas esas veces el mismo enlace.
Así, no tendremos que estar copiando y pegando todo el rato la misma URL por todo el documento. En vez de hacer eso, tenemos la etiqueta «base» que nos sirve como base.
Ejemplo Etiqueta Base
Supongamos que dentro de la etiqueta body tenemos unos enlaces que queremos que vayan hacia nuestra página web.
En vez de copiar la dirección de nuestra página web y colocarla en todos los enlaces, lo que podemos hacer es pasar a través de la etiqueta «base» una base del enlace para que lo tenga en cuenta para todos los enlaces del mismo documento.
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ejemplo Etiqueta Base</title>
<!-- Aquí se coloca la etiqueta base con la URL base -->
<base href="https://dropcoding.com/">
</head>
<body>
<!-- Los siguientes enlaces utilizarán la URL base definida anteriormente -->
<a href="">Inicio</a>
<a href="diccionario">Diccionario de Etiquetas HTML</a>
<a href="blog">Blog</a>
<a href="suscribete">Suscríbete</a>
</body>
</html>
Por ejemplo, si queremos crear un enlace que vaya al diccionario de etiquetas HTML, no hace falta que le pase toda la dirección, simplemente con poner el nombre ya iría a la sección que nosotros queramos.
Recuerda que esto funciona dentro de un mismo documento.
Si tienes una página con la etiqueta «base» y no la tienes puesta en otra página, no va a servir. Por eso, normalmente la etiqueta «base» se pone en el head, que suele ser una parte dinámica de la página web.
Conclusión
Como has podido ver, la etiqueta «base» no tiene mucha más complicación y en ocasiones nos puede ahorrar bastante trabajo.
Aunque realmente, también podemos colocar una / antes del elnace y así no tenemos que usar la etiqueta base 😂.
Espero que te haya sido útil el vídeo. Recuerda que si tienes alguna duda o alguna sugerencia, déjamelo en los comentarios y te contestaré encantado. ¡Nos vemos en la siguiente lección! Adiós.