fbpx

Los 7 conceptos básicos que debes conocer del diseño web

conceptos básicos de diseño webCuando se habla de páginas web normalmente se tiende a usar unos conceptos muy técnicos para referirnos a cosas bastante básicas. Aquí os explico los 1o conceptos básicos imprescindibles para entender el mundo web.

  1. Arquitectura web: es la ordenación de todas las secciones, páginas y contenidos de toda la página. Se basa en montar un sistema coherente con todas las páginas interiores y como se navega entre páginas. Por ejemplo, en la portada de www.taovisual.com tenemos acceso a los servicios, de los servicios tenemos acceso al formulario. Muchas webs tienen la sección Mapa web que es una parte de la arquitectura web donde se marcan todas las páginas que hay y la dependencia entre ellas. Ej . Servicios > Páginas web.
  2. Estructura: es el conjunto de formas que vemos en la pantalla para transmitir la idea o concepto de la web. En definitiva, es el diseño. Si tiene un diseño muy minimalista normalmente la estructura será simple. Por repetición, una estructura muy utilizada donde los usuarios se encuentran cómodo es tener arriba a la izquierda el logo, arriba a la derecha el menú de navegación y luego el contenido.
  3. Usabilidad: es la facilidad que tiene el usuario para navegar por la página. Es el arte de que el usuario encuentre fácilmente lo que busca. El ejemplo del logo arriba a la izquierda (por donde empezamos a leer) hace que el usuario sea la primera impresión que tiene de la página y ya se sitúe. Encontrar luego el menú de navegación le ayudará a saber que cosas puede hacer. Cuando el usuario se pierde dentro de una página web y no sabe ni donde está ni como ir a otro sitio, eso significa que la usabilidad de la página no es muy correcta.
  4. Plantilla web: La plantilla es la estructura gráfica que tiene una página web. Los gestores de contenido utilizan plantillas para presentar los contenidos de una forma o de otra. Las plantillas se pueden comprar y solo hace falta rellenar con contenido lo que te ofrece la plantilla. Tambiés se les llama temas. Y una plantilla define que va en cada sitio (logo, imágenes, textos) que estructura tiene ( 2 columnas, 3 columnas, etc.) y que estilos tiene (texto justificado, en negrita, con sombras, etc.).
  5. Header: Es la cabecera de la página web. Igual que en los documentos en papel, las páginas normalmente tienen una cabecera igual en todas las páginas. En esta cabecera los elementos casi obligados son el logo para que el usuario sepa quienes somos, el menú para navegar y las banderas si la página tiene varios idiomas. Opcionalmente podemos poner algún lema o datos de contacto, para evitar que se tenga que cargar toda la página para encontrar el teléfono.
  6. Footer: El pié de página. Es otro espacio que se repite en todas las páginas, en este caso debajo de todo. Se puede utilizar para varias cosas pero básicamente para darle más opciones al usuario. Podemos encontrar menús de navegación para que el usuario después de consumir un contenido pueda encontrar otros. Muchas veces también ponemos datos de contacto para que una vez convencido el cliente pueda contactar con nosotros. Por obligación de la Ley de Servicios de la Sociedad de la Información, más conocida como LSSI también se introduce un link a las Condiciones de uso de esta página web.
  7. Responsive: La traducción literal seria Adaptativo y se refiere a que la página web se adapte a cualquier dispositivo. Antiguamente las páginas web sólo las podías consultar desde ordenadores. Actualmente la misma página web se puede abrir desde un ordenador, un smart TV, un móvil, una tablet y siguen saliendo nuevos dispositivos. 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 de forma que la página web se «adapte» al dispositivo se llama Responsive.

Deja un comentario