Arquitectura Web: Qué es y consejos

Kiwop / Blog / Diseño y desarrollo web / Arquitectura Web: Qué es y consejos

A la hora de diseñar una página web, en Kiwop intervenimos diferentes departamentos de nuestra empresa para establecer la Arquitectura de un sitio web. En este artículo te explicaremos cómo hacemos el primer diseño preliminar de esta arquitectura.

Arquitectura Web

Para la arquitectura nos centraremos en el público objetivo, en los datos existentes y en cómo representaremos la información. Hacemos un estudio inicial de keywords. Después analizaremos los datos, creamos el usuario ideal y establecemos objetivos para el web. Todo esto lo hacemos siempre de la mano del Plan de Comunicación del proyecto.

Los diseñadores y desarrolladores también participan en esta fase. Nos ayudaremos de wireframes, sitemaps, diagramas de flujo y de estructura jerárquica, etc.

Proponemos una arquitectura web teniendo en cuenta tres factores:

  • que incluya toda la información
  • que sea fácil y accesible
  • que ayude al posicionamiento orgánico. Por el SEO, cada keyword importante tendrá su propia página dentro del web.

Usabilidad (UX)

Para el diseño de interacción nos centraremos en la simplificacióń de la navegación. El web será intuitivo, ofreciendo al usuario una navegación sencilla, rápida y efectiva. Nos centraremos en la User Experience (UX) y User Interface (UI).

Decidiremos qué recursos audiovisuales, textos, gráficos, menús o botones utilizaremos y como actuarán entre ellos (widgets, animaciones adicionales, mecanismos interactivos, bloques de página, etc…). Todo elemento tendrá un propósito específico y utilizaremos patrones de diseño reutilizables para mantener coherencia en todo el web.

Utilizaremos los contrastes adecuados entre elementos para captar la atención de los usuarios. Utilizaremos los colores para focalizar de forma efectiva su atencióń en elementos importantes o accionables.

Los elementos de texto (títulos, encabezamientos, párrafos, etc…) tendrán un diseño simple, amigable (user friendly) y entendedor para hacer fácil la lectura. Haremos uso de elementos visuales propios de CSS3 para hacer más dinámico el web.

Las imágenes no son solo un factor visual, juegan un papel muy importante en la usabilidad y la experiencia del usuario. La mayoría de los usuarios se mueven por el web siguiendo estímulos visuales, perciben más rápidamente las imágenes que los textos, por lo tanto, les daremos la importancia que se merecen.

Proponemos el uso de imágenes y videos de alta calidad que transmitan información, pero también emociones. Los utilizaremos por banners, imágenes destacadas, como fondos de secciones, etc…

Estos recursos seguirán unos patrones y filtros predeterminados. Se buscará que el web tenga una coherencia y consistencia gráfica uniforme.

El diseño será amplio, limpio y mostrará claridad. Nos aseguraremos que la información más importante se sitúe arriba y sea visible sin tener que desplazarse mediante scroll.

Los colores a tener en cuenta también tendrán un papel muy importante en la conceptualización del diseño web. Serán colores vivos que reflejen todos los objetivos marcados y la identidad corporativa.

Las dos disciplinas, arquitectura y diseño de interacción, están relacionadas y se tienen que conceptualizar de la mano. 

Diseño Web Responsive

La web se adaptará a las diferentes medidas y orientaciones de pantalla. Sea móvil, tableta o cualquier dispositivo futuro con medida de pantalla diferente.

Mobile First

El web no solo será responsive, sino que utilizaremos la filosofía del Mobile First a la hora de conceptualizar el web. Idearemos el diseño y la arquitectura teniendo en cuenta el móvil y posteriormente lo convertiremos a la versión de escritorio; de este modo podremos añadir otras funciones a medida que lo diseñamos para pantallas más grandes. Esto nos permitirá obtener unos resultados excelentes en la experiencia de usuario y facilidad de navegación.

Estructura

El responsive estará organizado de forma que todos los elementos importantes del web estén accesibles y que los usuarios encuentren fácilmente todo aquello que necesitan mediante una navegación fácil y sencilla. Los menús y la barra superior del móvil serán diferentes a los de la versión de escritorio.

Simplicidad

La claridad es el punto importante de cualquier interfaz, y mantener las cosas sencillas es clave en el diseño responsive. Los usuarios tienen que ver rápidamente donde se encuentra la información importante y qué posibles interacciones tienen disponibles.

Control

Los usuarios tienen mejor experiencia de usuario cuando tienen control sobre el web que visitan. Esto lo haremos eliminando interacciones no previstas, rutas confusas o resultados inesperados.

CTAs

Los Call to Action o llamadas a la acción también estarán optimizados y pensados para móvil.

Imágenes

Serán de buena calidad, pero optimizadas en medida y peso para no comprometer la velocidad del web. Estarán adaptadas en los dispositivos Retina (que utilizan el doble de píxeles).

Si quieres que sigamos explicando más detalles de cómo nos organizamos para el diseño y desarrollo web. ¡Háznoslo saber en los comentarios!

Queremos ayudarte a obtener resultados.

Deja un comentario

Queremos ayudarte a obtener resultados.
¿EMPEZAMOS?