B. Estructura y navegabilidad

Sitio: Aula Virtual de Formación en línea (ISMIE)
Curso: (C24) Espacios web y recursos educativos EducaMadrid
Libro: B. Estructura y navegabilidad
Imprimido por: Invitado
Día: sábado, 27 de abril de 2024, 19:05

Descripción

Aquetectura de la información. Navegabilidad web

B. Estructura y navegabilidad

Una vez que dominamos la creación de contenidos con el editor Scribe, es el momento de plantearnos cómo vamos a hacerlos visibles en nuestro espacio web y cómo vamos a organizarlos.

En el mundo del diseño web, para referirse a los procesos relacionados con la organización de los contenidos, para que puedan ser utilizados de forma eficaz por los usuarios y localizados mediante búsquedas en Internet, se habla de Arquitectura de la Información (AI).

En este capítulo nos centraremos en la organización de los contenidos en nuestro espacio web, es decir hablaremos de cómo crear la estructura de nuestro espacio y de los elementos que nos ofrece el portal EducaMadrid para facilitar la navegación a través de las diferentes páginas y contenidos que decidamos crear. Es decir que hablaremos de la usabilidad y la navegabilidad de los espacios web.

En el siguiente capítulo nos centraremos en la localización de los recursos creados a través de búsquedas en Internet. Es decir hablaremos del Posicionamiento de las páginas en los buscadores y de las herramientas que nos permiten valorar qué contenidos se consultan más.

Para saber más ...

Podéis ampliar información sobre Arquitectura de la Información desde estos enlaces:

1. Accesibilidad, usabilidad y navegabilidad

Cuando un usuario no experto se plantea crear una página web, suele tener clara una cosa: qué contenidos quiere poner en la web. No suele tener tan claro cómo los va a organizar para que su consulta pueda realizarse de una manera eficaz (tardar el mínimo tiempo posible en acceder a ellos, que estén organizados seguiendo alguna pauta lógica, que sea fácil avanzar y retroceder en su consulta, etc.). Y casi nunca se plantea si será posible que todos los usuarios puedan acceder a la información independientemente de sus capacidades físicas o del contexto en que acceda a la información.

 

Antes de revisar los contenidos relacionados con la creación de la estructura de navegación de nuestro sitio web, conviene que tengamos claros tres conceptos importantes, que nos servirán para plantearnos cómo vamos a organizar nuestra páginas y cómo vamos a hacer visibles nuestros contenidos dentro de ellas: accesibilidad, usabilidad y navegabilidad.

  • La Accesibilidad está relacionada con la posibilidad de acceso de los usuarios a una página web independientemente de si tienen algún tipo de discapacidad física (visual, auditiva, motriz o cognitiva) o no. Y de la tecnología utilizada (sistema operativo, navegador, plugins, etc.).
    • Con la expresión "Usabilidad de los sitios web", se hace referencia a la facilidad de uso, es decir, al grado en el que el diseño del sitio facilita o dificulta su manejo.
      • La Navegabilidad es la facilidad para desplazarse por las páginas que componen un sitio web, proporcionando a los usuarios los elementos de navegación que le ayuden a orientarse y que le faciliten la localización de la información.

        Vamos a ver a continuación cómo se definen con más detalle estos tres conceptos en la Wikipedia.

        Después nos centraremos en las pautas para el diseño de la estructura de nuestro sitio web y los elementos que el portal Educamadrid nos ofrece para facilitar la navegabilidad en nuestro sitio.

        1.1. Accesibilidad web

        De Wikipedia, la enciclopedia libre

        Handicap reverse blue background.svg

        La accesibilidad web se refiere a la capacidad de acceso a la Web y a sus contenidos por todas las personas independientemente de la discapacidad (física, intelectual o técnica) que presenten o de las que se deriven del contexto de uso (tecnológicas o ambientales). Esta cualidad está íntimamente relacionada con la usabilidad.

        Cuando los sitios web están diseñados pensando en la accesibilidad, todos los usuarios pueden acceder en condiciones de igualdad a los contenidos. Por ejemplo, cuando un sitio tiene un código XHTML semánticamente correcto, se proporciona un texto equivalente alternativo a las imágenes y a los enlaces se les da un nombre significativo, esto permite a los usuarios ciegos utilizar lectores de pantalla o líneas Braille para acceder a los contenidos. Cuando los vídeos disponen de subtítulos, los usuarios con dificultades auditivas podrán entenderlos plenamente. Si los contenidos están escritos en un lenguaje sencillo e ilustrados con diagramas y animaciones, los usuarios con dislexia o problemas de aprendizaje están en mejores condiciones de entenderlos.

        Si el tamaño del texto es lo suficientemente grande, los usuarios con problemas visuales puedan leerlo sin dificultad. De igual modo, el tamaño de los botones o las áreas activas adecuado puede facilitar su uso a los usuarios que no pueden controlar el ratón con precisión. Si se evitan las acciones que dependan de un dispositivo concreto (pulsar una tecla, hacer clic con el ratón) el usuario podrá escoger el dispositivo que más le convenga.

        [...]

        Limitaciones

        Las limitaciones en la accesibilidad de los sitios Web pueden ser:

        • Visuales: En sus distintos grados, desde la baja visión a la ceguera total, además de problemas para distinguir colores (Daltonismo).
        • Motrices: Dificultad o la imposibilidad de usar las manos, incluidos temblores, lentitud muscular, etc, debido a enfermedades como el Parkinson, distrofia muscular, parálisis cerebral, amputaciones...
        • Auditivas: Sordera o deficiencias auditivas.
        • Cognitivas: Dificultades de aprendizaje (dislexia, discalculia, etc) o discapacidades cognitivas que afecten a la memoria, la atención, las habilidades lógicas, etc.

        Ayudas técnicas

        Las siguientes son algunas de las tecnologías que usan los usuarios discapacitados para navegar de la web:

        • Un programa lector de pantalla, que puede leer usando síntesis de voz, los elementos que se muestran en el monitor (de gran ayuda para los usuarios con dificultades de aprendizaje o lectura), o que puede leer todo lo que está pasando en el PC (utilizado por los usuarios ciegos y de visión reducida).
        • líneas Braille, que consiste en dispositivo hardware que convierte el texto en caracteres Braille.
        • Un programa magnificador de pantalla que amplía lo que se muestra en el monitor de la computadora, haciéndolo más fácil de leer para los usuarios de visión reducida.

        Pautas de accesibilidad Web

        El máximo organismo dentro de la jerarquía de Internet que se encarga de promover la accesibilidad es el World Wide Web Consortium (W3C), en especial su grupo de trabajo Web Accessibility Initiative (WAI). En 1999 el WAI publicó la versión 1.0 de sus pautas de accesibilidad Web. Con el paso del tiempo se han convertido en un referente internacionalmente aceptado. En diciembre del 2008 las WCAG 2.0 fueron aprobadas como recomendación oficial.

        Estas pautas se dividen en tres bloques:

        Pautas de Accesibilidad al Contenido en la Web (WCAG)Están dirigidas a los webmasters e indican cómo hacer que los contenidos del sitio Web sean accesibles.Pautas de Accesibilidad para Herramientas de Autor (ATAG)Están dirigidas a los desarrolladores del software que usan los webmasters, para que estos programas faciliten la creación de sitios accesibles.Pautas de Accesibilidad para Agentes de Usuario (UAAG)Están dirigidas a los desarrolladores de Agentes de usuario (navegadores y similares), para que estos programas faciliten a todos los usuarios el acceso a los sitios Web.

        Beneficios

        Los principales beneficios que ofrece la accesibilidad web.

        • Aumenta el número de potenciales visitantes de la página web: esta es una razón muy importante para una empresa que pretenda captar nuevos clientes. Cuando una página web es accesible no presenta barreras que dificulten su acceso, independientemente de las condiciones del usuario. Una página web que cumple los estándares es más probable que se visualice correctamente en cualquier dispositivo con cualquier navegador.
        • Disminuye los costes de desarrollo y mantenimiento: aunque inicialmente aprender a hacer una página web accesible supone un coste (igual que supone un coste aprender a utilizar cualquier tecnología nueva), una vez se tienen los conocimientos, el coste de desarrollar y mantener una página web accesible es menor que frente a una no accesible, ya que una página web accesible es una página bien hecha, menos propensa a contener errores y más sencilla de actualizar.
        • Reduce el tiempo de carga de las páginas web y la carga del servidor web: al separar el contenido de la información sobre la presentación de una página web mediante CSS se logra reducir el tamaño de las páginas web y, por tanto, se reduce el tiempo de carga de las páginas web.
        [...]
        Elaborado a partir de "http://es.wikipedia.org/wiki/Accesibilidad_web" [Consultado el 06/11/2010]

        Ampliar información

        Se puede ampliar información sobre Accesibilidad en la página W3C.org:

        1.2. Usabilidad

        De Wikipedia, la enciclopedia libre

        La usabilidad (del inglés usability) es la facilidad con que las personas pueden utilizar una herramienta particular o cualquier otro objeto fabricado por humanos con el fin de alcanzar un objetivo concreto. [...]

        En interacción persona-ordenador, la usabilidad se refiere a la claridad y la elegancia con que se diseña la interacción con un programa de ordenador o un sitio web.

        [...]

        En informática, la usabilidad está muy relacionada con la accesibilidad, hasta el punto de que algunos expertos consideran que una forma parte de la otra o viceversa. Uno de estos expertos y gurú de la usabilidad en los entornos web es Jakob Nielsen, quien definió la usabilidad en el 2003 como "un atributo de calidad que mide lo fáciles de usar que son las interfaces web".

        [...]

        Opiniones de Jakob Nielsen

        Jakob Nielsen, considerado el padre de la Usabilidad, la definió como el atributo de calidad que mide lo fáciles de usar que son las interfaces web. Es decir un sitio web usable es aquél en el que los usuarios pueden interactuar de la forma más fácil, cómoda, segura e inteligente posible.

        No sólo la tecnología y el aspecto gráfico son factores determinantes para hacer un sitio web llamativo. Es importante que cumpla con las siguientes características:

        • Entendible
        • Novedoso
        • Comprensible
        • Inteligente
        • Atractivo

        Es decir, la finalidad, en este caso de un sitio web, es lograr que el usuario encuentre lo que busca en el menor tiempo posible.

        La Usabilidad de un sitio web está determinada por la claridad de su estructura y de sus contenidos, cuanto más cercanos estén al usuario, mejor es la navegación por el mismo y más acertada será la experiencia al enfrentarse a la pantalla.

        Lógicamente es imposible crear un sitio web ciento por ciento perfecto, pues no se puede agradar al mismo tiempo a todos los usuarios, sin embargo, los diseñadores y creadores deben tratar de mostrar todos los elementos de una manera clara y concisa, minimizando el número de clics y de scroll.

        [...]

        Aunque no hay estándares definidos para la Usabilidad, depende en cierta forma del espacio donde se desenvuelve el navegante. Pero lo importante en este caso es que el usuario no se deje consumir ni dominar por el sitio, es decir que sea él mismo que tome el control de la navegación por medio de un aprendizaje sencillo y el dominio de los elementos necesarios, para encontrar finalmente y en el menor tiempo posible, lo que busca.

        [..]

        Un error recurrente de los creadores y diseñadores de sitios Web, es querer imponer sus decisiones y criterios sin pensar en el usuario. Por eso en el momento de diseñar el sitio e introducir contenidos es importante pensar en el otro.

        [...]

        Referencias

        Elaborado a partir de "http://es.wikipedia.org/wiki/Usabilidad" [Consultado el 6/11/2007]

        1.2.1 Jackob Nielsen

        De Wikipedia, la enciclopedia libre

        Jakob Nielsen
        Jakob Nielsen 1.jpg

        Jakob Nielsen (nacido el 5 de octubre de 1957, en Copenhague, Dinamarca) es una de las personas más respetadas en el ámbito mundial sobre usabilidad en la web.

        Su trayectoria se inició en 1997 cuando escribió dos breves artículos sobre cómo preparar los textos. Los títulos de estos artículos fueron ¡Sea breve! (escribir para la web) y Cómo leen los usuarios en la web. Las ideas de los artículos de Nielsen se citan en muchos otros artículos que ofrecen pautas sobre cómo escribir para la web y mejorar su usabilidad.

        Sus teorías son

        Nielsen expone que lo habitual es que un usuario no lea con detalle ni siquiera una mínima parte de los textos de una página web. En su lugar, y por economía de tiempo, el usuario se limita a ojear la página. Es decir, el usuario realiza un rápido barrido visual de cada página buscando elementos que llamen su atención. Por tanto es fundamental la utilización de elementos como:

        • Palabras resaltadas mediante negrita y cambios de color o de tamaño. En este sentido los hipervínculos actúan como elementos de atracción visual pues se destacan del resto del texto.
        • Listas de elementos con viñetas o numeradas.
        • Títulos de sección y titulares breves intercalados (también llamados 'ladillos').

        Debido a esta economía de lectura, según Nielsen, el contenido de un texto debe organizarse correctamente para ganar la atención del lector. Por ejemplo las ideas más importantes deben aparecer al principio, y luego la argumentación de la misma. De esta forma, nos aseguramos de que el posible lector recuerde mejor la información. Nielsen recomienda usar menos del 50% del texto usado habitualmente en una publicación escrita. Los usuarios se aburren con los textos largos. Los párrafos deben ser cortos, de dos o tres frases únicamente y muy directos en su estilo.

        Por otro lado, asegura que los usuarios aprenden pronto a ignorar los mensajes publicitarios exagerados, incluso cuando intentan aparecer como información objetiva camuflados en el texto.

        Enlaces externos

        1.3. Navegabilidad

        De Wikipedia, la enciclopedia libre.

        La navegabilidad o navegabilidad web es la facilidad con la que un usuario puede desplazarse por todas las páginas que componen un sitio web. Para lograr este objetivo, un sitio web debe proporcionar un conjunto de recursos y estrategias de navegación diseñados para conseguir un resultado óptimo en la localización de la información y en la orientación para el usuario.

        Las interfaces de navegación tienen que ayudar a los usuarios a responder a tres preguntas fundamentales relacionadas con la navegación:

        • ¿Dónde estoy?
        • ¿Dónde he estado?
        • ¿Dónde puedo ir?

        [...]

        Enlaces externos

        Obtenido de "http://es.wikipedia.org/wiki/Navegabilidad_web" [Consultado el 6/11/2007]

        2. Estructura y navegabilidad de la web

        De la lectura de los apartados anteriores se desprende que en el diseño y organización de un sitio web conviene tener en cuenta una serie de pautas que faciliten a los usuarios su consulta.
        Algunas de estas pautas están directamente relacionadas con los contenidos creados y depende de nosotros, como administradores y creadores de dichos contenidos, que sean accesibles y usables.

         
        Web centro
         
         
         
        Otras de las recomendaciones antes apuntadas están relacionadas con la estructura del espacio web, su organización y los elementos que faciliten al usuario la orientación y el fácil acceso a los contenidos.

        En este apartado vamos a centrarnos en este último aspecto, es decir, en el desarrollo de la estructura de nuestro espacio web y más concretamente en los elementos que facilitan la navegabilidad.

         
        En el curso de Introducción al portal EducaMadrid se vio ya cómo crear la estructura de nuestro sitio web usando la opción de administrar páginas. Por eso, no volveremos a contar aquí cómo añadir páginas a nuestro sitio web, qué tipos de páginas podemos añadir y cómo organizarlas en secciones y subsecciones.

        Si necesitáis repasar esta información encontraréis en este bloque de contenidos un documento de apoyo en el que se explica cómo realizar estas tareas.

         

        2.1. El menú de navegación

        El menú de navegación es la herramienta que los usuarios utilizan en primer lugar para hacerse una idea de la estructura y de los contenidos del sitio web que están visitando. Por ello deberemos poner un interés especial en que esté bien organizado y en que sea de fácil manejo.

        Como sabemos, en los sitios web del portal EducaMadrid el menú de navegación se va creando según agregamos páginas a los sitios desde el menú "Administración">"Administracion de este sitio web">"Páginas".

        Páginas

        Las páginas del primer nivel, que aquí llamamos también secciones o páginas-sección, son las que aparecerán como enlaces en el menú de navegación.

        El usuario se hará una primera idea de qué va a encontrar y cómo está organizado el sitio repasando los enlaces a estas secciones, por ello es conveniente que meditemos bien sobre el orden en que van a aparecer estos enlaces y sobre el nombre o título que vamos a ponerles. Conviene en este sentido:

        1. Que los títulos de los enlaces sean cortos y significativos.
        2. Que las secciones aparezcan ordenadas siguiendo algún tipo de criterio: que aparezcan antes las que tienen una mayor importancia; que aparezcan ordenadas siguiendo un orden lógico, ... Si usamos un menú de navegación horizontal es conveniente que estas secciones estén situadas más a la izquierda. Si usamos un menú de navegación vertical, estas secciones deberían estar situadas en la parte superior de menú.

         

        Menú navegación

         

        Cuando añadimos páginas que dependen de una página-sección, es decir subsecciones, estas sólo se muestran al pasar el ratón por el menú de navegación, mediante menús desplegables. EducaMadrid nos permite crear una estructura de secciones y subsecciones tan compleja como necesitemos.

         

        menú de navegación con cuatro niveles.

         

         

        Esta posibilidad, que puede parecernos inicialmente muy útil, puede convertirse en una desventaja si abusamos de ella, principalmente porque la visibilidad de las secciones depende el movimiento del ratón. En cuanto el usuario desenfoque el puntero del ratón, el menú desaparecerá y tendrá que volver a desplegar el menú de subsecciones hasta llegar a la página que le interesa. Si creamos una estructura muy compleja de secciones y subsecciones anidadas es posible que en vez de facilitar la navegación a los usuarios se la compliquemos.

        En el caso de desarrollar un sitio web con muchas páginas anidadas en diferentes secciones y subsecciones parece recomendable usar las herramienas que EducaMadrid pone a nuestra disposición para simplicar la estructura de navegación por nuestras páginas, que veremos a continuación.

        2.2. Simplificar la estructura del menú de navegación

        Si como decíamos anteriormente nuestro sitio web tiene una estructura compleja porque está constituido por muchas páginas agrupadas en secciones y subsecciones parece conveniente, para facilitar la navegabilidad, usar otros recursos diferentes al menú de navegación y además usar elementos que ubiquen claramente al usuario dentro de nuestro sitio web.

        Según añadimos páginas podemos llegar a tener un menú tan complejo como el de la imagen siguiente:

         

        menu de navegación con cuatro niveles

         

         

        Posiblemente nos interese tener un menú de navegación más simple y poder ofrecer a los usuarios el acceso al resto de páginas mediante otros medios.

         

        menú de navegación de dos niveles

         

        Para conseguir que no todas las páginas aparezcan en nuestro menú de navegación lo que deberemos hacer es ocultar aquellas páginas que no queremos que se vean (a partir de cierto nivel, porque son páginas de acceso restringido,...).

        La posibilidad de ocultar páginas se realiza también desde la opción "Páginas" del menú Administración. Bastará con ir a la página que queremos ocultar y seleccionar la opción "Ocultar en el menú de navegación" y guardar los cambios.

        Ocultar del menú

        Una vez que hemos ocultado las páginas para simplificar el menú de navegación tenemos varias opciones para que el usuario pueda llegar a ellas.

        1. Podemos crear enlaces a las páginas ocultas dentro de nuestros contenidos, para ello debemos saber la dirección URL de esas páginas. Dicha URL la podemos ver, e incluso modificar, cuando creamos cada página.

          URL amigable
        2. Pero si lo que queremos es crear un menú de navegación secundario dentro de la página-sección que nos lleve a las páginas ocultas podemos recurrir al porlet "Mapa del web" que se puede configurar para que nos muestre las páginas ocultas y sólo de una sección concreta.

          mapa del web para mostrar secciones ocultas


          Veremos cómo configurar el porlet "Mapa del web" para hacer esto un poco más adelante.

        3. Navegar por nuestra web

        Una vez que hemos definido la estructura de páginas que vamos a utilizar en nuestra web, tendremos ya el principal elemento para facilitar la navegación, la barra o menú de navegación que se crea automáticamente según vamos añadiendo páginas a nuestra Web.

        El menú de navegación aparecerá en horizontal, debajo de la cabecera de la página...

         

        Menú navegación

        Además de este menú, el gestor de contenidos de EducaMadrid nos ofrece la posibilidad de disponer de otros elementos de navegación que ayuden al usuario a situarse o a encontrar los contenidos de nuestro sitio web.

        Si nuestro sitio tiene una estructura compleja, o si estamos usando secciones ocultas, hacer uso de estos elementos facilitará a los usuarios la navegación por nuestras páginas. Los elementos a los que nos referimos son: El camino de migas (que podemos añadir al definir la apariencia de las páginas o como porlet en algunas páginas), el recurso "Mapa del web" y el recurso "Navegación".

         

        Recursos navegación

         

        Aunque la finalidad principal de estos tres elementos es la apuntada arriba, ubicar al visitante y ofrecerle una forma sencilla de navegar por nuestra páginas, sus características no son exactamente las mismas. Resumimos en el siguiente cuadro sus semejanzas y diferencias

        Características Camino de migas Navegación Mapa del Web
        Disposición en
        la página
        Horizontal, Vertical Vertical Vertical
        Modo de intergrase en la página
        Porlet / Desde la apariencia
        de página
        Porlet Porlet
        Funciones principales
        Ubicar al usuario, acceso rápido a páginas de nivel superior Acceso rápido a otras secciones superiores o inferiores, ubicar al usuario Mostrar la estructura jerarquizada de todo el sitio web o de algunas de sus partes, ubicar al usuario
        Admite configuración
        Prácticamente, no
        Puede configurarse
        para mostrar secciones o páginas ocultas
        --- Si
        Admite cambio de apariencia Si se integra desde Porlet, sí
        Admite archivar configuración para restaurar en otra páginas Desde porlet, Sí. Integrado desde la configuración de páginas no es necesario

         

        A continuación describiremos cómo integrar estos tres elementos en nuesta Web.

        3.1. Rastro de migas

        Recibe el nombre de "Rastro de migas", "Camino de migas" o "Breadcrumb" el conjunto de enlaces dispuestos en horizontal que aparecen en las páginas web para indicarnos dónde nos encontramos y de qué otras páginas depende la página en la que estamos.

        Camino migasIntegrar un rastro de migas en nuestras páginas facilita la navegabilidad a través de las mismas y la usabilidad por dos razones: está formado por enlaces a otras páginas y por tanto nos sirve para pasar de unas a otras fácilmente; y nos ayuda a orientarnos dentro de la web que estamos visitando porque nos indica, de izquierda a derecha, el orden o jerarquía de una páginas con respecto a otras.

        Con las herramientas del portal EducaMadrid es posible integrar un rastro de migas en nuestras páginas, sin más que indicarlo desde desde la administración de páginas a través del diseñador web.

        El rastro de migas aparecerá ubicado en la parte superior izquierda de nuestras páginas y existe la posibilidad de configurar su apariencia y podremos insertar un camino de migas en páginas de tipo porlet, panel y web insertada.

        Vamos a ver a continuación cómo integrar un rastro de migas en nuestras páginas.

        Guardar

        Guardar

        Guardar

        3.1.1. Integrar un rastro de migas

        Supongamos que queremos integrar un rastro de migas en un conjunto de páginas que ya hemos creado para facilitar la navegabilidad de nuestro sitio web.

        Para ello procederemos del siguiente modo.

        1. Nos situamos en el sitio web en el que queremos integrar el rastro de migas y desde el menú "Editar" pulsamos sobre el enlace al "Diseñador web"

        Diseñador web

        2. En la pestaña "Cabecera" podremos configurar el rastro de migas (apartado "Buscador y rastro de migas").

         

        Rastro de migas

         

        Tenemos varias posibilidades que nos permitirán darle un aspecto personalizado al rastro de migas, cambiando por ejemplo el color de Enlaces o de Enlaces sobre (color que se muestra al situarnos con el cursor encima del enlace)

        Por defecto, el rastro de migas aparece incorporado en los distintos espacios web de EducaMadrid. Si quisiéramos ocultarlo bastaría con marcar la opción "Ocultar el rastro de migas".

        Guardar

        Guardar

        3.2. Mapa Web

        Un mapa del Web es una lista ordenada y jerarquizada de enlaces. Esta herramienta permite que el usuario tenga acceso a todas las secciones de la web de manera directa y, al mismo tiempo, le informa de cómo están organizadas y relacionadas todas las secciones existentes en un sitio web. Al igual que el Camino de migas es un elemento que facilita al visitante la navegabilidad.

        Mapa web

        Insertar Mapa del web

        Para insertar este recurso, nos situaremos en la sección concreta donde queramos ubicarlo y posteriormente pulsaremos sobre el menú "Añadir" para desplegar el menú de opciones y seleccionamos "Mapa web" dentro del apartado "Otros":

         

        Mapa web

         


        En la página nos aparecerá el mapa del web.

        Mapa web

         

        Configurar Mapa del web

        Para configurar el recurso bastará con pulsar sobre la rueda de tuerca y seleccionar Configuración:

        Mapa web

        Hecho esto nos aparecerá la siguiente pantalla:

        Mapa web

        Desde esta pantalla podremos configurar diferentes aspectos del mapa del web. Si nuestro sitio web tiene una gran cantidad de páginas organizadas en diferentes secciones y subsecciones y también tenemos páginas o secciones ocultas, las diferentes opciones de configuración del mapa del web pueden resultarnos especialmente valiosas, comentaremos aquí las que nos parecen más interesantes:

        • Disposición de la página raíz: esta opción nos permite seleccionar a partir de qué sección de la página web queremos que se muestre.

        Disposición página raíz

         

        • Mostrar profundidad. Nos permite seleccionar hasta qué nivel de jerarquía se mostrarán las páginas en la lista del mapa del web.
        Mostrar profundidad

         

         

        • Incluír el elemento raíz en el árbol: Si marcamos esta opción, el mapa web se mostrará desde la página de inicio.
        • Mostrar la página actual: al seleccionar esta opción, en el mapa aparecerá reflejada la ubicación de esta sección.
        • Usar el título HTML: en el mapa del web aparecerá el título html que le hayamos asignado a la sección.
        • Mostrar páginas ocultas: si dejamos seleccionada esta opción las secciones que tengamos ocultas serán visibles en el mapa web.

         

        Configuración mapa web

         

        ---------
        Para más información consultar la página de ayuda sobre la configuración del Mapa Web
         

        3.3. Recurso Navegación

        El recurso "Navegación" muestra un menú que nos permite navegar por las páginas/secciones del sitio web en el que nos encontramos en un momento determinado.

        Haciendo click en los vínculos podremos movernos por estos espacios de información. Este recurso nos ayudará a saber dónde estamos y dónde podemos ir.

        Se diferencia del "Rastro de migas" en que el recurso "Navegación" muestra vínculos a todas las secciones y distintos niveles de subsecciones existentes en el espacio web.

        Las diferencias con el "Mapa del web" son casi inexistentes. Por ejemplo, el recurso "Navegación" nos indica en qué pagina o en qué sección estamos resaltando en negrita su título, mientras que el "Mapa del web" no contempla esta opción. 

        Navegación


        Como con cualquier otro recurso su estilo y aspecto pueden ser ajustados. 

         
        Navegación 

         

        Podremos definir la configuración de nuestro recurso al tiempo que podremos acceder a una Vista previa del mismo:

         

        Configuración navegación
         
         

        Estilo de presentación

        Desde aquí podremos seleccionar los diferentes estilos con los que queremos presentar nuestro recurso.

        Para ello tendremos que desplegar el menús de estilos y seleccionar uno de ellos:

         

        Estilo presentación

         

        A continuación vemos la Vista previa del recurso. Si el estilo de presentación es el deseado pulsaremos en Guardar:

         

        Estilo presentación

         

        Estilo de viñeta

        La aplicación por defecto asigna una viñeta diferente a cada nivel de página, sin posibilidad de modificarla.

         

        Estilo de viñeta

         

        Estilo personalizado

        Dentro de las opciones de estilo, destacamos el estilo personalizado ya que nos va a permitir configurar el recurso más a nuestra medida:

         

        Estilo personalizado

        Cabecera:

        Tenemos cuatro posibles opciones para mostrar la cabecera del recurso:

        • Ninguno: Muestra el árbol de navegación pero no muestra nada como cabecera del recurso.
        • Título del recurso: Muestra como cabecera del recurso el título que le hayamos dado al propio recurso.
        • Disposición de la página raíz: Muestra como cabecera del recurso el nombre de la sección principal de la que depende la subsección dónde estamos situados.
        • Camino de migas: Muestra el nivel de profundidad de la sección/subsección en que nos encontramos.

         

        Cabecera

         

        Disposición de la página raíz

        Desde aquí podremos definir cual va a ser la página de referencia del recurso Navegación.

        Disposición página raíz

         

         

        Tenemos dos opciones:

        • Página padre en nivel: esta opción nos permitirá seleccionar desde qué nivel queremos mostrar el menú de navegación.

        Por ejemplo:

        1. Si seleccionamos el nivel "0", el menú de navegación nos mostrará todas las páginas que se encuentran en el nivel principal:

         

        Navegación

         

        2. Si seleccionamos el nivel "1" nos mostrará aquellas páginas que dependen la página principal en la que nos encontramos:

         

        navegación

         

        • Página padre subiendo: similar a la opción anterior, sólo que desde aquí seleccionamos qué niveles superiores a la página en la que nos encontramos queremos mostrar:

        Por ejemplo :

        1. Si seleccionamos el nivel "0" únicamente nos mostrará las páginas que dependen de la página principal en la que nos encontramos (no mostrará un enlace a la página en la que estamos).

         

        navegación
        2. Si seleccionamos el nivel "1" nos mostrará el nombre de la página en la que nos encontramos así como el resto de las páginas que dependen de ella así como aquellas páginas que se encuentren al mismo nivel.

         

        navegación

         

         

        Páginas incluidas

        Esta opción nos permitirá seleccionar que páginas queremos mostrar en el menú de navegación:

         

        Páginas incluidas

        Tenemos dos opciones:

        • Automático: nos mostrará el nombre de la página en la que hayamos incorporado el recuso y las páginas de un nivel por debajo de la misma, así como las páginas que estén al mismo nivel donde hayamos incluido el recurso.

        Ejemplo:

        navegación

         

        • Todas: mostrará todas las páginas que se encuentren en el mismo nivel que la página en la que hayamos incorporado el recurso, así como las páginas que dependan de cada una de ellas.

        Ejemplo:

        navegación

         

        Subpáginas jerarquizadas

        Desde aquí vamos a poder configurar el recurso de tal manera que el menú de navegación muestre de manera diferenciada las páginas principales de las que dependen de ellas.

        Subpáginas jerarquizadas

        Veamos las dos opciones:

        Si                                       No 

        Navegación

         

        Para más información consultar la página de la ayuda sobre el Recurso de Navegación 

        Guardar

        4. Páginas en construcción

        Cuando un usuario se toma la molestia de visitar una página web, lo último que espera encontrar es esto:

         

        under construction


        Posiblemente el usuario no volverá a visitar nuestro sitio.

        Mientras construimos nuestro sitio web dentro de EducaMadrid, podemos recurrir a diferentes "trucos" para que el usuario no se lleve la impresión de que nuestras páginas están incompletas o no se han elaborado todavía.

        1. El modo más sencillo de evitar que los usuarios vean nuestras páginas mientras las estamos diseñando, o si no están del todo acabadas, es marcarlas como ocultas y no ofrecer ningún medio de los que hemos visto para poder acceder a ellas.

          Ocultar

        2. También podemos restringir los permisos de acceso al contenido de la página a los usuarios mientras la estamos diseñando. De este modo el contenido no será visible para los usuarios.

          Permisos


          De estos dos modos conseguiremos que nuestra página no aparezca en el menú de navegación.

        Licencia y autoría

        Licencia

        Licencia de Creative Commons
        Esta obra está bajo una licencia de Creative Commons Reconocimiento-NoComercial-CompartirIgual 4.0 Internacional.

        Autoría del curso

        • Cristina García Bustamante
        • Francisca García Bernal