Como organizar una página web. Diseño de la estructura

Actualizado el 27/06/2007 < > 17 Cometarios

Resumen: Ideas básicas para crear una estructura para tu web efectiva y usable que llegue a más visitantes

Meneame Bitacoras

Llegados a este punto necesita definir la organización de la información de tu sitio web. Es decir, ha llegado el momento de crear la estructura de tu web, su esqueleto, la base que soportará todo lo demás. La forma en que estructures el contenido de tu web será determinante para que los usuarios encuentren o no lo que buscan (algo muy relacionado con la usabilidad). Por tanto, ésta debe facilitar y agilizar al máximo la búsqueda de información de tus visitantes. Al mismo tiempo, también es importante diseñar la estructura de forma que actualizaciones futuras de la web no obliguen a cambiar muchas partes de la página.

Para crear la estructura, puede ser útil hacer un inventario de todo el material que vas a exponer en la página e ir organizándolo en un primero momento por temas para después construir gráficamente la estructura de la web.

Organizar web

Aunque poca gente lo hace, es muy útil construir varios prototipos (o bocetos) de tu web y probar la reacción de los usuarios ante ellos. Esto de comprobar la reacción parece más complicado de lo que crees, pero un método casero y sencillo que puede aportar información para saber si la estructura del sitio es fácil de comprender y manejar, es hacer varias plantillas con diferentes estructuras y pedir a amigos y familiares que naveguen por ellas y nos den su impresión. Cuál les resulta más fácil de entender, más atractiva, en cuál se encuentra mejor una determinada información, en cuál están más claros los contenidos a los que dirigen los enlaces, etc.

Página de inicio

La página de inicio es la principal puerta de entrada de visitas a tu página, por lo que debe poder atrapar al mayor número de visitantes que entren. Para ello, debes adaptar su estructura a tu público objetivo, haciendo bien visibles los contenidos que más pueden interesarles. También es importante dejar claro desde el principio el tema de la web, y para eso la página de inicio es una buena herramienta. Especifica claramente qué se va a encontrar el usuario al explorar tu página, a la gente no le gusta perder el tiempo y a ti no te interesan visitas de este tipo porque no aportan ningún beneficio a tu web.

Por otro lado, algo tan sencillo como incluir un enlace bien visible a la página principal en todas tus páginas facilita muchísimo la navegación. En este sentido, algo que se usa mucho y también ayuda a los usuarios a navegar por tu web es poner un enlace en el banner o logo de la cabecera que apunte a la página principal del sitio.

Diseño del menú de navegación

Una de las cosas más importantes a la hora de estructurar la página es el diseño del menú de navegación.

Echa un vistazo a la estructura inicial que creaste, ¿cuáles son las secciones más grandes?, ¿cuáles agrupan más contenido?, esas pueden ser las secciones que incluyas en el menú principal y que sería conveniente que aparecieran en cada página de tu web para facilitar la navegación. Ahora bien, una vez dentro de cada sección concreta, el menú puede modificarse para mostrar las opciones específicas que ofrece esa sección (además de enlaces a las secciones principales).

No hay que olvidar que otro tipo de páginas como información acerca de la web, aviso legal, política de privacidad, formulario de contacto, etc, deben estar convenientemente visibles, por lo que muchas páginas optan por incluir un menú horizontal a pie de página para enlazar con estas secciones.

Tipos de estructuras de sitios web

Ya se han comentado en este tutorial los principales tipos de estructuras que se usan en la web, si te interesa puedes echarle un vistazo al artículo:

Meneame Bitacoras

Publicado el 27/06/2007, última actualización 27/06/2007.

Licencia: Eres libre de distribuir este artículo bajo los términos de la licencia creative commons, siempre que pongas claramente el siguiente texto en la página que publica el artículo (enlaces activos incluidos):

Autor: Verónica M.

URL: Como organizar una página web

Añadir Comentario (Subir al texto)

17 Cometarios

  1. Sistema de navegación de la página web :: LaWebera.es

    [...] buen sistema de navegación es imprescindible en toda página web. Es una parte importante de la organización de la estructura de la web. Que el usuario sea capaz de moverse con soltura y facilidad por las distintas páginas del sitio, [...]

    Jueves, 20 de diciembre 2007

  2. margot

    dberia de ser mas fasilitado ,me refiero a un lexico mas a la altura de lla gente comun

    Lunes, 9 de junio 2008

  3. rollingeyes

    -> Margot: ¬_¬
    El contenido está muy claro y me gustó mucho la explicación, gracias.

    Viernes, 18 de julio 2008

  4. Primeros pasos para aprender a hacer una página web :: LaWebera.es

    [...] Es conveniente que dibujemos un organigrama con todas las partes del sitio web, distribuyendo el texto, los gráficos, los vínculos a otros documentos y otros objetos multimedia que se consideren pertinentes, mediante el cual ir creando la estructura de la página web. Antes de empezar a desarrollar tu página web en el ordenador, debes tener muy claro cuáles serán sus contenidos, su estructura, el nombre de la página, etc. cosas que no se deben hacer sobre la marcha para evitar rectificaciones innecesarias, trabajo inútil y pérdidas de tiempo. Hay varias maneras de estructurar el contenido de una web: [...]

    Jueves, 1 de octubre 2009

  5. Diseño de la navegación de una página web :: LaWebera.es

    [...] autores entienden que el área de navegación sirve para indicar al usuario “dónde esta” y a “dónde puede ir” y por [...]

    Martes, 6 de octubre 2009

  6. Leonel

    Buena pagina, felicitaciones por su aniversario (aunque no los conozco) je je…

    Miércoles, 14 de octubre 2009

  7. Pasos iniciales para crear una pagina web

    [...] 2 o 3 bocetos (más es desaconsejable) con el diseño y distribución del contenido de la información en una plantilla. Esto pondrá a prueba la usabilidad del [...]

    Miércoles, 28 de octubre 2009

  8. Ejemplo de estructura de una página HTML

    [...] Las siguientes etiquetas HTML se utilizan para construir la estructura básica de una web: [...]

    Domingo, 3 de enero 2010

  9. Beneficios de la usabilidad web

    [...] en cuenta desde los primeros momentos del diseño y desarrollo web de un sitio. En el momento de organizar los cotenidos de la web es importante pensar en la usabilidad, te aportará beneficios [...]

    Lunes, 1 de febrero 2010

  10. jimmy

    hola que tal saludos me gustaria poner en mi pagina web una seccion de comentarios como esta, es para mi tesis porfa ayuda se lo agradesere muchisisisiismo plis ayuda

    Miércoles, 3 de febrero 2010

  11. Diseño de la interfase web: diseño de la información

    [...] enormemente la tarea de las personas que acceden a ellos. Dado que las características de las páginas web son diferentes, estas informaciones tienen otras [...]

    Lunes, 15 de febrero 2010

  12. Diseño visual de una página web

    [...] Los diseños excesivamente llenos de elementos, con fondos cargados o con bajos contrastes, pueden dificultar el establecimiento de puntos de referencia visual que hagan comprensible la organización del contenido. [...]

    Miércoles, 17 de marzo 2010

  13. carolina

    muy útil su enlace.muchas gracias!

    Jueves, 3 de junio 2010

  14. Crear tabs o pestañas con jQuery y CSS – Estructurando el contenido de una página web

    [...] uso de tabs o pestañas, es una buena forma de estructurar la información de una página web de forma clara y diferenciada, ayudando al usuario a distinguir grupos de contenidos, así como los [...]

    Jueves, 10 de junio 2010

  15. Utilización de la repetición y posición de fondos en la maquetación de páginas web

    [...] los mismos, sobre todo porque colaboran generando efectos visuales que hacen posible distinguir la estructura del documento o bien como forma de establecer contraste, o simplemente como parte del [...]

    Viernes, 2 de julio 2010

  16. Fases del diseño Web, usuarios satisfechos

    [...] a través de la estructura web que se vinculan las distintas páginas de su portal, a través de enlaces que permitirán [...]

    Lunes, 28 de febrero 2011

  17. leoevil666

    margot ,Primero aprende a escribir , luego trata de diseñar , luego vení a criticar

    Genial explicación en estos niveles de diseño es donde se comienza a notar la verdadera casta de campeones

    Viernes, 3 de junio 2011

(Subir al texto)

Añadir Comentario

* Campos obligatorios