Advertisement
  1. Web Design
  2. Workflow

Técnicas SEO en la fase de diseño: Antes de escribir ni una sola línea de código

Scroll to top
Read Time: 12 min

() translation by (you can also view the original English article)

La optimización para motores de búsqueda (SEO) es una disciplina calificada con frecuencia por muchos diseñadores web como algo misterioso y críptico… aún así, con tan solo unas pocas estrategias podrías transformar tus diseños de forma que impulsen extraordinariamente el SEO incluso antes de escribir ni una sola línea de código. Este artículo pretende desmitificar el SEO y te proporcionará algunos consejos que puedes implementar durante la fase de diseño de tu web.


Diseñar para la optimización en los motores de búsqueda

seo search engine optimization strategy secret designseo search engine optimization strategy secret designseo search engine optimization strategy secret design

La optimización para motores de búsqueda (SEO) ha revolucionado la industria del marketing y se ha convertido en una de las técnicas de marketing en Internet más importantes. Cada vez son más las empresas que intentan aprovechar los beneficios del SEO y eso significa que los diseñadores web deben empezar a pensar en las implicaciones que tiene para el diseño web la optimización en los motores de búsqueda.

Establecer una estrategia SEO básica durante el proceso de diseño es la mejor forma de 1) asegurarse que el sitio web obtendrá buenos resultados en lo relativo al posicionamiento y 2) asegurarse de que el propietario de la web no arruinará el diseño intentando implementar estas estrategias por sí mismo.

No hay nada peor que crear un bello diseño para un cliente y que a posteriori otros lo arruinen añadiendo elementos extra no previstos. Estar al corriente de lo que sucede en el sector del marketing online y de las últimas técnicas SEO te ayudará como diseñador web, ¡además logrará que tus webs luzcan estupendas!

Aquí abajo tienes algunas técnicas SEO "on-site" que usan habitualmente los especialistas para mejorar el posicionamiento en los motores de búsqueda. Recordando estas cosas, podrás diseñar una web fácil de optimizar al haber considerado todo de antemano mientras diseñas sus páginas.


Principales estrategias de diseño para mejorar el SEO


Estrategia 01: Un sistema de navegación claro

seo search engine optimization strategy secret designseo search engine optimization strategy secret designseo search engine optimization strategy secret design

Haz la jerarquía de tu navegación lo más clara y horizontal posible, es decir, con pocos niveles jerárquicos. Cuantas más subcategorías/carpetas tengas, o cuanto más profunda sea tu jerarquía, más complicado le resultará a los motores de búsqueda indexar todas tus páginas. Una jerarquía horizontal o plana ayuda a que los motores de búsqueda reconozcan como importantes un mayor número de páginas, y por consiguiente les concederán mayor peso en los rankings de búsqueda.

Muchos diseñadores sienten que no tienen control sobre la jerarquía de navegación cuando hablan con sus clientes… pero esto no tendría porque ser así. Los clientes saben que los diseñadores web son los expertos en estos temas, así que si les instruyes amablemente para que mantengan su estructura de navegación tan limpia y clara como sea posible, normalmente te escucharán.

El diseño de los menus navegación también es importante; usar imágenes en lugar de texto puede arruinar la capacidad que tienen los motores de búsqueda para rastrear tu sitio. La mayoría de los medios para sustituir imágenes (FLIR, SIFR, Cufon, CSS3, Incrustación de fuentes, etc.) son SEO friendly, así que no tienes porque limitarte al empleo de tipografías como la Arial o la Times New Roman. La clave está en diseñar teniendo en mente la "facilidad de uso". Evita la navegación anidada o el uso de elementos no habituales en las interfaces de usuario sin haberlo debatido antes con un desarrollador web.


Estrategia 02: Diseña tus títulos y subtítulos

seo search engine optimization strategy secret designseo search engine optimization strategy secret designseo search engine optimization strategy secret design
Con frecuencia es útil enviar una composición del diseño a un desarrollador para que indique cómo se debe introducir cada elemento de texto en el código, por ejemplo entre qué etiquetas.

Uno de los elementos más importantes de la optimización on-page consiste en redactar títulos y subtítulos con el objetivo de posicionar frases de búsqueda concretas. Las etiquetas que más usan los profesionales dedicados al SEO son h1, h2, etc. Cuando crees el diseño de una web SEO friendly, asegúrate de disponer de ubicaciones en cada una de las páginas para este tipo de etiquetas… y aplícales el estilo adecuado.

Es importante indicar todos estos elementos que compondrán la página al desarrollador, a no ser que estés creando el código tú mismo. Tomarse unos minutos para explicar qué etiquetas deberían usarse en cada título, h1 o h2, te puede ahorrar mucha frustración a largo plazo.

Puede que no seas capaz de controlar con qué grado de eficacia redactará estos títulos el propietario de la web al agregar su propio contenido, pero si diseñas disponiendo elementos h1 y h2 el la parte superior de la jerarquía del diseño asegura que tendrán mayores probabilidades de ser descubiertos por los motores de búsqueda una vez tu hayas finalizado el proyecto y haya transcurrido el tiempo.


Estrategia 03: Crea páginas de aterrizaje personalizadas

seo search engine optimization strategy secret designseo search engine optimization strategy secret designseo search engine optimization strategy secret design
Es frecuente que los sitios web incluyan páginas de aterrizaje o "landing pages" personalizadas para eventos o promociones concretas.

Entre los especialistas SEO y del marketing se suele decir que "el contenido es el rey". Para los motores de búsqueda una web sin  contenido apenas tiene valor. La mayoría de los estrategas dedicados al SEO quieren gran cantidad de contenido original en cada una de las páginas, y habitualmente crean muchas páginas de aterrizaje a medida con contenido personalizado y optimizado para posicionar distintas palabras clave. Es una excelente idea "diseñar una plantilla para una página de aterrizaje" en los proyectos que pretendan potenciar su posicionamiento en los motores de búsqueda.

Cuando diseñes tu página de aterrizaje, asegúrate de que cada página su descripción y que ésta tenga espacio para al menos un par de párrafos. De no ser así, el texto podría ser añadido más tarde con un aspecto forzado y fuera de lugar. Si diseñas la maquetación teniendo en mente el contenido, éste se integrará perfectamente y será útil tanto para los lectores como para los motores de búsqueda.


Estrategia 04: Técnicas SEO para imágenes

seo search engine optimization strategy secret designseo search engine optimization strategy secret designseo search engine optimization strategy secret design

Las imágenes pueden ser fuente de un gran volumen de tráfico y proporcionan a los profesionales SEO un medio para llevar a cabo optimización on-page. Cada página debería tener un espacio reservado para insertar una imagen, ésta a su vez debería funcionar reforzando el contexto o contenido. Las imágenes deberían tener nombres de archivo optimizados, etiquetas alt y títulos que incluyan la frase clave objetivo a posicionar.

Oh, un apunte más respecto a las imágenes: ¡si lo puedes evitar, nunca uses una imagen para reemplazar un texto! El texto dentro de una imagen es legible para los humanos que visitan tu web, pero los motores de búsqueda no lo verán. Siempre que sea posible acompaña las imágenes con un texto descriptivo para proporcionar pistas o información sobre la mismas a los motores de búsqueda.


Estrategia 05: Incluye enlaces internos

seo search engine optimization strategy secret designseo search engine optimization strategy secret designseo search engine optimization strategy secret design

La estrategia de creación de enlaces internos, también conocida como "deep linking", es una práctica común entre los especialistas SEO. No es algo crítico visualmente, sin embargo el sitio web podría acabar teniendo más enlaces en las páginas de los que esperabas. Por ejemplo, si el sitio web va a tener distintos niveles de categorías, los profesionales SEO sugieren que incluyas enlaces a todas las subcategorías en las páginas de cada categoría principal. La columna lateral o "sidebar" suele ser un buen lugar para colocar este tipo de "listas de enlaces", pero también es habitual añadir enlaces en el pié o "footer" de las páginas de aterrizaje relevantes para el SEO.

Estos enlaces son importantes para el SEO porque ayudan a que los motores de búsqueda entiendan de qué tratan las páginas. Las palabras o frases clave deberían usarse siempre que se creen enlaces internos hacia otras páginas.

En lo que toca al diseño: veo con frecuencia como los propietarios de webs intentan añadir estos elementos después de la fase de diseño… lo que suele dar como resultado feas y desubicadas listas de enlaces. Proporcionar una plantilla de diseño sencilla sería de gran ayuda en el caso de que los propietarios decidan en un futuro añadir este tipo de cosas, ¡evitará que arruinen todo tu arduo trabajo!


Estrategia 06: Diseña un mapa de sitio

seo search engine optimization strategy secret designseo search engine optimization strategy secret designseo search engine optimization strategy secret design

Cualquier sitio web debería tener un mapa del sitio o "sitemap" (también conocido como página de "archivo"). Estos sitemaps ayudan a los motores de búsqueda en el rastreo o indexación de tu web y facilitan a los usuarios la localización de contenido. Además de un documento XML, es importante contar con un sitemap HTML, especialmente en los sitios grandes.

Estas páginas de índice de contenidos o sitemaps te aportarán un beneficio extra, mejorarán la usabilidad de tu diseño. Navegar a través de sitios web grandes puede resultar en muchas ocasiones complicado, mucha gente usa los sitemaps para localizar aquello que están buscando. De manera que, cuando crees un sitio web es muy recomendable que hagas un diseño de página específico para el sitemap. Esta plantilla de diseño debería ser capaz de mostrar el 100% de los enlaces de forma organizada, por tanto, esfuérzate al máximo en crear un diseño organizado y fácil de usar.


Estrategia 07: Incorpora las redes sociales

seo search engine optimization strategy secret designseo search engine optimization strategy secret designseo search engine optimization strategy secret design

Las redes sociales constituyen un excelente y popular canal de marketing que tienen un gran impacto en el SEO. Los motores de búsqueda están empezando a usar la popularidad en las redes sociales como señal significativa para determinar la relevancia e importancia del contenido en Internet. Al integrar en tu diseño botones para compartir en redes sociales, podrías contribuir a aumentar el valor que conceden los motores de búsqueda a tu contenido. También es habitual colocar en algún sitio enlaces hacia tus principales cuentas o perfiles sociales, por ejemplo, Twitter, Facebook, etc. Cuanto más tráfico "social" genere un sitio web, mejor se posicionará en los motores de búsqueda.


Ejemplos de sitios web SEO friendly

Virgin.com

seo search engine optimization strategy secret designseo search engine optimization strategy secret designseo search engine optimization strategy secret design

La web de Virgin hace varias cosas especialmente bien desde el punto de vista del SEO. Incluyen enlaces internos dentro de sus menús de navegación desplegables, todos los títulos están creados con texto (no con imágenes u otros sustitutivos para el texto), e incluye un fantástico mapa del sitio que, aunque muy extenso, es fácil de explorar.


Wikipedia.org

seo search engine optimization strategy secret designseo search engine optimization strategy secret designseo search engine optimization strategy secret design

Aunque es muy posible que Wikipedia no gane ningún premio por su diseño, es un referente en lo concerniente al SEO ya que lo hacen verdaderamente bien. Wikipedia es el rey en cuanto a enlaces internos y creación de contenido. Tiene una cantidad increíble de contenido indexado (alrededor de 100.000.000 páginas) y la mayoría de las páginas se posicionan increíblemente bien en los motores de búsqueda debido en parte a los enlaces internos. Cada página de Wikipedia enlaza a otras dentro del mismo sitio, usando además en sus enlaces textos ricos en palabras clave, algo altamente positivo para el posicionamiento. Esto propicia que los usuarios permanezcan por más tiempo en el sitio web, les ayuda a descubrir más contenido relevante y mejorar el ranking de todas las páginas en el motor de búsqueda.


Bnet.com

seo search engine optimization strategy secret designseo search engine optimization strategy secret designseo search engine optimization strategy secret design

El sitio de Bnet es un excelente ejemplo de sitio que fusiona un excelente diseño con estrategias SEO. El estilo de su sistema de navegación es elegante y al mismo tiempo fácil de rastrear para los motores de búsqueda. El índice del sitio hace que sea muy sencillo encontrar gran variedad de contenidos. La característica más importante reside en los enlaces internos de las categorías. También tienen una optimización on-page muy sólida conseguida a través de cosas como los títulos de las páginas, los títulos dentro del contenido y las migas de pan, todo esto mejora el SEO on-page y los rankings.


eHow.com

seo search engine optimization strategy secret designseo search engine optimization strategy secret designseo search engine optimization strategy secret design

eHow es otro gigante en lo que respecta al volumen de contenido y cuenta con toneladas de páginas posicionadas en los primeros puestos del buscador. eHow se enorgullece de tener contenido extremadamente útil sobre prácticamente cualquier tema, contenido del tipo "cómo hacer…". La clave de su éxito reside no solo en la calidad de su contenido, sino también en la impresionante optimización del sitio. Tienen una estructura de navegación en la parte izquierda muy clara y óptima para el SEO que lista las categorías. Todas las subpáginas tienen un sistema de navegación SEO friendly en el lateral izquierdo, además muchas secciones que enlazan a contenido popular y relacionado sin importar en qué página te encuentres.

eHow también hace un gran uso de la navegación con jerarquía horizontal que hemos comentado con anterioridad. Todo su contenido está a un nivel por debajo de la carpeta raíz. De forma que todas sus categorías, subcategorías y páginas tienen una ruta con la siguiente estructura http://www.ehow.com/something/.


Reflexiones finales

Internet se está convirtiendo en un sistema cada vez más complejo, los propietarios de los sitios web quieren cada vez más características y elementos en sus webs. El problema es que todo el mundo quiere también sitios web claras y tan fáciles de usar como sea posible. Encontrar un equilibrio entre ambas aspiraciones puede ser complicado, la forma de salir victorioso es pensar con anticipación.

Muchos propietarios de sitios web tienen webs diseñadas sin saber qué dirección tomar o qué objetivos quieren cumplir con el SEO… por eso con frecuencia intentan añadir estrategias SEO una vez completado el diseño. Es fácil intuir cuando el propietario de un sitio ha procedido de esta forma, los widgets tienen un aspecto extraño y parecen estar fuera de lugar; los botones de redes sociales parecen haber sido dejados caer improvisadamente; los diseños de las plantillas tienen un aspecto desordenado y desestructurado. Establecer una estrategia SEO básica durante la fase de diseño es la mejor forma de 1) asegurarte de que la web tenga buenos resultados en los motores de búsqueda y 2) que el propietario del sitio web no destrozará tu diseño intentando añadir estas estrategias por sí mismo.

Descubre qué va a buscar la gente con anticipación para mejorar la visibilidad de esos contenidos o características en tu web, de manera que puedas concebir diseños creativos y atractivos que ofrezcan a su vez todas las funcionalidades y elementos que los propietarios de dichas webs deseen incluir.

¿Tienes tus propias estrategias o consejos sobre SEO? ¿Alguna duda sobre lo que hemos visto en este artículo? ¡Déjanos un comentario!

Advertisement
Did you find this post useful?
Want a weekly email summary?
Subscribe below and we’ll send you a weekly email summary of all new Web Design tutorials. Never miss out on learning about the next big thing.
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.