7 elementos esenciales de SEO que todos los diseñadores web deben saber

Publicado: 2017-09-05

Los diseñadores web y los expertos en SEO tienden a chocar.

¿Por qué?

Porque, si bien estos dos elementos son absolutamente esenciales para cualquier sitio web, a veces funcionan uno contra el otro.

Mientras que los diseñadores se enfocan en brindar al usuario una excelente experiencia visual, los expertos en SEO se preocupan por brindar a los motores de búsqueda una vista realista del sitio.

Sin diseño, un sitio web es subestimado. Pero sin SEO, ni siquiera un sitio web maravillosamente diseñado será encontrado por los lectores.

diseño por volante SEO esencial portátil en el escritorio con la página web de Google abierta y libros, bolígrafos y dispositivo móvil

¿Hay alguna manera de reparar el conflicto?

En este artículo, voy a sumergirme en siete formas en que los diseñadores pueden ayudar en el proceso de optimización de motores de búsqueda en cualquier sitio web. Aprenderá qué elementos de diseño son importantes para el SEO y algunos consejos interesantes que harán felices tanto a los diseñadores web como a los expertos en SEO con el resultado final.

1. Deja que los motores de búsqueda “lean” tus imágenes

Una de las partes más importantes del diseño web es agregar imágenes para dividir el texto. Google, sin embargo, no ve esas imágenes de la misma manera que las personas.

La etiqueta HTML <img> le dirá al motor de búsqueda que hay una imagen. Sin embargo, el contenido real de la imagen es ilegible para los robots de los motores de búsqueda.

Entonces, ¿cómo podemos dejar que el motor de búsqueda “lea” esa imagen?

El WordPress Media Manager nos da la posibilidad de cambiar el título y el texto alternativo de cualquier imagen que utilicemos.

Todo lo que tiene que hacer es hacer clic en el Administrador de medios, seleccionar la imagen que desea optimizar y agregar un título y texto alternativo . Esto cambia el código HTML y agrega palabras que los robots de los motores de búsqueda pueden leer.

¿Quiere agregar medios a sus sitios web? ¡Aprende a crear una galería de videos de WordPress con este tutorial!

Por ejemplo, supongamos que agregué una imagen de la Torre Eiffel en una publicación sobre París. Como texto alternativo, podría agregar "Torre Eiffel en París". Ahora los motores de búsqueda no solo saben que hay una imagen, sino también de qué se trata esa imagen.

Esto ayuda al SEO para esa página y también permite que la imagen aparezca en un tipo adicional de búsqueda: una búsqueda de imágenes.

2. Asegúrate de estar optimizado para el acceso móvil

El año pasado, el uso de la web móvil en realidad superó el uso de la web de escritorio. Eso significa que cada vez más personas usan teléfonos inteligentes y tabletas para navegar por Internet. Como resultado, los motores de búsqueda ven más favorablemente los sitios web que se adaptan al uso móvil.

Como diseñador web, ahora es más importante que nunca saber cómo hacer que sus diseños sean compatibles con dispositivos móviles.

diseño de flywheel SEO essentials mujer con café helado en el teléfono móvil

Según Google, hay dos formas aceptables de hacer que su sitio web sea compatible con dispositivos móviles: diseño web receptivo y servicio dinámico. Ambos permiten que la URL permanezca igual, mientras que el sitio se adapta automáticamente al navegador móvil del usuario.

Para mantenerse optimizado para dispositivos móviles, también es importante evitar el video Flash en el contenido principal de su sitio. Todos sabemos que Flash está pasando de moda, pero evitar esta forma moribunda de video es muy importante cuando está optimizando para uso móvil.

3. Use fuentes web y HTML para crear diseños rastreables

Mencioné antes que usar etiquetas alt es una excelente manera de permitir que los motores de búsqueda "lean" imágenes, pero ¿qué sucede si sus imágenes tienen texto? ¿Y si ese texto es demasiado grande para la etiqueta alt?

¡Aquí vienen las fuentes web al rescate! Si está diseñando pancartas o imágenes con texto, incluir fuentes web de sitios web como Fonts.com o Google permitirá que los robots de los motores de búsqueda puedan leer sus diseños.

También puede combinar estas fuentes web con HTML para asegurarse de que el texto de su diseño esté realmente "vivo". Al incluir elementos HTML como encabezados H1 o H2, texto en negrita, etc., los robots de rastreo aún pueden ver de qué se trata el gráfico. Cualquier palabra clave dentro de este texto será legible, y esto ayudará al SEO en la página.

4. Inserte un div expandible para combinar un diseño minimalista con contenido optimizado

Si está intrigado por el diseño minimalista pero no está seguro de cómo incluir texto para SEO en la página, ¡entonces escuche!

Supongamos que tiene un panel de imágenes de productos en una página web. Un gran diseño minimalista sería simplemente dejarlos como imágenes y usar etiquetas alt para decirles a los robots de los motores de búsqueda cuáles son las imágenes.

Adivina qué: tu experto en SEO todavía no está contento.

En lugar de simplemente usar etiquetas alt para insertar texto importante, intente colocar un div expandible para cada imagen. De esa manera, cuando haga clic en la imagen, se expandirá un <div> en la parte inferior, brindando espacio para contenido atractivo y rico en SEO que hará felices tanto a los usuarios como a los motores de búsqueda (¡sin mencionar a su experto en SEO!).

Este texto es totalmente rastreable por los motores de búsqueda. Sin embargo, dado que no es visible hasta que se hace clic en él, aún puede mantener su diseño minimalista.

diseño por flywheel SEO essentials man en el escritorio de Mac trabajando en código

5. Código con HTML5 y CSS3 para la función avanzada del sitio

Hay muchas ventajas diferentes al usar HTML5 y CSS3. Más específicos para los temas de hoy, estos dos lenguajes de marcado mejorados pueden tener un impacto definitivo en el SEO de una página web.

Si las páginas web que diseña no están bien estructuradas, cualquier otro esfuerzo de SEO básicamente se puede tirar por la ventana. El uso de HTML5 ayuda a que las páginas web estén bien estructuradas y semánticamente precisas, lo que conduce a una mejor clasificación en los motores de búsqueda.

Más que eso, ¡HTML5 es una herramienta fantástica para reemplazar el temido Flash! Además, puede ayudar a reducir la cantidad de código en cada página web, lo que facilita el rastreo de los bots.

¡Mira este excelente tutorial sobre cómo crear diseños 3D con la propiedad de transformación CSS3!

6. Optimice los diseños para una respuesta rápida

En 2010, Google anunció que incluiría la velocidad del sitio como parte de su algoritmo de clasificación. Desde entonces, la velocidad del sitio se ha vuelto cada vez más importante en SEO.

Entonces, ¿cómo pueden sus diseños hacer que su sitio web funcione rápido?

La clave está en encontrar el equilibrio entre la calidad de la imagen y el tamaño del archivo. Por supuesto, todos sabemos que los archivos más grandes tardan más en cargarse, por lo que desea que sus imágenes sean más pequeñas. Sin embargo, asegúrese de no comprometer la calidad.

Un consejo que puede ayudarlo a optimizar las imágenes para una respuesta rápida: asegúrese de no reducir el tamaño con HTML. En lugar de cargar una imagen más grande y cambiar el HTML para mostrarla en una resolución más pequeña, reduzca el tamaño de su imagen antes de cargarla. Esto ahorra ancho de banda y acelera el tiempo de respuesta.

(Solo una nota al margen: otra ventaja de usar HTML5 y CSS3 es que ayudan a acelerar el tiempo de respuesta del sitio web. ¡Otra razón más por la que son excelentes para SEO!)

7. Haz equipo con un gran creador de contenido

Si aún no lo ha hecho, este es uno de los mejores consejos para crear diseños compatibles con SEO. Contenido y diseño van de la mano. Trabajar en equipo con un creador de contenido de SEO le brinda una ventaja que otros pueden no tener. Su creador de contenido puede ayudarlo realizando una investigación de palabras clave, optimizando el contenido para las páginas web y brindándole consejos sobre el texto para incluir en sus diseños.

Durante años, Internet ha promocionado los beneficios del diseño de contenido primero, y esto se logra mejor cuando los creadores y diseñadores de contenido trabajan en equipo.

Conclusión

diseño por flywheel SEO essentials tablet en la mesa con gráficos analíticos y datos en pantalla

Diseñadores web: ¿estás listo para llevarte bien con los expertos en SEO? Después de leer este artículo, estará listo para proporcionar ideas amigables con SEO dentro de sus diseños que puedan hacer felices a todos.

Sin embargo, estos consejos sobre SEO son útiles para algo más que llevarse bien con un experto en SEO. Ser capaz de mejorar el SEO en la página con tus diseños te hará aún más valioso como diseñador.

Utilice estos consejos de SEO en sus diseños web, ¡y verá mejores resultados que nunca!

¿Listo para aprender algo nuevo? Mira estos artículos:

  • 3 razones por las que el alojamiento administrado de WordPress es perfecto para su negocio
  • La clave para administrar múltiples sitios de WordPress
  • La guía para principiantes de SEO básico y redacción de contenido en WordPress