HTML
HTML son las siglas en inglés de HyperText Markup Lenguage, que significa Lenguaje de
Marcado de HiperTexto. Se llama así al lenguaje de programación empleado en la elaboración
de páginas Web, y que sirve como estándar de referencia para la codificación y estructuración
de las mismas, a través de un código del mismo nombre (html).
El Lenguaje de Marcado de Hipertexto (HTML) es el código que se utiliza para estructurar y
desplegar una página web y sus contenidos. Por ejemplo, sus contenidos podrían ser párrafos,
una lista con viñetas, o imágenes y tablas de datos.
¿Cómo funciona el html?
El lenguaje html opera en base a marcadores escritos (que aparecen entre comillas angulares:
<html>), a partir de las cuales se cifra la apariencia y orden interno de una página web, así
como los scripts o rutinas que operan dentro de ellas. Dicho código fuente hace de ADN de la
página Web, diciéndole al navegador de dónde obtener los recursos para su representación y
en qué orden, secuencia y modo establecerlos. Y siguiendo el código al pie de la letra, el
navegador nos brinda la experiencia de la navegación Web.
Para ello html opera en base a un conjunto de componentes, como son:
Elementos. Los ladrillos básicos del lenguaje html, sirven para representar el contenido y sus
atributos, así como marcar los parámetros del propio lenguaje, como el punto de inicio de la
cadena de comandos y el punto de cierre, o las necesidades especiales.
Atributos. Las especificaciones respecto a valor, color, posición, etc. de los elementos
incorporados en el código. Por lo general consisten en una serie de instrucciones lógicas o
numéricas.
¿Qué es una etiqueta html?
Se llama etiquetas html a las instrucciones mismas con que se compone el código, es decir, las
entradas rodeadas de comillas angulares y que tienen un valor específico en el conjunto, que
será luego leído por el programa navegador y traducido en una página Web. Estas etiquetas
deben abrir <> y luego cerrar </> cuando ya no se las necesite, en el orden correcto y la
secuencia correcta para que no surjan errores.
Algunos ejemplos de etiquetas son:
<html>. Comando que da inicio a la cadena de instrucciones que es el código html y que cierra
con </html> al final del documento de programación.
<head>. Que define la cabecera del documento html, que se vincula con el título de la ventana
del navegador y contiene subelementos como <title> (título), <link> (para vincular a hojas de
estilo o modelos estéticos), <meta> (para referir información sobre la autoría del código), etc.
<img>. Que hace referencia a imágenes y suele estar acompañado de la ruta en donde ésta se
encuentra.
<a>. Para introducir hipervínculos tanto internos como externos, mediante el atributo href y la
dirección URL adonde el hipervínculo conducirá.
<div>. Para introducir divisiones dentro de la página web.
¿Cuáles son las etiquetas HTML básicas?
Hay una serie de etiquetas que son las más usadas para crear cualquier documento HTML, a
continuación las explicamos:
<body> para el contenido
<head> para información sobre el documento
<div> división dentro del contenido
<a> para enlaces
<strong> para poner el texto en negrita
<br> para saltos de línea
<H1>…<H6> para títulos dentro del contenido
<img> para añadir imágenes al documento
<ol> para listas ordenadas, <ul> para listas desordenadas, <li> para elementos dentro de la lista
<p> para parágrafos
<span> para estilos de una parte del texto
<body> </body>
Indica la parte del cuerpo del contenido de un documento HTML. Es una etiqueta esencial para
cualquier documento ya que indica donde empieza el contenido visible del documento.
<head></head>
La parte superior del documento HTML, es donde podremos indicar los metadatos: título del
documento, hojas de estilos, javaScript, CSS…
<div> </div>
Un elemento que es usado mayoritariamente para agrupar otros elementos y actuar como
plantilla de otros controles. La etiqueta <div> nos ayuda a estructurar el documento en
secciones.
<a> </a>
Es una etiqueta que nos ayuda a poder crear un enlace a una página web. El atributo principal
de la etiqueta HTML es href, donde pondremos el enlace al que queremos conectar. Otro
atributo muy usado es target, el cual nos sirve para indicar si el enlace se abrirá en una nueva
ventana o en la misma.
Ejemplo HTML:
Pulsa <a href=”[Link] target=”_blank”>aquí</a> para visitar
DonDominio.
<strong> </strong>
Si tienes mucho texto, es importante poder dar énfasis a una parte en concreto, con la etiqueta
strong lo podemos hacer.
Ejemplo HTML:
Quiero destacar solo <strong>esta palabra</strong>.
<br>
Con esta etiqueta HTML le podemos decir al navegador que viene un salto de línea. Nos sirve
para hacer el texto más leíble.
<H1> </H1> …. <H6> </H6>
Hay diferentes niveles de títulos, del 1 al 6. Las etiquetas <H + número> nos permiten indicar la
importancia del título y para estructurar el contenido, de esta forma ayudamos a los bots a
entender la importancia del contenido.
<IMG> </IMG>
Usamos la etiqueta IMG para mostrar imágenes dentro del contenido. Necesita el atributo src
para funcionar, ya que será donde indicaremos desde donde tiene que mostrar la imagen.
<OL> <li></li> <OL> | <UL> <li></li> <UL>
Las etiquetas OL y LI nos sirven para crear listas, OL para listas ordenadas y UL para listas sin
orden. Dentro de las listas, los elementos se identifican con la etiqueta LI.
Ejemplo HTML:
<ul>
<li>Primer elemento</li>
<li>Segundo elemento</li>
<ul>
<P> </P>
Etiqueta que nos sirve para agrupar texto dentro de un parágrafo. El propósito es poder hacer
el contenido más fácil de leer y organizado.
<SPAN> </SPAN>
Con la etiqueta podemos personalizar el estilo de solamente una parte del texto.
Ejemplo HTML:
Solo <span style=”color: red;”>esta palabra</span> en rojo.
Ventajas y desventajas del HTML
Como todo lenguaje informático, el HTML tiene sus ventajas y sus desventajas. Entre las
ventajas, podríamos destacar que es apto para principiantes, que tiene una curva de
aprendizaje poco profunda y que es accesible. Además, es de código abierto y completamente
gratuito y se ejecuta de forma nativa en todos los navegadores web.
Por otro lado, entre las desventajas, se encuentra que para una funcionalidad dinámica es
posible que haya que utilizar JavaScript o un lenguaje back-end como PHP. Además, los
usuarios deben crear páginas web individuales para HTML, incluso si los elementos son los
mismos y es posible que los navegadores más antiguos no muestren las etiquetas más nuevas.
Qué son los comentarios en HTML?
Los comentarios en HTML son fragmentos dentro del código que no siempre tienen que
cumplir una función de programación en el sitio web. Se trata de indicaciones, anotaciones u
observaciones para tener en cuenta a medida que vas diseñando tu sitio web, sin que estos
fragmentos estén visibles dentro del navegador.
La seccion de comentarios en html puede parecer trivial, pero cuando lleves meses trabajando
en el diseño de una página y te veas obligado a volver sobre un área especifica del código, te
resultará de gran ayuda. Esto es especialmente importante en lenguajes de programación
«reales», teniendo en cuenta que HTML es un lenguaje de marcado.
¿Cómo añadir comentarios en HTML?
La estructura básica, los codigos html para añadir un comentario en HTML son poner «<!––«,
seguido de tu comentario; luego, cierras con «––>«. Cabe mencionar que para comentar en
otros lenguajes la estructura es distinta. También ten en cuenta que puedes realizar
comentarios que tengan una extensión de más de una línea si añades el cierre de comentario
como harías normalmente.
<!– comentario html5 –>
<!– Esto es un comentario –>
¿Qué es un blog?
Un blog es un sitio web o parte de un sitio más amplio en el que se incluye un registro web o
un diario en línea. Suele mostrar la información en orden cronológico inverso, es decir, el
contenido más reciente aparece primero.
¿Qué es Blogging?
El término «blogging» hace referencia al proceso de gestión de un blog, desde la generación de
ideas hasta la publicación. Incluye las tareas necesarias para gestionar un blog, como escribir
una entrada, promocionarla y realizar estrategias de link-building.
En algunos casos, los blogueros también escriben entradas para otros blogs, conocidas como
guest posts, para establecer autoridad y ampliar sus redes.
¿Qué es un bloguero?
Un bloguero es el propietario del blog o la persona que lo mantiene y dirige. Los blogueros
también fomentan las relaciones con sus lectores y otros blogueros alentando las
conversaciones en línea en la sección de comentarios.
¿Para qué sirve un blog?
Cuando surgieron los blogs, la gente los utilizaba principalmente para compartir información
personal, como sus experiencias e intereses. Por ejemplo, el acuñador del término weblog,
Jorn Barger, solía publicar ensayos sobre la cultura de Internet y las tendencias tecnológicas en
su sitio web Robot Wisdom.
La función de un blog sigue siendo la misma hasta hoy, aunque el tipo de contenido es mucho
más diverso. Mientras que muchos empiezan un blog por motivos personales, otros lo hacen
para educar a otros en un tema específico o para construir una presencia profesional en línea.
La diferencia entre un blog y una página web
En esta sección hablaremos de qué es un blog y en qué se diferencia de un sitio web típico.
Un blog sirve para presentar nuevos contenidos periódicamente, mientras que una página web
proporciona información estática sobre una persona, un grupo o un tema.
Utilicemos el sitio web de la empresa Reedsy como ejemplo.
El contenido principal consiste en páginas que informan a los visitantes sobre los servicios de
redacción y edición de la empresa. Esta información puede permanecer sin cambios durante
mucho tiempo, a menos que haya que actualizarla.
Mientras tanto, en la sección del blog se añaden nuevas entradas cada pocos días para educar
a los lectores sobre la escritura y la edición de libros. Por lo general, el blog se actualiza con
más frecuencia que el sitio web de la empresa.
Diferencia entre un blog y una página web
Los blogs son páginas web, pero no todas las páginas web son blogs. Estos últimos operan
como bitácoras adaptables, mientras que las páginas web pueden tener un propósito
cualquiera: e-commerces, salones de chat, portales de servicios, portales de videojuegos, entre
muchos otros.
Por otro lado, muchas páginas web ofrecen contenido estático, que varía poco, y tienen una
sección para el blog, en donde se encuentran las entradas en continua actualización, es decir,
su propia bitácora a través de la cual dirigirse a su público.
Tipos de blogs
Existen muchos tipos de blogs, dependiendo del uso que se les quiera dar. Podemos realizar
una pequeña clasificación, atendiendo a sus temáticas. Así tenemos:
Audioblogs: Dedicados a las galerías de ficheros de audio.
Fotoblogs: Dedicados a las galerías de imágenes.
Videoblogs: Dedicados a las galerías de ficheros de video.
Moblogs: Dedicados a los blogs actualizables desde el teléfono móvil.
¿Cómo crear un blog por medio de Blogger?
Vamos al paso a paso de cómo crear un blog en Blogger:
Accede a [Link] y haz clic en “crear tu blog” para hacer login en Blogger a partir de tu
cuenta Google o Gmail.
Escoge tu nombre de perfil, y enseguida, haz clic en “continuar para Blogger”.
Lee los términos de uso y entra a “crear nuevo blog”.
Escoge el nombre del blog, la URL, el tema (el único de los tres que puede ser modificado
después) e ingresa en “crear un blog”.
En caso de que quieras comprar un dominio propio, Google Domains ofrece esta opción. De lo
contrario basta hacer clic en “no, gracias”.
¡Listo! En este punto ya el blog está creado y solo tienes que acceder a “nueva publicación”
para publicar el primer contenido.
¿Qué es el mantenimiento del sitio web?
El mantenimiento del sitio web es el proceso de mantener un sitio web actualizado y
funcionando sin problemas, así como con un rendimiento óptimo. El mantenimiento del sitio
web incluye tareas como garantizar que todos los enlaces de tu sitio funcionen, actualizar
regularmente el contenido y corregir cualquier enlace roto. También implica tareas de limpieza
más generales, como hacer copias de seguridad del sitio con frecuencia y supervisar su
rendimiento.
Tarea
- Ventajas y desventajas de un blog
- como actualizar contenido de paginas web