← Diseño web desde cero

SEO básico antes de publicar.

Una web no solo debe verse bien. También debe ayudar a los buscadores y a las personas a entender claramente su contenido. En esta lección aprenderás los fundamentos del SEO que conviene revisar antes de publicar.

Nivel · Principiante Tiempo · 25–35 min Ruta · Diseño web

01

¿Qué es el SEO?

SEO significa Search Engine Optimization, u optimización para motores de búsqueda.

Consiste en mejorar diferentes aspectos de una web para facilitar que los buscadores comprendan su contenido y para ofrecer una buena experiencia a las personas que la visitan.

El SEO no consiste en repetir palabras clave muchas veces. Empieza creando contenido útil, claro y bien organizado.

02

Escribe un buen title.

Dentro del `head` de cada página encontramos la etiqueta title.

<title>Diseño web para pequeños negocios | Mi Estudio</title>

El título debe describir de forma clara el contenido principal de esa página.

Evita títulos genéricos como:

<title>Página web</title>
Cada página importante debería tener un título propio relacionado con su contenido.

03

Añade una meta description.

La meta description ofrece una breve descripción del contenido de la página.

<meta name="description"
content="Diseño y desarrollo de páginas web claras, responsive y profesionales para pequeños negocios.">

Los buscadores pueden utilizar esta información al presentar una página en sus resultados, aunque no siempre muestran exactamente el texto que has escrito.

Intenta que la descripción sea específica y útil para comprender qué encontrará el visitante.

04

Utiliza encabezados con una estructura lógica.

Los encabezados ayudan a organizar el contenido.

<h1>Diseño web para pequeños negocios</h1>

<h2>Servicios</h2>

<h3>Página web corporativa</h3>

<h3>Landing page</h3>

El `h1` representa normalmente el encabezado principal del contenido de la página.

Los `h2` organizan las secciones principales y los `h3` pueden utilizarse para subsecciones.

Elige los encabezados por la estructura del contenido, no únicamente por el tamaño visual que tienen.

05

Crea contenido útil y específico.

Los buscadores necesitan contenido para comprender de qué trata una página.

Pero ese contenido debe escribirse principalmente para las personas.

01

Explica claramente qué ofreces.

02

Responde preguntas reales de tus visitantes.

03

Utiliza títulos descriptivos.

04

Evita contenido creado solamente para repetir palabras clave.

06

Utiliza URLs sencillas.

Los nombres de los archivos también forman parte de la dirección de una página.

Por ejemplo:

miproyecto.com/servicios.html

es más claro que algo como:

miproyecto.com/pagina-final-23-nueva.html

Utiliza nombres breves, descriptivos y consistentes.

07

Optimiza las imágenes.

Las imágenes demasiado pesadas pueden hacer que una página tarde más en cargar.

01

Reduce las dimensiones si son innecesariamente grandes.

02

Comprime los archivos.

03

Utiliza formatos adecuados.

04

Utiliza nombres de archivo descriptivos.

Por ejemplo:

diseno-web-cafeteria.jpg

es más comprensible que:

IMG_4827.jpg

08

Utiliza correctamente el atributo alt.

Como vimos anteriormente, `alt` proporciona una alternativa textual cuando una imagen transmite información.

<img
  src="images/web-cafeteria.jpg"
  alt="Página web de una cafetería con menú y sistema de reservas"
>

Describe la imagen de acuerdo con su función y contexto.

No llenes el atributo alt de palabras clave. Su finalidad principal es la accesibilidad y transmitir la información relevante de la imagen.

09

Conecta tus páginas con enlaces internos.

Los enlaces internos ayudan a los visitantes a descubrir otras partes de tu web.

<a href="servicios.html">Ver servicios de diseño web</a>

Utiliza textos de enlace que expliquen el destino cuando sea posible.

Una estructura de navegación clara también facilita que los buscadores descubran las páginas del sitio.

10

Tu web debe funcionar en móvil.

El diseño responsive que aprendiste en la Lección 07 también es importante antes de publicar.

Comprueba:

01

Que el texto pueda leerse cómodamente.

02

Que los botones sean fáciles de utilizar.

03

Que las imágenes no salgan de la pantalla.

04

Que el menú funcione correctamente.

05

Que no exista desplazamiento horizontal accidental.

11

Evita enlaces rotos y páginas 404.

Antes de publicar, prueba todos los enlaces importantes.

Si escribes:

<a href="contacto.html">Contacto</a>

debe existir realmente un archivo llamado:

contacto.html

Un enlace roto perjudica tanto la experiencia del visitante como la calidad general del sitio.

12

SEO es un proceso continuo.

Publicar una web no significa que el trabajo SEO haya terminado.

Con el tiempo puedes mejorar contenidos, añadir nuevas páginas, corregir problemas técnicos y estudiar qué información resulta más útil para tus visitantes.

No necesitas dominar SEO para publicar tu primera web. Empieza con una estructura sólida, contenido útil y una página técnicamente cuidada.

Lo que has aprendido.

  • Qué significa SEO.
  • Cómo escribir un title descriptivo.
  • Para qué sirve la meta description.
  • Cómo organizar h1, h2 y h3.
  • Por qué el contenido debe ser útil para las personas.
  • Cómo utilizar nombres de página claros.
  • Por qué debemos optimizar las imágenes.
  • Cómo utilizar correctamente el atributo alt.
  • La importancia de los enlaces internos.
  • Por qué debemos revisar la versión móvil.
  • Por qué debemos evitar enlaces rotos.
  • Por qué SEO continúa después de publicar.

Haz una revisión SEO de tu proyecto.

Abre todas las páginas de la web que has creado durante esta ruta.

  1. Revisa el title de cada página.
  2. Añade una meta description diferente cuando corresponda.
  3. Comprueba la estructura de encabezados.
  4. Revisa los nombres de tus archivos HTML.
  5. Optimiza las imágenes.
  6. Comprueba los atributos alt.
  7. Revisa los enlaces internos.
  8. Prueba la web en móvil.
  9. Comprueba que no existan enlaces rotos.
No intentes introducir palabras clave de forma artificial. Una página clara, útil, accesible y bien estructurada es una base mucho mejor.

LECCIÓN ANTERIOR

← 10 · Conecta tu propio dominio