conceptos de diseño web

✴ Conceptos básicos de Diseño Web

Cuando hablamos de páginas web, usualmente usamos conceptos muy técnicos para referirnos a cosas bastante básicas. Aquí te explico los primeros conceptos básicos de diseño Web que son importantes para entender una página Web.

Conceptos básicos de Diseño Web

Arquitectura web: es el orden de todas las secciones, páginas y contenido de toda la página. Se basa en montar un sistema que coincida con todas las páginas interiores y cómo navegar entre las páginas. Por ejemplo, en nuestra portada, webnetcreativa.com.es tenemos acceso a los servicios, desde los servicios tenemos acceso al formulario de contacto. Algunos conceptos claves para entender la Arquitectura Web son la Taxonomía Web y la Ontología Web. La primera se refiere a los distintos términos que dividen a un sitio web. Y la segunda se refiere a las relaciones que mantienen las diferentes taxonomías de la web, las cuales, por lo general, van conformadas por los enlaces internos insertados en los posts. La arquitectura web también tiene en cuenta el diseño de la interfaz de usuario, el diseño de la aplicación y la arquitectura de la información.

La Estructura: es el conjunto de formas que vemos en la pantalla para transmitir la idea o concepto de la web. Al final, es diseño. Si tiene un diseño muy minimalista, la estructura suele ser simple. La repetición es una estructura de uso común donde los usuarios se sienten cómodos teniendo el logotipo en la parte superior izquierda, el menú de navegación en la parte superior derecha y luego el contenido.

Usabilidad: es la facilidad de navegar por la página Web. Es el arte del usuario encontrar fácilmente lo que está buscando. El ejemplo con el logotipo en la parte superior izquierda, (donde comenzamos a leer), es la primera impresión que tiene el usuario de que está en una web. Encontrar el menú de navegación a continuación (en la parte superior derecha), lo ayuda a saber qué puede hacer. Cuando el usuario se pierde en una página web y no sabe dónde está o cómo ir a otra página, significa que la usabilidad de la página no es muy precisa.

Plantilla web: la plantilla es la estructura gráfica que tiene una página web. Los gestores de contenido, (CMS – content management system), usan plantillas para presentar contenido de una forma u otra. Las plantillas se pueden comprar y solo necesitas completar el contenido que las plantilla te ofrecen. En la instalación del gestor de contenidos WordPress, puedes adquirir un tema y usar también una plantilla. Esta plantilla define lo que sucede en cada sitio (logotipo, imágenes, textos), qué estructura tiene (2 columnas, 3 columnas, etc.) y qué estilos se pueden usar (texto motivado, estilo en negrita, con sombras, entre otros) .

Header o Encabezado: El encabezado es la cabecera de la página Web. Al igual que con los documentos en papel, normalmente tienen una cabecera igual en todas las páginas. En este encabezado, los elementos obligatorios son el logotipo para que el usuario sepa quiénes somos, el menú para navegar, forma de contacto, normalmente el teléfono y las banderas de la página si esta cuenta con varios idiomas. Como opción podemos agregar un eslogan o información de los perfiles en redes sociales.

Footer o Pie de página: El pie de página es otro espacio que se repite en todos los lados de la Web. En este caso debajo de todo. Se puede usar para diferentes cosas, pero básicamente para dar al usuario más opciones y información. Podemos encontrar menús de navegación para que después de consumir contenido, el usuario pueda encontrar otros contenidos distintos. Muchas veces también agregamos información de contacto para que el cliente una vez esté convencido pueda contactarnos. Debido al Reglamento General de Protección de Datos, RGPD que es de obligación, también se proporciona un enlace a estos términos y avisos legales.

Responsive: Uno de los Conceptos básicos de Diseño Web es la palabra Responsive. La traducción literal sería Adaptativo y se refiere a la página web que se adapta a todos los dispositivos. Antiguamente solo se podían consultar páginas web desde computadoras. Actualmente, se puede acceder al mismo sitio desde una computadora, un televisor inteligente, un teléfono móvil, una tableta y nuevos dispositivos que siguen apareciendo. No es lo mismo presentar una información en una TV que se puede ver tranquilamente en 4 columnas, que en un teléfono móvil en el que solo vemos una columna. Programar una página Web para que el sitio «se ajuste» al dispositivo se llama Responsive.

Para esta programación también se usa el término Responsive Web Design. Se trata de usar HTML y CSS para redimensionar, ocultar, reducir o ampliar automáticamente un sitio web. Para que, como mencionamos anteriormente, se vea bien en todos los dispositivos, (computadoras de escritorio, tabletas y teléfonos móviles).

Conceptos básicos de Diseño Web
Nota: ¡Una página web debería verse bien en 
cualquier dispositivo!

¿Tiene tu web un diseño Responsive? ¿Tiene tu Web una buena arquitectura web?

Contéstanos a estas pequeñas cuestiones, nos encantará conocer tu respuesta. Si tienes cualquier duda, escríbenos desde nuestro formulario de contacto o bien envíanos un Whatsapp.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *