{"id":76344,"date":"2015-08-13T19:03:06","date_gmt":"2015-08-13T19:03:06","guid":{"rendered":"http:\/\/guia-diseno-web"},"modified":"2022-09-08T18:42:41","modified_gmt":"2022-09-08T18:42:41","slug":"guia-diseno-web","status":"publish","type":"post","link":"https:\/\/proyectos.comunicaciondigital.es\/en\/guia-diseno-web\/","title":{"rendered":"Gu\u00eda para el desarrollo de sitios web"},"content":{"rendered":"<p>[et_pb_section fb_built=\u00bb1&#8243; _builder_version=\u00bb4.16&#8243; global_colors_info=\u00bb{}\u00bb theme_builder_area=\u00bbpost_content\u00bb][et_pb_row _builder_version=\u00bb4.16&#8243; background_size=\u00bbinitial\u00bb background_position=\u00bbtop_left\u00bb background_repeat=\u00bbrepeat\u00bb global_colors_info=\u00bb{}\u00bb theme_builder_area=\u00bbpost_content\u00bb][et_pb_column type=\u00bb4_4&#8243; _builder_version=\u00bb4.16&#8243; custom_padding=\u00bb|||\u00bb global_colors_info=\u00bb{}\u00bb custom_padding__hover=\u00bb|||\u00bb theme_builder_area=\u00bbpost_content\u00bb][et_pb_accordion _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb hover_enabled=\u00bb0&#8243; global_colors_info=\u00bb{}\u00bb theme_builder_area=\u00bbpost_content\u00bb sticky_enabled=\u00bb0&#8243;][et_pb_accordion_item title=\u00bbEstrategia de planificaci\u00f3n de desarrollo web\u00bb open=\u00bbon\u00bb _builder_version=\u00bb4.16&#8243; _module_preset=\u00bbdefault\u00bb global_colors_info=\u00bb{}\u00bb theme_builder_area=\u00bbpost_content\u00bb]<\/p>\n<p>El desarrollo de un sitio web o cualquier otro producto de comunicaci\u00f3n digital\u00a0comprende una fase inicial de an\u00e1lisis que es esencial para el \u00e9xito de un\u00a0proyecto.<\/p>\n<p>La experiencia dicta que un an\u00e1lisis previo\u00a0riguroso de la soluci\u00f3n es esencial para lograr alcanzar los objetivos que se persiguen. Primero hay que tener claro qu\u00e9 se busca para saber qu\u00e9 elementos ser\u00e1n necesarios y qu\u00e9 fases habr\u00e1n de cubrirse para ello.<\/p>\n<p>El Gobierno de Chile ha elaborado en los \u00faltimos a\u00f1os un <a href=\"https:\/\/kitdigital.gob.cl\/\" target=\"_blank\" rel=\"noopener\">Kit Digital<\/a> con gu\u00edas muy \u00fatiles para abordar el dise\u00f1o y desarrollo de proyectos digitales, entre ellos una <a href=\"https:\/\/cms-dgd-prod.s3-us-west-2.amazonaws.com\/uploads\/pdf\/Guia-de-diseno-de-interfaces-web_1.pdf?\" target=\"_blank\" rel=\"noopener\">Gu\u00eda para el Dise\u00f1o de interfaces web Institucional<\/a> y una\u00a0<b><a href=\"http:\/\/www.guiadigital.gob.cl\/indice\/definicion-de-un-sitio-web\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">gu\u00eda para la creaci\u00f3n de los sitios web<\/a> <\/b>que aborda las principales fases de este proceso de pre-producci\u00f3n que concreta los criterios y conceptos de la Arquitectura de Informaci\u00f3n que hemos visto en los ep\u00edgrafes precedentes.<\/p>\n<p>Sobre esta base, en este bloque abordaremos como enfocar estas tareas:<\/p>\n<ol>\n<li>Definici\u00f3n de objetivos<\/li>\n<li>Definici\u00f3n de audiencia<\/li>\n<li>Definici\u00f3n de los contenidos del sitio<\/li>\n<li>Definici\u00f3n de la estructura del sitio<\/li>\n<li>Elementos de los sistemas de navegaci\u00f3n<\/li>\n<\/ol>\n<p>[\/et_pb_accordion_item][et_pb_accordion_item title=\u00bbDefinici\u00f3n de objetivos\u00bb _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb hover_enabled=\u00bb0&#8243; global_colors_info=\u00bb{}\u00bb theme_builder_area=\u00bbpost_content\u00bb open=\u00bboff\u00bb sticky_enabled=\u00bb0&#8243;]<\/p>\n<p>A trav\u00e9s de esta etapa se busca definir cu\u00e1les ser\u00e1n los objetivos centrales que deber\u00e1 tener el Sitio Web y establecer la forma de cumplirlos.<\/p>\n<p>Se recomienda comenzar por generar un objetivo central y luego definir varios objetivos secundarios; no obstante, es importante que estos objetivos sean explicitados adecuadamente al comienzo del desarrollo, con el fin de que todo el equipo de profesionales involucrados tengan claro el horizonte del proyecto. Preguntarnos \u00bfqu\u00e9 vamos a hacer? \u00bfpor qu\u00e9 lo vamos a hacer? y \u00bfpara qui\u00e9n? es fundamental al plantear los objetivos.<\/p>\n<p>Para generar objetivos que sean v\u00e1lidos y comprensibles, se aconseja escribirlos a trav\u00e9s de frases que se inicien con verbos que expresen las acciones a realizar. Por ejemplo:\u00a0<b>Recibir preguntas de los usuarios sobre las actividades de la instituci\u00f3n<\/b>\u00a0o\u00a0<b>Presentar p\u00fablicamente los informes m\u00e1s relevantes de la instituci\u00f3n<\/b>.<\/p>\n<p>Una manera de llegar m\u00e1s concretamente a los objetivos, es revisar la visi\u00f3n y la misi\u00f3n de la organizaci\u00f3n, desde la cual se pueden obtener las claves que permitan definirlos. Los objetivos que se creen para el sitio deber\u00e1n estar en concordancia con las necesidades y planificaci\u00f3n que haya hecho la instituci\u00f3n en sus planes anuales.<\/p>\n<p>Idealmente el listado de objetivos del sitio debe estar acotado y no acudir a m\u00e1s de cinco proposiciones. Este n\u00famero, si bien es arbitrario, se indica como una manera de se\u00f1alar que los objetivos no pueden ser tantos como para impedir su cumplimiento; ni tan pocos como para que el sitio sea poco ambicioso.<\/p>\n<p>De cada uno de estos objetivos se pueden desprender tareas concretas que permitan avanzar en el cumplimiento de ellos.<\/p>\n<p>Fuente:\u00a0<a href=\"https:\/\/www.guiadigital.gob.cl\/guiaweb_old\/guia\/archivos\/GuiaWeb2004.pdf\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">Adaptado de la Gu\u00eda Digital del Gobierno de Chile.<\/a><\/p>\n<p>[\/et_pb_accordion_item][et_pb_accordion_item title=\u00bbDefinici\u00f3n de audiencia\u00bb _builder_version=\u00bb4.16&#8243; _module_preset=\u00bbdefault\u00bb global_colors_info=\u00bb{}\u00bb theme_builder_area=\u00bbpost_content\u00bb open=\u00bboff\u00bb]<\/p>\n<p>Una vez que se ha terminado adecuadamente con la definici\u00f3n de los objetivos, se debe dar un siguiente paso, que es el de determinar las principales audiencias (p\u00fablicos) hacia las cuales se orientar\u00e1 el sitio.<\/p>\n<p>Mientras existan brechas de acceso a internet en la poblaci\u00f3n, el Sitio Web no podr\u00e1 atender al mismo p\u00fablico y las mismas necesidades que resuelve de manera presencial en ventanilla, sin embargo, la conectividad a internet crece cada a\u00f1o y por este motivo, se deben tener en cuenta varias consideraciones para definir qu\u00e9 tipos de audiencia se atender\u00e1n desde las diferentes pantallas del sitio.<\/p>\n<p>A continuaci\u00f3n se hacen algunas definiciones de audiencia, las que, sin importar las caracter\u00edsticas del sitio, siempre deber\u00e1n estar presentes, y por lo mismo, deben traducirse en acciones para poder atenderlas adecuadamente.<\/p>\n<ul>\n<li><b>Por capacidad f\u00edsica:\u00a0<\/b>la audiencia del sitio incluir\u00e1 personas con discapacidades f\u00edsicas, por lo que una de las metas que debe tener todo sitio es permitir el acceso de ellos, a trav\u00e9s del cumplimiento de las normas de\u00a0Accesibilidad\u00a0que se han recomendado como est\u00e1ndares internacionales. Para hacerlo se deben tomar las medidas correspondientes durante el proceso de desarrollo y dise\u00f1o del sitio,\u00a0se sugiere atender las recomendaciones mencionadas en las secciones <a href=\"http:\/\/www.guiadigital.gob.cl\/indice\/usabilidad\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">Usabilidad<\/a> y <a href=\"http:\/\/www.guiadigital.gob.cl\/articulo\/diseno-para-la-accesibilidad\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">Accesibilidad<\/a>.<\/li>\n<li><b>Por capacidad t\u00e9cnica:\u00a0<\/b>la audiencia que llegue al sitio se dividir\u00e1 de acuerdo a la experiencia t\u00e9cnica que tenga; por ello se deben plantear acceso simples mediante enlaces y otros m\u00e1s complejos, por ejemplo, mediante el uso de buscador.<\/li>\n<li><b>Por conocimiento de la instituci\u00f3n:\u00a0<\/b>los usuarios del sitio se dividir\u00e1n entre quienes conocen la instituci\u00f3n y quienes no la conocen. Por lo anterior, los primeros siempre sabr\u00e1n d\u00f3nde buscar lo que necesitan usando la terminolog\u00eda, siglas y nombres de departamentos internos; los segundos, en tanto, no entender\u00e1n nada de la nomenclatura interna y les ser\u00e1 muy dif\u00edcil acceder a la informaci\u00f3n que se les ofrezca de esa manera.<\/li>\n<li><b>Por necesidades de informaci\u00f3n:\u00a0<\/b>los usuarios del sitio tambi\u00e9n se dividir\u00e1n entre quienes llegan a buscar contenidos determinados y quienes s\u00f3lo llegan a ver si existe algo que les pueda servir en lo que est\u00e9n realizando.<\/li>\n<li><b>Por ubicaci\u00f3n geogr\u00e1fica:\u00a0<\/b>dentro de la audiencia siempre habr\u00e1 usuarios que ingresan al Sitio Web desde lugares diferentes\u00a0por lo que los contenidos deben responder tambi\u00e9n a esta diversidad.<\/li>\n<\/ul>\n<h3>\u00bfC\u00f3mo se llega a establecer la Audiencia?<\/h3>\n<p>Una de las formas m\u00e1s concretas de establecer la audiencia que tiene el sitio, es comenzar por investigar en la propia instituci\u00f3n, para determinar a qui\u00e9nes atienden sus diferentes reparticiones.<\/p>\n<p>Una vez que se ha hecho ese trabajo, es interesante hablar con usuarios que llegan a la instituci\u00f3n y hacerles preguntas muy simples y directas:<\/p>\n<ul>\n<li>\u00bfA qu\u00e9 vino a la instituci\u00f3n?<\/li>\n<li>\u00bfTiene acceso a Internet?<\/li>\n<li>\u00bfPropio o a trav\u00e9s de Infocentros?<\/li>\n<li>\u00bfQu\u00e9 tipo de informaci\u00f3n en la Internet le habr\u00eda evitado este viaje<\/li>\n<li>\u00bfQu\u00e9 le gustar\u00eda ver en el sitio Internet de esta instituci\u00f3n?<\/li>\n<\/ul>\n<p>De las respuestas que se obtengan, se podr\u00e1 hacer un muy buen resumen de tres elementos:<\/p>\n<ul>\n<li>Tipos de usuario que se podr\u00edan atender a trav\u00e9s de Internet<\/li>\n<li>Expectativas de los usuarios respecto del sitio<\/li>\n<li>Necesidad de informaci\u00f3n de la instituci\u00f3n<\/li>\n<\/ul>\n<p><!-- divi:heading {\"level\":3} --><\/p>\n<h3>Estudiar Escenarios de Uso<\/h3>\n<p>Otra de las metodolog\u00edas m\u00e1s efectivas, al momento de trabajar en el tema de las audiencias, tiene que ver con la forma en que el equipo de desarrollo responda a dos preguntas:<\/p>\n<ol>\n<li>\u00bfCu\u00e1les son las audiencias previstas? Al responder esta pregunta, se busca determinar hacia qui\u00e9nes se deber\u00e1 enfocar el sitio y, con esta informaci\u00f3n, comenzar a tomar decisiones respecto de la manera de navegaci\u00f3n, los servicios interactivos previstos y otros elementos de despliegue que tendr\u00e1 el sitio.<\/li>\n<li>\u00bfPor qu\u00e9 la gente vendr\u00e1 a su sitio? La respuesta a esta pregunta\u00a0 busca determinar, con base en las audiencias posibles o previstas, pensar y buscar los tipos de contenidos que estos usuarios vendr\u00e1n a buscar al sitio.<\/li>\n<\/ol>\n<p>En este sentido, la expresi\u00f3n\u00a0<b>Estudiar escenarios de uso<\/b>, busca determinar situaciones de uso reales en el Sitio Web, basado en usuarios existentes que puedan llegar al sitio a buscar determinados tipos de informaci\u00f3n.<\/p>\n<p>Por ejemplo, si nuestro Sitio Web se refiere a cotizaciones a la Seguridad Social, se puede aplicar el caso don Juan P\u00e9rez, agricultor, que quiere saber qu\u00e9 puede hacer para pagar las imposiciones de aut\u00f3nomo. \u00bfExiste en el sitio una respuesta para \u00e9l? \u00bfSi acudiera al sitio y viera la portada que se ha dise\u00f1ado, encontrar\u00eda la respuesta a su pregunta?<\/p>\n<p>Al acudir a casos reales de uso del sitio, basado en las audiencias que se haya definido, es posible establecer con mucha mayor exactitud c\u00f3mo esas personas (es decir casos reales) van a usar el sitio. Naturalmente, este tipo de revisiones permiten ratificar o modificar lo que se haya definido previamente como contenido del sitio, debido a que muchas veces la planificaci\u00f3n inicial es hecha por personas que conocen la instituci\u00f3n y dan por obvios muchos de los contenidos que para los usuarios normales no lo son tanto.<\/p>\n<p>Fuente: <a href=\"https:\/\/www.guiadigital.gob.cl\/guiaweb_old\/guia\/archivos\/GuiaWeb2004.pdf\" target=\"_blank\" rel=\"noopener\">Adaptado de la Gu\u00eda Digital del Gobierno de Chile.<\/a><\/p>\n<p>[\/et_pb_accordion_item][et_pb_accordion_item title=\u00bbDefinici\u00f3n de contenidos del sitio\u00bb _builder_version=\u00bb4.16&#8243; _module_preset=\u00bbdefault\u00bb global_colors_info=\u00bb{}\u00bb theme_builder_area=\u00bbpost_content\u00bb open=\u00bboff\u00bb]<\/p>\n<p>Una vez que se han identificado los objetivos del sitio y la audiencia, se debe proceder a hacer las definiciones m\u00e1s concretas que permitan decidir qu\u00e9 contenidos son los que va a tener el Sitio Web que se desarrolle.<\/p>\n<p>Para identificar contenidos, se deben utilizar como insumo los materiales que se hayan obtenido en la etapa de identificaci\u00f3n de Objetivos y de Audiencias, ya que en ambos la b\u00fasqueda gir\u00f3 en torno a las necesidades que ten\u00edan los usuarios del sitio.<\/p>\n<p>Para cumplir con una norma general respecto de qu\u00e9 deber\u00eda contener un sitio, se pueden anotar las siguientes, como las m\u00e1s importantes:<\/p>\n<ul>\n<li><b>Acerca de la Instituci\u00f3n:\u00a0<\/b>entregar la informaci\u00f3n completa referida a Autoridades, Organigrama, Normativa legal asociada, Oficinas, Horas de Atenci\u00f3n, Tel\u00e9fonos, etc.<\/li>\n<li><b>Productos \/ Servicios:\u00a0<\/b>destacar las actividades principales que el usuario puede hacer en la instituci\u00f3n; puede incluir una gu\u00eda de tr\u00e1mites que facilite las acciones de las personas que acudir\u00e1n a la instituci\u00f3n y que considere servicios interactivos para hacerlos desde el Sitio Web.<\/li>\n<li><b>Novedades de la Instituci\u00f3n:\u00a0<\/b>\u00faltimas actividades, noticias, nuevos servicios, tramites destacados, etc.<\/li>\n<\/ul>\n<p>Esta es una lista m\u00ednima que crecer\u00e1 en la medida de las necesidades de entrega de informaci\u00f3n de la instituci\u00f3n, lo importante es hacer \u00e9nfasis en que el inter\u00e9s de los contenidos variar\u00e1 si se trata de un usuario interno como los funcionarios de la instituci\u00f3n o externo como ciudadanos (usuarios).<\/p>\n<p>Por ejemplo, si miramos un Sitio Web desde el punto de vista del usuario externo de la instituci\u00f3n, lo que m\u00e1s le interesar\u00e1 ser\u00e1 la informaci\u00f3n referida a los tr\u00e1mites, seguida por la que informe acerca de c\u00f3mo tomar contacto con la instituci\u00f3n. Si la miramos desde el punto de vista del usuario interno, lo m\u00e1s importante ser\u00e1 la informaci\u00f3n de Novedades, seguida por la de organigrama y presentaci\u00f3n interna.<\/p>\n<p>Por lo mismo, es muy relevante que tanto los objetivos como la audiencia del sitio se hayan definido muy bien en forma previa, porque de lo contrario no habr\u00e1 posibilidad de atender a ambos usuarios de manera adecuada.<\/p>\n<h3>Agrupar y Etiquetar el Contenido<\/h3>\n<p>Con las definiciones hechas hasta ahora, llega el momento de poner en pr\u00e1ctica las metodolog\u00edas que permiten ordenar los contenidos, agrup\u00e1ndolos en conjuntos coherentes y d\u00e1ndoles nombres que los identifiquen.<\/p>\n<p>Probablemente la mejor t\u00e9cnica para hacerlo es hacer unas peque\u00f1as tarjetas de papel, en las que se anotan las principales \u00e1reas de contenido que se hayan detectado y revisado en el paso anterior. Una vez hecho, las cartas se ponen sobre una mesa y se van agrupando, hasta formar conjuntos de elementos coherentes entre ellos. Luego, a cada conjunto se le pone un nombre (idealmente una sola palabra) que identifique a todos sus contenidos.<\/p>\n<p>Con esas agrupaciones hechas, ya tendremos los elementos adecuados para generar posteriormente el \u00e1rbol de contenidos que, a su vez, permitir\u00e1 hacer el sistema de navegaci\u00f3n.<\/p>\n<p>Una vez que el proceso de Etiquetado ha concluido, es bueno hacer comprobaciones emp\u00edricas de la validez de los nombres escogidos. Para ello, se requiere que los elegidos sean mostrados a personas de diverso origen y que conozcan la instituci\u00f3n, como tambi\u00e9n a quienes la desconozcan por entero. Ellos deben responder las siguientes preguntas:<\/p>\n<ul>\n<li>\u00bfQu\u00e9 significa este nombre?<\/li>\n<li>\u00bfQu\u00e9 tipos de contenidos esperar\u00eda encontrar en esta \u00e1rea?<\/li>\n<\/ul>\n<p>Con las respuestas obtenidas se podr\u00e1 juzgar si los nombres que se han usado son los m\u00e1s adecuados o, bien, hay que introducir modificaciones.<\/p>\n<p>M\u00e1s informaci\u00f3n sobre <a href=\"http:\/\/usability.gov\/methods\/design_site\/cardsort.html\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">Card Sorting en Usability.gov (en ingl\u00e9s)<\/a><\/p>\n<p>Por ejemplo, dentro de los nombres m\u00e1s utilizados para una de las secciones habituales de un Sitio Web como es la de informaci\u00f3n corporativa, se cuenta <b>Acerca de<\/b>,\u00a0<b>Sobre&#8230;<\/b>,\u00a0<b>Qui\u00e9nes Somos<\/b>\u00a0e\u00a0<b>Informaci\u00f3n Corporativa<\/b>.<\/p>\n<h3>Identificar Requerimientos Funcionales<\/h3>\n<p>Junto con la b\u00fasqueda de las \u00e1reas de contenido que deber\u00e1 tener el sitio, se debe trabajar tambi\u00e9n en la definici\u00f3n de lo que se busca que el sitio\u00a0<b>haga<\/b>, es decir, los tipos de interacci\u00f3n que se busca incluir.<\/p>\n<p>Dentro de los servicios interactivos m\u00e1s frecuentes se cuentan las siguientes:<\/p>\n<ul>\n<li>Formulario de Contacto para env\u00edo de mensajes electr\u00f3nicos<\/li>\n<li>Sistema de env\u00edo de una noticia por mail a un amigo<\/li>\n<li>Formato de impresi\u00f3n de los contenidos<\/li>\n<li>Mapa del Sitio<\/li>\n<\/ul>\n<p>Dentro de las funcionalidades de mayor complejidad, pero a las que todo sitio deber\u00eda aspirar, se cuenta:<\/p>\n<ul>\n<li>Buscador interno del Sitio Web<\/li>\n<li>\u00c1rea de acceso privado para usuarios registrados<\/li>\n<li>Sistema de env\u00edo de boletines de noticias del sitio a usuarios registrados<\/li>\n<\/ul>\n<p>Ser\u00e1 importante que el sitio cuente con todos los servicios interactivos descritos como m\u00ednimos, para ofrecer una mejor experiencia al usuario que lo visita.<\/p>\n<h3>An\u00e1lisis de Sitios Similares (Benchmark)<\/h3>\n<p>El \u00faltimo elemento que se debe desarrollar en esta etapa es la b\u00fasqueda de otros sitios en Internet que sean similares a nuestra instituci\u00f3n, con el fin de revisar de qu\u00e9 manera han resuelto los mismos problemas que deberemos atender.<\/p>\n<p>Esta actividad comparativa permitir\u00e1 llegar a las\u00a0<b>buenas pr\u00e1cticas<\/b>\u00a0que es posible adaptar a las necesidades de nuestro sitio, con el fin de asegurarnos m\u00e9todos de funcionamiento y despliegue de contenidos, que sean coherentes con los objetivos que se han planteado inicialmente.<\/p>\n<p>Es relevante que se haga una pauta previa de comparaci\u00f3n, con el fin de saber de antemano cu\u00e1les son los par\u00e1metros que se medir\u00e1n y gracias a eso, optimizar la revisi\u00f3n que se haga (ver ejemplo de <a href=\"http:\/\/www.guiadigital.gob.cl\/guia\/capitulos\/dos\/anexos\/Pauta_de_Comparacion_de_Sitios.rtf\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">Pauta de Comparaci\u00f3n de Sitios Web<\/a> [RTF; 26Kb]).<\/p>\n<p>Fuente:\u00a0<a href=\"https:\/\/www.guiadigital.gob.cl\/guiaweb_old\/guia\/archivos\/GuiaWeb2004.pdf\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">Adaptado de la Gu\u00eda Digital del Gobierno de Chile.<\/a><\/p>\n<p>[\/et_pb_accordion_item][et_pb_accordion_item title=\u00bbDefinici\u00f3n de la Estructura del Sitio\u00bb _builder_version=\u00bb4.16&#8243; _module_preset=\u00bbdefault\u00bb global_colors_info=\u00bb{}\u00bb theme_builder_area=\u00bbpost_content\u00bb open=\u00bboff\u00bb]<\/p>\n<p>Una vez que se ha hecho el trabajo de identificaci\u00f3n de contenidos, se debe avanzar hacia las definiciones relacionadas con la forma que tendr\u00e1 el sitio que se est\u00e1 desarrollando. Ello implicar\u00e1 trabajar en tres \u00e1reas concretas, a trav\u00e9s de las cuales se definir\u00e1 la estructura del sitio, el \u00e1rbol de contenidos y los sistemas de navegaci\u00f3n que se ofrecer\u00e1 a los usuarios para que avancen a trav\u00e9s de sus contenidos.<\/p>\n<p>Las tres \u00e1reas mencionadas se explican a continuaci\u00f3n:<\/p>\n<h3>Creaci\u00f3n de la Estructura<\/h3>\n<p>Se refiere al proceso de identificar la forma que tendr\u00e1 el Sitio Web que se est\u00e1 desarrollando. En este sentido es importante hacer una diferencia entre estructura y dise\u00f1o (que ser\u00e1 explicada gr\u00e1ficamente m\u00e1s adelante en este cap\u00edtulo).<\/p>\n<ul>\n<li><b>Estructura:\u00a0<\/b>se refiere a la forma que tendr\u00e1 el Sitio Web en t\u00e9rminos generales con sus secciones, funcionalidades y sistemas de navegaci\u00f3n. No considera ni incluye elementos gr\u00e1ficos (logotipos, vi\u00f1etas, etc.).<\/li>\n<li><b>Dise\u00f1o:\u00a0<\/b>se refiere a la soluci\u00f3n gr\u00e1fica que se crear\u00e1 para el sitio, en la cual aparecen colores, logotipos, vi\u00f1etas, y otros elementos de dise\u00f1o que permiten identificar visualmente al sitio.<\/li>\n<\/ul>\n<p>Dado lo anterior, cuando hablamos de la estructura nos estamos refiriendo b\u00e1sicamente a cu\u00e1l ser\u00e1 la\u00a0<b>experiencia<\/b>\u00a0que tendr\u00e1 un usuario cuando accede al sitio. De esta manera podremos determinar d\u00f3nde estar\u00e1n ubicados los servicios interactivos (buscador, sistemas de encuestas, \u00e1reas de contenidos).<\/p>\n<p>Gracias a la realizaci\u00f3n de esta etapa es posible discutir en t\u00e9rminos muy pr\u00e1cticos cu\u00e1l ser\u00e1 la oferta de elementos de informaci\u00f3n e interacci\u00f3n que tendr\u00e1 el usuario. Al no incluir elementos de dise\u00f1o, se permite que la discusi\u00f3n sobre la estructura se desarrolle en aspectos concretos, sin que intervengan a\u00fan consideraciones est\u00e9ticas que habitualmente atrasan la aprobaci\u00f3n de esta etapa del desarrollo.<\/p>\n<h3>Mapas Permanentes del Sitio<\/h3>\n<p>Se refiere al proceso de crear un\u00a0<b>\u00e1rbol de contenido<\/b>\u00a0en el que se muestre de manera pr\u00e1ctica cu\u00e1ntas secciones tendr\u00e1 el sitio en desarrollo y cu\u00e1ntos niveles habr\u00e1 dentro de cada uno.<\/p>\n<p>Cuando se usa la idea de crear un \u00e1rbol, se refiere exactamente a generar un diagrama que cuente con un tronco, ramas y hojas, para mostrar las zonas principales, secundarias y contenidos finales que se ir\u00e1n incorporando.<\/p>\n<p>En este sentido se debe evitar a toda costa que el\u00a0<b>\u00e1rbol de contenidos<\/b>\u00a0represente la estructura de la organizaci\u00f3n, dado que \u00e9sta es conocida y comprendida internamente, pero constituye una barrera de entrada para usuarios externos. Si ellos llegan a buscar en una estructura de contenidos basada en la forma en que funciona la organizaci\u00f3n, primero deber\u00e1n comprender c\u00f3mo funciona la entidad para luego encontrar lo que les interesa.<\/p>\n<p>En este sentido se sugiere el uso de dos tipos de\u00a0<b>\u00e1rboles<\/b>\u00a0posibles,\u00a0<b>Arbol Organizacional<\/b>\u00a0(Figura 1) y\u00a0<b>Arbol Funcional<\/b>\u00a0(Figura 2).<\/p>\n<figure class=\"wp-block-jetpack-image-compare aligncenter\">\n<div class=\"juxtapose\" data-mode=\"horizontal\"><img loading=\"lazy\" decoding=\"async\" id=\"76348\" src=\"https:\/\/cibercambio.files.wordpress.com\/2021\/04\/7321d-fig001-1440108974-86.gif\" alt=\"fig001-1440108974-86.gif\" width=\"400\" height=\"212\" class=\"image-compare__image-before\" \/><br \/><img loading=\"lazy\" decoding=\"async\" id=\"76349\" src=\"https:\/\/cibercambio.files.wordpress.com\/2021\/04\/5454f-fig002-1440109472-90.gif\" alt=\"fig002-1440109472-90.gif\" width=\"400\" height=\"230\" class=\"image-compare__image-after\" \/><\/div>\n<\/figure>\n<p><!-- \/divi:jetpack\/image-compare --><\/p>\n<p>Dado lo anterior, las recomendaciones para la generaci\u00f3n de este\u00a0<b>\u00e1rbol<\/b>\u00a0son las siguientes:<\/p>\n<ul>\n<li><b>Secciones:\u00a0<\/b>se debe intentar que sean las menos posibles, con el fin de concentrar las acciones del usuario en pocas \u00e1reas; hay que considerar que cada una de las \u00e1reas a integrar en el \u00e1rbol requerir\u00e1 de mantenimiento posterior en contenidos, gr\u00e1fica y funcionalidad, lo que encarecer\u00e1 el costo final de operaci\u00f3n del sitio. Dado lo anterior, se recomienda que las secciones se sit\u00faen entre 5 y 7.<\/li>\n<li><b>Niveles:\u00a0<\/b>se debe intentar que el usuario est\u00e9 siempre a menos de tres clicks del contenido que anda buscando. Por ello no se deber\u00eda crear m\u00e1s de tres niveles de acceso; esto significa una Portada, una Portadilla de Secci\u00f3n y los Contenidos propiamente tales.<\/li>\n<li><b>Contenidos relacionados:\u00a0<\/b>se debe considerar que habr\u00e1 funcionalidades que est\u00e9n presentes en todo el sitio. Entre ellas se incluyen elementos como Buscador, Preguntas Frecuentes y Formularios de Contacto. Se recomienda que este tipo de elementos quede fuera del\u00a0<b>\u00e1rbol<\/b>\u00a0y\u00a0<b>floten<\/b>\u00a0sobre \u00e9ste, con el fin de indicar que desde todas las p\u00e1ginas habr\u00e1 enlaces a ellos.<\/li>\n<\/ul>\n<p>[\/et_pb_accordion_item][et_pb_accordion_item title=\u00bbDefinici\u00f3n de los Sistemas de Navegaci\u00f3n\u00bb _builder_version=\u00bb4.16&#8243; _module_preset=\u00bbdefault\u00bb global_colors_info=\u00bb{}\u00bb theme_builder_area=\u00bbpost_content\u00bb open=\u00bboff\u00bb]<\/p>\n<p>Una vez que se cuenta con los\u00a0<b>\u00e1rboles de contenido<\/b>\u00a0desarrollados en el paso anterior, la tarea siguiente consiste en generar los sistemas de acceso a dichos contenidos en el Sitio Web. A trav\u00e9s de estos, los usuarios podr\u00e1n avanzar por sus diferentes \u00e1reas, sin perderse.<\/p>\n<p>En la generaci\u00f3n de mencionados sistemas se debe atender a dos elementos que ser\u00e1n muy importantes:<\/p>\n<ul>\n<li><b>Textual:\u00a0<\/b>se refiere a que la navegaci\u00f3n se har\u00e1 a trav\u00e9s de elementos concretos, tales como men\u00fas, gu\u00edas, botones y otros elementos que deben ser claramente distinguibles dentro de la interfaz. Para generarlos se debe conseguir que cada uno de ellos represente claramente la funci\u00f3n para la que fueron designados y no dejar lugar a dudas sobre su funci\u00f3n ni sobre la acci\u00f3n que desarrollar\u00e1n al ser usados. Es decir, un bot\u00f3n debe parecer tal y no solo un <b>parche<\/b> de color sobre la pantalla. Adicionalmente, es muy relevante que las palabras escogidas para indicar acciones (etiquetado de men\u00fas), sean claras y precisas. En este sentido, si un bot\u00f3n necesita ser explicado, es mejor desecharlo y buscar otra soluci\u00f3n.<\/li>\n<li><b>Contextual:\u00a0<\/b>es todo lo referido a c\u00f3mo se presenta la informaci\u00f3n, utilizando para ellos elementos basados en texto, gr\u00e1ficos o bien de entorno. Los elementos cruciales en este caso, ser\u00e1n todos aquellos que permiten mostrar la navegaci\u00f3n en la pantalla y ayudar al usuario en el contexto del contenido que est\u00e1 viendo. Entre ellos, la gr\u00e1fica empleada, la redacci\u00f3n de los textos que se muestran, los contenidos relacionados, las nubes de etiquetas e incluso el nombre del dominio (URL) que permitir\u00e1 que el usuario sienta que est\u00e1 en el lugar indicado.<\/li>\n<\/ul>\n<h3>Caracter\u00edsticas de los Sistemas de Navegaci\u00f3n<\/h3>\n<p>Al generar el sistema de navegaci\u00f3n, se deben tener en cuenta las siguientes caracter\u00edsticas:<\/p>\n<ul>\n<li><b>Consistente:\u00a0<\/b>el sistema debe ser similar en todo el sitio, en lo referido a su ubicaci\u00f3n y disposici\u00f3n en las p\u00e1ginas. Esto se aplica tambi\u00e9n a aquellas instituciones que pueden tener m\u00e1s de un Sitio Web.<\/li>\n<li><b>Uniforme:\u00a0<\/b>el sistema debe usar similares t\u00e9rminos con el fin de que el usuario que lo observe en las p\u00e1ginas, conf\u00ede en que sus opciones llevan siempre hacia los mismos partes dentro del sitio.<\/li>\n<li><b>Visible:\u00a0<\/b>el sistema debe distinguirse claramente dentro del sitio, con el fin de que el usuario cuente con \u00e9l, como si se tratara de una gu\u00eda permanente en el \u00e1rea en que se encuentre del sitio.<\/li>\n<\/ul>\n<p>Se debe tener en cuenta que los buscadores de Internet tienen la capacidad de indexar e incluir en sus bases de datos, cualquier p\u00e1gina del sitio, a\u00fan las m\u00e1s internas. Por ello, es de suma importancia que todas las p\u00e1ginas del sitio cuenten con el sistema de navegaci\u00f3n, especialmente si el Sitio Web est\u00e1 desarrollado con <a href=\"http:\/\/www.guiadigital.gob.cl\/glosario\/F#\/frame\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">frames<\/a> (o marcos) que normalmente impiden que se indique claramente en cada p\u00e1gina la informaci\u00f3n referida a la navegaci\u00f3n general. De esta manera, si un usuario accede al sitio por una p\u00e1gina interior que estaba indexada en un buscador, siempre contar\u00e1 con las herramientas adecuadas para ir a la portada o realizar cualquier otra acci\u00f3n que le interese.<\/p>\n<p>Fuente:\u00a0<a href=\"https:\/\/www.guiadigital.gob.cl\/guiaweb_old\/guia\/archivos\/GuiaWeb2004.pdf\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">Adaptado de la Gu\u00eda Digital del Gobierno de Chile.<\/a><a href=\"http:\/\/www.guiadigital.gob.cl\/articulo\/definicion-de-contenidos-del-sitio\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\"><\/a><\/p>\n<h3>Elementos de los Sistemas de Navegaci\u00f3n<\/h3>\n<p>Entre los elementos m\u00e1s relevantes que conforman el sistema de navegaci\u00f3n se cuentan los siguientes:<\/p>\n<ul>\n<li><b>Men\u00fa General:\u00a0<\/b>siempre presente en todo el sitio, permite el acceso a cada una de las \u00e1reas del sitio.<\/li>\n<li><b>Pie de P\u00e1gina:\u00a0<\/b>usualmente ubicado en la parte inferior de cada p\u00e1gina, indica el nombre de la instituci\u00f3n, tel\u00e9fonos, direcci\u00f3n f\u00edsica y de correo electr\u00f3nico.<\/li>\n<li><b>Barra Corporativa:\u00a0<\/b>ofrece diversas opciones de informaci\u00f3n respecto del sitio y tal como el anterior, se muestra en todas las p\u00e1ginas.<\/li>\n<li><b>Ruta de Acceso:\u00a0<\/b>listado que aparece en la parte superior de cada p\u00e1gina y que muestra el trazado de p\u00e1ginas que hay entre la Portada del sitio hasta la p\u00e1gina actual que se est\u00e9 revisando; cada una de ellas debe tener un enlace, para acceder al \u00e1rea de la cual depende la p\u00e1gina. Cada uno de los elementos que conforman este\u00a0<b>camino<\/b>\u00a0debe tener un enlace que permita el acceso a esas \u00e1reas. En la literatura internacional en ingl\u00e9s sobre este tema, se llama a este elemento como\u00a0<b>breadcrumbs<\/b>.<\/li>\n<li><b>Fecha de publicaci\u00f3n:\u00a0<\/b>para saber la vigencia de publicaci\u00f3n del contenido desplegado.<\/li>\n<li><b>Bot\u00f3n Home:\u00a0<\/b>para ir a la portada, habitualmente se asocia este enlace al logotipo institucional utilizado en la esquina superior izquierda de la pantalla.<\/li>\n<li><b>Bot\u00f3n Mapa del sitio:\u00a0<\/b>para ver el mapa del Sitio Web<\/li>\n<li><b>Bot\u00f3n Contacto:\u00a0<\/b>enlace a un formulario para enviar un mensaje al webmaster, encargado del sitio, o a la Oficina de Informaci\u00f3n, Reclamos y Sugerencias (OIRS).<\/li>\n<li><b>Buscador:\u00a0<\/b>presente en cada p\u00e1gina si es que la funcionalidad existe en el sitio.<\/li>\n<li><b>Bot\u00f3n Ayuda:\u00a0<\/b>para recibir ayuda sobre qu\u00e9 hacer en cada pantalla del sitio.<\/li>\n<li><b>Bot\u00f3n Imprimir:\u00a0<\/b>para imprimir el contenido de la p\u00e1gina; se espera que el formato de impresi\u00f3n del documento que se muestra en pantalla sea m\u00e1s simple que la p\u00e1gina normal del Sitio Web, para dar la impresi\u00f3n al usuario de que hay una preocupaci\u00f3n por ayudarle en la tarea de llevar impreso el contenido.<\/li>\n<\/ul>\n<p>[\/et_pb_accordion_item][\/et_pb_accordion][\/et_pb_column][\/et_pb_row][\/et_pb_section]<\/p>\n<div class=\"pdfprnt-buttons pdfprnt-buttons-post pdfprnt-bottom-right\"><a href=\"https:\/\/proyectos.comunicaciondigital.es\/en\/wp-json\/wp\/v2\/posts\/76344?print=pdf\" class=\"pdfprnt-button pdfprnt-button-pdf\" target=\"_blank\" ><img decoding=\"async\" src=\"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/plugins\/pdf-print\/images\/pdf.png\" alt=\"image_pdf\" title=\"View PDF\" \/><span class=\"pdfprnt-button-title pdfprnt-button-pdf-title\">Versi\u00f3n en PDF<\/span><\/a><\/div>","protected":false},"excerpt":{"rendered":"<p>El desarrollo de un sitio web o cualquier otro producto de comunicaci\u00f3n digital\u00a0comprende una fase inicial de an\u00e1lisis que es esencial para el \u00e9xito de un\u00a0proyecto. La experiencia dicta que un an\u00e1lisis previo\u00a0riguroso de la soluci\u00f3n es esencial para lograr alcanzar los objetivos que se persiguen. Primero hay que tener claro qu\u00e9 se busca para&hellip; <a class=\"continue\" href=\"https:\/\/proyectos.comunicaciondigital.es\/en\/guia-diseno-web\/\">Continua leyendo<span> Gu\u00eda para el desarrollo de sitios web<\/span><\/a><\/p>","protected":false},"author":4,"featured_media":77508,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_et_pb_use_builder":"on","_et_pb_old_content":"<!-- wp:group {\"className\":\"atavist-title-design cover-text-simple\"} -->\n<div class=\"wp-block-group atavist-title-design cover-text-simple\"><!-- wp:heading {\"textAlign\":\"left\",\"align\":\"center\",\"className\":\"aligncenter atavist-title-h2\"} -->\n<h2 class=\"has-text-align-left aligncenter atavist-title-h2\">Introducci\u00f3n<\/h2>\n<!-- \/wp:heading --><\/div>\n<!-- \/wp:group -->\n\n<!-- wp:paragraph -->\n<p>El desarrollo de un sitio web o cualquier otro producto de comunicaci\u00f3n digital&nbsp;comprende una fase inicial de an\u00e1lisis que es esencial para el \u00e9xito de un&nbsp;proyecto.&nbsp;<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>La experiencia dicta que un an\u00e1lisis previo&nbsp;riguroso de la soluci\u00f3n es esencial para lograr alcanzar los objetivos que se persiguen. Primero hay que tener claro qu\u00e9 se busca para saber qu\u00e9 elementos ser\u00e1n necesarios y qu\u00e9 fases habr\u00e1n de cubrirse para ello.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>El Gobierno de Chile ha elaborado una estupenda <b><a href=\"http:\/\/www.guiadigital.gob.cl\/indice\/definicion-de-un-sitio-web\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">gu\u00eda para la creaci\u00f3n de los sitios web<\/a><\/b> institucionales de la que utilizaremos, en este bloque, alguno de sus apartados para estudiar las principales fases de este proceso de pre-producci\u00f3n que concreta los criterios y conceptos de la Arquitectura de Informaci\u00f3n que hemos visto en los ep\u00edgrafes precedentes.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Concretamente, abordaremos:<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:list -->\n<ol>\n<li>Definici\u00f3n de objetivos\n<\/li>\n<li>Definici\u00f3n de audiencia\n<\/li>\n<li>Definici\u00f3n de los contenidos del sitio\n<\/li>\n<li>Definici\u00f3n de la estructura del sitio\n<\/li>\n<li>Elementos de los sistemas de navegaci\u00f3n\n<\/li>\n<\/ol>\n<!-- \/wp:list -->\n\n<!-- wp:group {\"className\":\"atavist-title-design cover-text-simple\"} -->\n<div class=\"wp-block-group atavist-title-design cover-text-simple\"><!-- wp:heading {\"textAlign\":\"left\",\"align\":\"center\",\"className\":\"aligncenter atavist-title-h2\"} -->\n<h2 class=\"has-text-align-left aligncenter atavist-title-h2\">Definici\u00f3n de objetivos<\/h2>\n<!-- \/wp:heading --><\/div>\n<!-- \/wp:group -->\n\n<!-- wp:paragraph -->\n<p><i>A trav\u00e9s de esta etapa se busca definir cu\u00e1les ser\u00e1n los objetivos centrales que deber\u00e1 tener el Sitio Web y establecer la forma de cumplirlos.<\/i><\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p><i>Se recomienda comenzar por generar un objetivo central y luego definir varios objetivos secundarios; no obstante, es importante que estos objetivos sean explicitados adecuadamente al comienzo del desarrollo, con el fin de que todo el equipo de profesionales involucrados tengan claro el horizonte del proyecto.<\/i><\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:image {\"align\":\"right\"} -->\n<div class=\"wp-block-image\"><figure class=\"alignright\"><img src=\"https:\/\/cibercambio.files.wordpress.com\/2021\/04\/aef14-imagen11-1440066263-78.png\" alt=\"Fuente:\u00a0https:\/\/innovationbrain.wordpress.com\/\"\/><figcaption>Fuente:&nbsp;https:\/\/innovationbrain.wordpress.com\/<\/figcaption><\/figure><\/div>\n<!-- \/wp:image -->\n\n<!-- wp:paragraph -->\n<p><i>Para generar objetivos que sean v\u00e1lidos y comprensibles, se aconseja escribirlos a trav\u00e9s de frases que se inicien con verbos que expresen las acciones a realizar. Por ejemplo:&nbsp;<b>Recibir preguntas de los usuarios sobre las actividades de la instituci\u00f3n<\/b>&nbsp;o&nbsp;<b>Presentar p\u00fablicamente los informes m\u00e1s importantes de la instituci\u00f3n<\/b>.<\/i><\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p><i>Una forma de llegar m\u00e1s concretamente a los objetivos, es revisar la visi\u00f3n y la misi\u00f3n de la organizaci\u00f3n, desde la cual se pueden obtener las claves que permitan definirlos. Los objetivos que se creen para el sitio deber\u00e1n estar en concordancia con las necesidades y planificaci\u00f3n que haya hecho la instituci\u00f3n en sus planes anuales.<\/i><\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p><i>Idealmente el listado de objetivos del sitio debe estar acotado y no llegar a m\u00e1s de cinco proposiciones. Este n\u00famero, si bien es arbitrario, se indica como una forma de se\u00f1alar que los objetivos no pueden ser tantos como para impedir su cumplimiento; ni tan pocos como para que el sitio sea poco ambicioso.<\/i><\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p><i>De cada uno de estos objetivos se pueden desprender tareas concretas que permitan avanzar en el cumplimiento de ellos.<\/i><\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Fuente:&nbsp;<a href=\"http:\/\/www.guiadigital.gob.cl\/articulo\/definicion-de-objetivos\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">Adaptado de la Gu\u00eda Digital del Gobierno de Chile.<\/a><\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:group {\"className\":\"atavist-title-design cover-text-simple\"} -->\n<div class=\"wp-block-group atavist-title-design cover-text-simple\"><!-- wp:heading {\"textAlign\":\"left\",\"align\":\"center\",\"className\":\"aligncenter atavist-title-h2\"} -->\n<h2 class=\"has-text-align-left aligncenter atavist-title-h2\">Definici\u00f3n de audiencia<\/h2>\n<!-- \/wp:heading --><\/div>\n<!-- \/wp:group -->\n\n<!-- wp:paragraph -->\n<p>Una vez que se ha terminado adecuadamente con la definici\u00f3n de los objetivos, se debe dar un siguiente paso, que es el de determinar las principales audiencias (p\u00fablicos) hacia las cuales se orientar\u00e1 el sitio.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Mientras existan brechas de acceso a internet en la poblaci\u00f3n, el Sitio Web no podr\u00e1 atender al mismo p\u00fablico y las mismas necesidades que resuelve de manera presencial en ventanilla, sin embargo, la conectividad a internet crece cada a\u00f1o y por este motivo, se deben tener en cuenta varias consideraciones para definir qu\u00e9 tipos de audiencia se atender\u00e1n desde las diferentes pantallas del sitio.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>A continuaci\u00f3n se hacen algunas definiciones de audiencia, las que, sin importar las caracter\u00edsticas del sitio, siempre deber\u00e1n estar presentes, y por lo mismo, deben traducirse en acciones para poder atenderlas adecuadamente.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:list -->\n<ul><li>\n<b>Por capacidad f\u00edsica:&nbsp;<\/b>la audiencia del sitio incluir\u00e1 personas con discapacidades f\u00edsicas, por lo que una de las metas que debe tener todo sitio es permitir el acceso de ellos, a trav\u00e9s del cumplimiento de las normas de&nbsp;Accesibilidad&nbsp;que se han recomendado como est\u00e1ndares internacionales. Para hacerlo se deben tomar las medidas correspondientes durante el proceso de desarrollo y dise\u00f1o del sitio,&nbsp;se sugiere atender las recomendaciones mencionadas en las secciones <a href=\"http:\/\/www.guiadigital.gob.cl\/indice\/usabilidad\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">Usabilidad<\/a> y <a href=\"http:\/\/www.guiadigital.gob.cl\/articulo\/diseno-para-la-accesibilidad\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">Accesibilidad<\/a>.\n<\/li><li>\n<b>Por capacidad t\u00e9cnica:&nbsp;<\/b>la audiencia que llegue al sitio se dividir\u00e1 de acuerdo a la experiencia t\u00e9cnica que tenga; por ello se deben plantear acceso simples mediante enlaces y otros m\u00e1s complejos, por ejemplo, mediante el uso de buscador.\n<\/li><li>\n<b>Por conocimiento de la instituci\u00f3n:&nbsp;<\/b>los usuarios del sitio se dividir\u00e1n entre quienes conocen la instituci\u00f3n y quienes no la conocen. Por lo anterior, los primeros siempre sabr\u00e1n d\u00f3nde buscar lo que necesitan usando la terminolog\u00eda, siglas y nombres de departamentos internos; los segundos, en tanto, no entender\u00e1n nada de la nomenclatura interna y les ser\u00e1 muy dif\u00edcil acceder a la informaci\u00f3n que se les ofrezca de esa manera.\n<\/li><li>\n<b>Por necesidades de informaci\u00f3n:&nbsp;<\/b>los usuarios del sitio tambi\u00e9n se dividir\u00e1n entre quienes llegan a buscar contenidos determinados y quienes s\u00f3lo llegan a ver si existe algo que les pueda servir en lo que est\u00e9n realizando.\n<\/li><li>\n<b>Por ubicaci\u00f3n geogr\u00e1fica:&nbsp;<\/b>dentro de la audiencia siempre habr\u00e1 usuarios que ingresan al Sitio Web desde lugares diferentes&nbsp;por lo que los contenidos deben responder tambi\u00e9n a esta diversidad.\n<\/li><\/ul>\n<!-- \/wp:list -->\n\n<!-- wp:heading -->\n<h2>\u00bfC\u00f3mo se llega a establecer la Audiencia?<\/h2>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph -->\n<p>Una de las formas m\u00e1s concretas de establecer la audiencia que tiene el sitio, es comenzar por investigar en la propia instituci\u00f3n, para determinar a qui\u00e9nes atienden sus diferentes reparticiones.&nbsp;<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Una vez que se ha hecho ese trabajo, es interesante hablar con usuarios que llegan a la instituci\u00f3n y hacerles preguntas muy simples y directas:<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:list -->\n<ul><li>\u00bfA qu\u00e9 vino a la instituci\u00f3n?\n<\/li><li>\u00bfTiene acceso a Internet?\n<\/li><li>\u00bfPropio o a trav\u00e9s de Infocentros?\n<\/li><li>\u00bfQu\u00e9 tipo de informaci\u00f3n en la Internet le habr\u00eda evitado este viaje\n<\/li><li>\u00bfQu\u00e9 le gustar\u00eda ver en el sitio Internet de esta instituci\u00f3n?<\/li><\/ul>\n<!-- \/wp:list -->\n\n<!-- wp:paragraph -->\n<p>De las respuestas que se obtengan, se podr\u00e1 hacer un muy buen resumen de tres elementos:<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:list -->\n<ul><li>Tipos de usuario que se podr\u00edan atender a trav\u00e9s de Internet\n<\/li><li>Expectativas de los usuarios respecto del sitio\n<\/li><li>Necesidad de informaci\u00f3n de la instituci\u00f3n<\/li><\/ul>\n<!-- \/wp:list -->\n\n<!-- wp:heading {\"level\":3} -->\n<h3>Estudiar Escenarios de Uso<\/h3>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph -->\n<p>Otra de las metodolog\u00edas m\u00e1s efectivas, al momento de trabajar en el tema de las audiencias, tiene que ver con la forma en que el equipo de desarrollo responda a dos preguntas:<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:list -->\n<ol>\n<li>\u00bfCu\u00e1les son las audiencias previstas?\u00a0Al responder esta pregunta, se busca determinar hacia qui\u00e9nes se deber\u00e1 enfocar el sitio y, con esta informaci\u00f3n, comenzar a tomar decisiones respecto de la forma de navegaci\u00f3n, los servicios interactivos previstos y otros elementos de despliegue que tendr\u00e1 el sitio.\n<\/li>\n<li>\u00bfPor qu\u00e9 la gente vendr\u00e1 a su sitio?\u00a0La respuesta a esta pregunta\u00a0 busca determinar, en base a las audiencias posibles o previstas, pensar y buscar los tipos de contenidos que estos usuarios vendr\u00e1n a buscar al sitio.\n<\/li>\n<\/ol>\n<!-- \/wp:list -->\n\n<!-- wp:paragraph -->\n<p>En este sentido, la expresi\u00f3n&nbsp;<b>Estudiar escenarios de uso<\/b>, busca determinar situaciones de uso reales en el Sitio Web, basado en usuarios existentes que puedan llegar al sitio a buscar determinados tipos de informaci\u00f3n.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p><b>Por ejemplo, si nuestro Sitio Web se refiere a cotizaciones a la Seguridad Social, se puede aplicar el caso don Juan P\u00e9rez, agricultor, que quiere saber qu\u00e9 puede hacer para pagar las imposiciones de aut\u00f3nomo. \u00bfExiste en el sitio una respuesta para \u00e9l? \u00bfSi llegara al sitio y viera la portada que se ha dise\u00f1ado, encontrar\u00eda la respuesta a su pregunta?<\/b><\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Al llegar a casos reales de uso del sitio, basado en las audiencias que se haya definido, es posible establecer con mucha mayor exactitud c\u00f3mo esas personas (es decir casos reales) van a usar el sitio. Naturalmente, este tipo de revisiones permiten ratificar o modificar lo que se haya definido previamente como contenido del sitio, debido a que muchas veces la planificaci\u00f3n inicial es hecha por personas que conocen la instituci\u00f3n y dan por obvios muchos de los contenidos que para los usuarios normales no lo son tanto.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>   Fuente: <a href=\"http:\/\/www.guiadigital.gob.cl\/articulo\/definicion-de-audiencia\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">Adaptado de la Gu\u00eda Digital del Gobierno de Chil<\/a>e.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:group {\"className\":\"atavist-title-design cover-text-simple\"} -->\n<div class=\"wp-block-group atavist-title-design cover-text-simple\"><!-- wp:heading {\"textAlign\":\"left\",\"align\":\"center\",\"className\":\"aligncenter atavist-title-h2\"} -->\n<h2 class=\"has-text-align-left aligncenter atavist-title-h2\">Definici\u00f3n de contenidos del sitio<\/h2>\n<!-- \/wp:heading --><\/div>\n<!-- \/wp:group -->\n\n<!-- wp:paragraph -->\n<p>Una vez que se han identificado los objetivos del sitio y la audiencia, se debe proceder a hacer las definiciones m\u00e1s concretas que permitan decidir qu\u00e9 contenidos son los que va a tener el Sitio Web que se desarrolle.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Para identificar contenidos, se deben utilizar como insumo los materiales que se hayan obtenido en la etapa de identificaci\u00f3n de Objetivos y de Audiencias, ya que en ambos la b\u00fasqueda gir\u00f3 en torno a las necesidades que ten\u00edan los usuarios del sitio.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Para cumplir con una norma general respecto de qu\u00e9 deber\u00eda contener un sitio, se pueden anotar las siguientes, como las m\u00e1s importantes:<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:list -->\n<ul><li>\n<b>Acerca de la Instituci\u00f3n:&nbsp;<\/b>entregar la informaci\u00f3n completa referida a Autoridades, Organigrama, Normativa legal asociada, Oficinas, Horas de Atenci\u00f3n, Tel\u00e9fonos, etc.\n<\/li><li>\n<b>Productos \/ Servicios:&nbsp;<\/b>destacar las actividades principales que el usuario puede hacer en la instituci\u00f3n; puede incluir una gu\u00eda de tr\u00e1mites que facilite las acciones de las personas que acudir\u00e1n a la instituci\u00f3n y que considere servicios interactivos para hacerlos desde el Sitio Web.\n<\/li><li>\n<b>Novedades de la Instituci\u00f3n:&nbsp;<\/b>\u00faltimas actividades, noticias, nuevos servicios, tramites destacados, etc.<\/li><\/ul>\n<!-- \/wp:list -->\n\n<!-- wp:paragraph -->\n<p>Esta es una lista m\u00ednima que crecer\u00e1 en la medida de las necesidades de entrega de informaci\u00f3n de la instituci\u00f3n, lo importante es hacer \u00e9nfasis en que el inter\u00e9s de los contenidos variar\u00e1 si se trata de un usuario interno como los funcionarios de la instituci\u00f3n o externo como ciudadanos (usuarios).<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Por ejemplo, si miramos un Sitio Web desde el punto de vista del usuario externo de la instituci\u00f3n, lo que m\u00e1s le interesar\u00e1 ser\u00e1 la informaci\u00f3n referida a los tr\u00e1mites, seguida por la que informe acerca de c\u00f3mo tomar contacto con la instituci\u00f3n. Si la miramos desde el punto de vista del usuario interno, lo m\u00e1s importante ser\u00e1 la informaci\u00f3n de Novedades, seguida por la de organigrama y presentaci\u00f3n interna.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Por lo mismo, es muy relevante que tanto los objetivos como la audiencia del sitio se hayan definido muy bien en forma previa, porque de lo contrario no habr\u00e1 posibilidad de atender a ambos usuarios de manera adecuada.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:heading -->\n<h2>Agrupar y Etiquetar el Contenido<\/h2>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph -->\n<p>Con las definiciones hechas hasta ahora, llega el momento de poner en pr\u00e1ctica las metodolog\u00edas que permiten ordenar los contenidos, agrup\u00e1ndolos en conjuntos coherentes y d\u00e1ndoles nombres que los identifiquen.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Probablemente la mejor t\u00e9cnica para hacerlo es hacer unas peque\u00f1as tarjetas de papel, en las que se anotan las principales \u00e1reas de contenido que se hayan detectado y revisado en el paso anterior. Una vez hecho, las cartas se ponen sobre una mesa y se van agrupando, hasta formar conjuntos de elementos coherentes entre ellos. Luego, a cada conjunto se le pone un nombre (idealmente una sola palabra) que identifique a todos sus contenidos.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Con esas agrupaciones hechas, ya tendremos los elementos adecuados para generar posteriormente el \u00e1rbol de contenidos que, a su vez, permitir\u00e1 hacer el sistema de navegaci\u00f3n.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Una vez que el proceso de Etiquetado ha concluido, es bueno hacer comprobaciones emp\u00edricas de la validez de los nombres escogidos. Para ello, se requiere que los elegidos sean mostrados a personas de diverso origen y que conozcan la instituci\u00f3n, como tambi\u00e9n a quienes la desconozcan por entero. Ellos deben responder las siguientes preguntas:<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:list -->\n<ul><li>\u00bfQu\u00e9 significa este nombre?\n<\/li><li>\u00bfQu\u00e9 tipos de contenidos esperar\u00eda encontrar en esta \u00e1rea?\n<\/li><\/ul>\n<!-- \/wp:list -->\n\n<!-- wp:paragraph -->\n<p>Con las respuestas obtenidas se podr\u00e1 juzgar si los nombres que se han usado son los m\u00e1s adecuados o, bien, hay que introducir modificaciones.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:group {\"align\":\"right\",\"className\":\"alignright is-style-border\"} -->\n<div class=\"wp-block-group alignright is-style-border\"><!-- wp:paragraph -->\n<p>Mas informaci\u00f3n sobre&nbsp;<a href=\"http:\/\/usability.gov\/methods\/design_site\/cardsort.html\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">Card Sorting en Usability.gov (en ingl\u00e9s)<\/a><\/p>\n<!-- \/wp:paragraph --><\/div>\n<!-- \/wp:group -->\n\n<!-- wp:paragraph -->\n<p>Por ejemplo, dentro de los nombres m\u00e1s usados para una de las secciones habituales de un Sitio Web como es la de informaci\u00f3n corporativa, se cuenta&nbsp;<b>Acerca de<\/b>,&nbsp;<b>Sobre...<\/b>&nbsp;,&nbsp;<b>Qui\u00e9nes Somos<\/b>&nbsp;e&nbsp;<b>Informaci\u00f3n Corporativa<\/b>.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:heading -->\n<h2>Identificar Requerimientos Funcionales<\/h2>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph -->\n<p>Junto con la b\u00fasqueda de las \u00e1reas de contenido que deber\u00e1 tener el sitio, se debe trabajar tambi\u00e9n en la definici\u00f3n de lo que se busca que el sitio&nbsp;<b>haga<\/b>, es decir, los tipos de interacci\u00f3n que se busca incluir.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Dentro de los servicios interactivos m\u00e1s frecuentes se cuentan las siguientes:<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:list -->\n<ul><li>Formulario de Contacto para env\u00edo de mensajes electr\u00f3nicos\n<\/li><li>Sistema de env\u00edo de una noticia por mail a un amigo\n<\/li><li>Formato de impresi\u00f3n de los contenidos\n<\/li><li>Mapa del Sitio<\/li><\/ul>\n<!-- \/wp:list -->\n\n<!-- wp:paragraph -->\n<p>Dentro de las funcionalidades de mayor complejidad, pero a las que todo sitio deber\u00eda aspirar, se cuenta:<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:list -->\n<ul><li>Buscador interno del Sitio Web\n<\/li><li>\u00c1rea de acceso privado para usuarios registrados\n<\/li><li>Sistema de env\u00edo de boletines de noticias del sitio a usuarios registrados<\/li><\/ul>\n<!-- \/wp:list -->\n\n<!-- wp:paragraph -->\n<p>Ser\u00e1 importante que el sitio cuente con todos los servicios interactivos descritos como m\u00ednimos, para ofrecer una mejor experiencia al usuario que lo visita.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:heading -->\n<h2>An\u00e1lisis de Sitios Similares (Benchmark)<\/h2>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph -->\n<p>El \u00faltimo elemento que se debe desarrollar en esta etapa es la b\u00fasqueda de otros sitios en Internet que sean similares a nuestra instituci\u00f3n, con el fin de revisar de qu\u00e9 manera han resuelto los mismos problemas que deberemos atender.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Esta actividad comparativa permitir\u00e1 llegar a las&nbsp;<b>buenas pr\u00e1cticas<\/b>&nbsp;que es posible adaptar a las necesidades de nuestro sitio, con el fin de asegurarnos m\u00e9todos de funcionamiento y despliegue de contenidos, que sean coherentes con los objetivos que se han planteado inicialmente.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Es importante que se haga una pauta previa de comparaci\u00f3n, con el fin de saber de antemano cu\u00e1les son los par\u00e1metros que se medir\u00e1n y gracias a eso, optimizar la revisi\u00f3n que se haga (ver ejemplo de&nbsp;<a href=\"http:\/\/www.guiadigital.gob.cl\/guia\/capitulos\/dos\/anexos\/Pauta_de_Comparacion_de_Sitios.rtf\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">Pauta de Comparaci\u00f3n de Sitios Web<\/a> [RTF; 26Kb]).<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Fuente:&nbsp;<a href=\"http:\/\/www.guiadigital.gob.cl\/articulo\/definicion-de-contenidos-del-sitio\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">Adaptado de la Gu\u00eda Digital del Gobierno de Chile.<\/a><\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:group {\"className\":\"atavist-title-design cover-text-simple\"} -->\n<div class=\"wp-block-group atavist-title-design cover-text-simple\"><!-- wp:heading {\"textAlign\":\"left\",\"align\":\"center\",\"className\":\"aligncenter atavist-title-h2\"} -->\n<h2 class=\"has-text-align-left aligncenter atavist-title-h2\">Definici\u00f3n de la Estructura del Sitio<\/h2>\n<!-- \/wp:heading --><\/div>\n<!-- \/wp:group -->\n\n<!-- wp:paragraph -->\n<p>Una vez que se ha hecho el trabajo de identificaci\u00f3n de contenidos, se debe avanzar hacia las definiciones relacionadas con la forma que tendr\u00e1 el sitio que se est\u00e1 desarrollando. Ello implicar\u00e1 trabajar en tres \u00e1reas concretas, a trav\u00e9s de las cuales se definir\u00e1 la estructura del sitio, el \u00e1rbol de contenidos y los sistemas de navegaci\u00f3n que se ofrecer\u00e1 a los usuarios para que avancen a trav\u00e9s de sus contenidos.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Las tres \u00e1reas mencionadas se explican a continuaci\u00f3n:<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:heading -->\n<h2>Creaci\u00f3n de la Estructura<\/h2>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph -->\n<p>Se refiere al proceso de identificar la forma que tendr\u00e1 el Sitio Web que se est\u00e1 desarrollando. En este sentido es importante hacer una diferencia entre estructura y dise\u00f1o (que ser\u00e1 explicada gr\u00e1ficamente m\u00e1s adelante en este cap\u00edtulo).<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:list -->\n<ul><li>\n<b>Estructura:&nbsp;<\/b>se refiere a la forma que tendr\u00e1 el Sitio Web en t\u00e9rminos generales con sus secciones, funcionalidades y sistemas de navegaci\u00f3n. No considera ni incluye elementos gr\u00e1ficos (logotipos, vi\u00f1etas, etc.).\n<\/li><li>\n<b>Dise\u00f1o:&nbsp;<\/b>se refiere a la soluci\u00f3n gr\u00e1fica que se crear\u00e1 para el sitio, en la cual aparecen colores, logotipos, vi\u00f1etas, y otros elementos de dise\u00f1o que permiten identificar visualmente al sitio.<\/li><\/ul>\n<!-- \/wp:list -->\n\n<!-- wp:paragraph -->\n<p>Dado lo anterior, cuando hablamos de la estructura nos estamos refiriendo b\u00e1sicamente a cu\u00e1l ser\u00e1 la&nbsp;<b>experiencia<\/b>&nbsp;que tendr\u00e1 un usuario cuando accede al sitio. De esta manera podremos determinar d\u00f3nde estar\u00e1n ubicados los servicios interactivos (buscador, sistemas de encuestas, \u00e1reas de contenidos).<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Gracias a la realizaci\u00f3n de esta etapa es posible discutir en t\u00e9rminos muy pr\u00e1cticos cu\u00e1l ser\u00e1 la oferta de elementos de informaci\u00f3n e interacci\u00f3n que tendr\u00e1 el usuario. Al no incluir elementos de dise\u00f1o, se permite que la discusi\u00f3n sobre la estructura se desarrolle en aspectos concretos, sin que intervengan a\u00fan consideraciones est\u00e9ticas que habitualmente atrasan la aprobaci\u00f3n de esta etapa del desarrollo.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:heading -->\n<h2>Mapas Permanentes del Sitio<\/h2>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph -->\n<p>Se refiere al proceso de crear un&nbsp;<b>\u00e1rbol de contenido<\/b>&nbsp;en el que se muestre de manera pr\u00e1ctica cu\u00e1ntas secciones tendr\u00e1 el sitio en desarrollo y cu\u00e1ntos niveles habr\u00e1 dentro de cada uno.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Cuando se usa la idea de crear un \u00e1rbol, se refiere exactamente a generar un diagrama que cuente con un tronco, ramas y hojas, para mostrar las zonas principales, secundarias y contenidos finales que se ir\u00e1n incorporando.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>En este sentido se debe evitar a toda costa que el&nbsp;<b>\u00e1rbol de contenidos<\/b>&nbsp;represente la estructura de la organizaci\u00f3n, dado que \u00e9sta es conocida y comprendida internamente, pero constituye una barrera de entrada para usuarios externos. Si ellos llegan a buscar en una estructura de contenidos basada en la forma en que funciona la organizaci\u00f3n, primero deber\u00e1n comprender c\u00f3mo funciona la entidad para luego encontrar lo que les interesa.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>En este sentido se sugiere el uso de dos tipos de&nbsp;<b>\u00e1rboles<\/b>&nbsp;posibles,&nbsp;<b>Arbol Organizacional<\/b>&nbsp;(Figura 1) y&nbsp;<b>Arbol Funcional<\/b>&nbsp;(Figura 2).<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:jetpack\/image-compare {\"align\":\"center\",\"className\":\"wp-block-jetpack-image-compare aligncenter\",\"imageBefore\":{\"id\":76348,\"url\":\"https:\/\/cibercambio.files.wordpress.com\/2021\/04\/7321d-fig001-1440108974-86.gif\",\"alt\":\"fig001-1440108974-86.gif\",\"width\":400,\"height\":212},\"imageAfter\":{\"id\":76349,\"url\":\"https:\/\/cibercambio.files.wordpress.com\/2021\/04\/5454f-fig002-1440109472-90.gif\",\"alt\":\"fig002-1440109472-90.gif\",\"width\":400,\"height\":230}} -->\n<figure class=\"wp-block-jetpack-image-compare aligncenter\">\n          <div class=\"juxtapose\" data-mode=\"horizontal\">\n            <img id=\"76348\" src=\"https:\/\/cibercambio.files.wordpress.com\/2021\/04\/7321d-fig001-1440108974-86.gif\" alt=\"fig001-1440108974-86.gif\" width=\"400\" height=\"212\" class=\"image-compare__image-before\">\n            <img id=\"76349\" src=\"https:\/\/cibercambio.files.wordpress.com\/2021\/04\/5454f-fig002-1440109472-90.gif\" alt=\"fig002-1440109472-90.gif\" width=\"400\" height=\"230\" class=\"image-compare__image-after\">\n          <\/div>\n        <\/figure>\n<!-- \/wp:jetpack\/image-compare -->\n\n<!-- wp:paragraph -->\n<p>Dado lo anterior, las recomendaciones para la generaci\u00f3n de este&nbsp;<b>\u00e1rbol<\/b>&nbsp;son las siguientes:<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:list -->\n<ul><li>\n<b>Secciones:&nbsp;<\/b>se debe intentar que sean las menos posibles, con el fin de concentrar las acciones del usuario en pocas \u00e1reas; hay que considerar que cada una de las \u00e1reas a integrar en el \u00e1rbol requerir\u00e1 de mantenimiento posterior en contenidos, gr\u00e1fica y funcionalidad, lo que encarecer\u00e1 el costo final de operaci\u00f3n del sitio. Dado lo anterior, se recomienda que las secciones se sit\u00faen entre 5 y 7.\n<\/li><li>\n<b>Niveles:&nbsp;<\/b>se debe intentar que el usuario est\u00e9 siempre a menos de tres clicks del contenido que anda buscando. Por ello no se deber\u00eda crear m\u00e1s de tres niveles de acceso; esto significa una Portada, una Portadilla de Secci\u00f3n y los Contenidos propiamente tales.\n<\/li><li>\n<b>Contenidos relacionados:&nbsp;<\/b>se debe considerar que habr\u00e1 funcionalidades que est\u00e9n presentes en todo el sitio. Entre ellas se incluyen elementos como Buscador, Preguntas Frecuentes y Formularios de Contacto. Se recomienda que este tipo de elementos quede fuera del&nbsp;<b>\u00e1rbol<\/b>&nbsp;y&nbsp;<b>floten<\/b>&nbsp;sobre \u00e9ste, con el fin de indicar que desde todas las p\u00e1ginas habr\u00e1 enlaces a ellos.<\/li><\/ul>\n<!-- \/wp:list -->\n\n<!-- wp:heading -->\n<h2>Definici\u00f3n de los Sistemas de Navegaci\u00f3n<\/h2>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph -->\n<p>Una vez que se cuenta con los&nbsp;<b>\u00e1rboles de contenido<\/b>&nbsp;desarrollados en el paso anterior, la tarea siguiente consiste en generar los sistemas de acceso a dichos contenidos en el Sitio Web. A trav\u00e9s de estos, los usuarios podr\u00e1n avanzar por sus diferentes \u00e1reas, sin perderse.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>En la generaci\u00f3n de dichos sistemas se debe atender a dos elementos que ser\u00e1n muy importantes:<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:list -->\n<ul><li>\n<b>Textual:&nbsp;<\/b>se refiere a que la navegaci\u00f3n se har\u00e1 a trav\u00e9s de elementos concretos, tales como men\u00fas, gu\u00edas, botones y otros elementos que deben ser claramente distinguibles dentro de la interfaz. Para generarlos se debe conseguir que cada uno de ellos represente claramente la funci\u00f3n para la que fueron designados y no dejar lugar a dudas sobre su funci\u00f3n ni sobre la acci\u00f3n que desarrollar\u00e1n al ser usados. Es decir, un bot\u00f3n debe parecer tal y no s\u00f3lo un&nbsp;<b>parche<\/b>&nbsp;de color sobre la pantalla. Adicionalmente, es muy importante que las palabras escogidas para indicar acciones (etiquetado de men\u00fas), sean claras y precisas. En este sentido, si un bot\u00f3n necesita ser explicado, es mejor desecharlo y buscar otra soluci\u00f3n.\n<\/li><li>\n<b>Contextual:&nbsp;<\/b>es todo lo referido a c\u00f3mo se presenta la informaci\u00f3n, utilizando para ellos elementos basados en texto, gr\u00e1ficos o bien de entorno. Los elementos relevantes en este caso, ser\u00e1n todos aquellos que permiten mostrar la navegaci\u00f3n en la pantalla y ayudar al usuario en el contexto del contenido que esta vieno. Entre ellos, la gr\u00e1fica utilizada, la redacci\u00f3n de los textos que se muestran, los contenidos relacionados, las nubes de etiquetas e incluso el nombre del dominio (URL) que permitir\u00e1 que el usuario sienta que est\u00e1 en el lugar indicado.<\/li><\/ul>\n<!-- \/wp:list -->\n\n<!-- wp:heading -->\n<h2>Caracter\u00edsticas de los Sistemas de Navegaci\u00f3n<\/h2>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph -->\n<p>Al generar el sistema de navegaci\u00f3n, se deben tener en cuenta las siguientes caracter\u00edsticas:<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:list -->\n<ul><li>\n<b>Consistente:&nbsp;<\/b>el sistema debe ser similar en todo el sitio, en lo referido a su ubicaci\u00f3n y disposici\u00f3n en las p\u00e1ginas. Esto se aplica tambi\u00e9n a aquellas instituciones que pueden tener m\u00e1s de un Sitio Web.\n<\/li><li>\n<b>Uniforme:&nbsp;<\/b>el sistema debe utilizar similares t\u00e9rminos con el fin de que el usuario que lo vea en las p\u00e1ginas, conf\u00ede en que sus opciones llevan siempre hacia los mismos lugares dentro del sitio.<\/li><li>\n<b>Visible:&nbsp;<\/b>el sistema debe distinguirse claramente dentro del sitio, con el fin de que el usuario cuente con \u00e9l, como si se tratara de una gu\u00eda permanente en el \u00e1rea en que se encuentre del sitio.<\/li><\/ul>\n<!-- \/wp:list -->\n\n<!-- wp:paragraph -->\n<p>Se debe tener en cuenta que los buscadores de Internet tienen la capacidad de indexar e incluir en sus bases de datos, cualquier p\u00e1gina del sitio, a\u00fan las m\u00e1s internas. Por ello, es de suma importancia que todas las p\u00e1ginas del sitio cuenten con el sistema de navegaci\u00f3n, especialmente si el Sitio Web est\u00e1 desarrollado con <a href=\"http:\/\/www.guiadigital.gob.cl\/glosario\/F#\/frame\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">frames<\/a> (o marcos) que normalmente impiden que se indique claramente en cada p\u00e1gina la informaci\u00f3n referida a la navegaci\u00f3n general. De esta manera, si un usuario accede al sitio por una p\u00e1gina interior que estaba indexada en un buscador, siempre contar\u00e1 con las herramientas adecuadas para ir a la portada o realizar cualquier otra acci\u00f3n que le interese.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Fuente:&nbsp;<a href=\"http:\/\/www.guiadigital.gob.cl\/articulo\/definicion-de-la-estructura-del-sitio\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\">Adaptado de la Gu\u00eda Digital del Gobierno de Chile.<\/a><a href=\"http:\/\/www.guiadigital.gob.cl\/articulo\/definicion-de-contenidos-del-sitio\" target=\"_blank\" class=\"regular-link\" rel=\"noopener\"><\/a><\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:group {\"className\":\"atavist-title-design cover-text-simple\"} -->\n<div class=\"wp-block-group atavist-title-design cover-text-simple\"><!-- wp:heading {\"textAlign\":\"left\",\"align\":\"center\",\"className\":\"aligncenter atavist-title-h2\"} -->\n<h2 class=\"has-text-align-left aligncenter atavist-title-h2\">Elementos de los Sistemas de Navegaci\u00f3n<\/h2>\n<!-- \/wp:heading --><\/div>\n<!-- \/wp:group -->\n\n<!-- wp:paragraph -->\n<p>Entre los elementos m\u00e1s relevantes que conforman el sistema de navegaci\u00f3n se cuentan los siguientes:<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:list -->\n<ul><li>\n<b>Men\u00fa General:&nbsp;<\/b>siempre presente en todo el sitio, permite el acceso a cada una de las \u00e1reas del sitio.\n<\/li><li>\n<b>Pie de P\u00e1gina:&nbsp;<\/b>usualmente ubicado en la parte inferior de cada p\u00e1gina, indica el nombre de la instituci\u00f3n, tel\u00e9fonos, direcci\u00f3n f\u00edsica y de correo electr\u00f3nico.\n<\/li><li>\n<b>Barra Corporativa:&nbsp;<\/b>ofrece diversas opciones de informaci\u00f3n respecto del sitio y tal como el anterior, se muestra en todas las p\u00e1ginas.\n<\/li><li>\n<b>Ruta de Acceso:&nbsp;<\/b>listado que aparece en la parte superior de cada p\u00e1gina y que muestra el trazado de p\u00e1ginas que hay entre la Portada del sitio hasta la p\u00e1gina actual que se est\u00e9 revisando; cada una de ellas debe tener un enlace, para acceder al \u00e1rea de la cual depende la p\u00e1gina. Cada uno de los elementos que conforman este&nbsp;<b>camino<\/b>&nbsp;debe tener un enlace que permita el acceso a esas \u00e1reas. En la literatura internacional en ingl\u00e9s sobre este tema, se llama a este elemento como&nbsp;<b>breadcrumbs<\/b>.\n<\/li><li>\n<b>Fecha de publicaci\u00f3n:&nbsp;<\/b>para saber la vigencia de publicaci\u00f3n del contenido desplegado.\n<\/li><li>\n<b>Bot\u00f3n Home:&nbsp;<\/b>para ir a la portada, habitualmente se asocia este enlace al logotipo instutucional utilizado en la esquina superior izquierda de la pantalla.\n<\/li><li>\n<b>Bot\u00f3n Mapa del sitio:&nbsp;<\/b>para ver el mapa del Sitio Web\n<\/li><li>\n<b>Bot\u00f3n Contacto:&nbsp;<\/b>enlace a un formulario para enviar un mensaje al webmaster, encargado del sitio, o a la Oficina de Informaci\u00f3n, Reclamos y Sugerencias (OIRS).\n<\/li><li>\n<b>Buscador:&nbsp;<\/b>presente en cada p\u00e1gina si es que la funcionalidad existe en el sitio.\n<\/li><li>\n<b>Bot\u00f3n Ayuda:&nbsp;<\/b>para recibir ayuda sobre qu\u00e9 hacer en cada pantalla del sitio.\n<\/li><li>\n<b>Bot\u00f3n Imprimir:&nbsp;<\/b>para imprimir el contenido de la p\u00e1gina; se espera que el formato de impresi\u00f3n del documento que se muestra en pantalla sea m\u00e1s simple que la p\u00e1gina normal del Sitio Web, para dar la impresi\u00f3n al usuario de que hay una preocupaci\u00f3n por ayudarle en la tarea de llevar impreso el contenido.\n<\/li><\/ul>\n<!-- \/wp:list -->","_et_gb_content_width":"","footnotes":""},"categories":[221],"tags":[],"class_list":["post-76344","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-banco-conocimiento"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.2 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Gu\u00eda para el desarrollo de sitios web - Portal de proyectos multimedia<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/proyectos.comunicaciondigital.es\/en\/guia-diseno-web\/\" \/>\n<meta property=\"og:locale\" content=\"en_GB\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Gu\u00eda para el desarrollo de sitios web - Portal de proyectos multimedia\" \/>\n<meta property=\"og:description\" content=\"El desarrollo de un sitio web o cualquier otro producto de comunicaci\u00f3n digital\u00a0comprende una fase inicial de an\u00e1lisis que es esencial para el \u00e9xito de un\u00a0proyecto. La experiencia dicta que un an\u00e1lisis previo\u00a0riguroso de la soluci\u00f3n es esencial para lograr alcanzar los objetivos que se persiguen. Primero hay que tener claro qu\u00e9 se busca para&hellip; Continua leyendo Gu\u00eda para el desarrollo de sitios web\" \/>\n<meta property=\"og:url\" content=\"https:\/\/proyectos.comunicaciondigital.es\/en\/guia-diseno-web\/\" \/>\n<meta property=\"og:site_name\" content=\"Portal de proyectos multimedia\" \/>\n<meta property=\"article:published_time\" content=\"2015-08-13T19:03:06+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-09-08T18:42:41+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/uploads\/2015\/08\/disen\u0303o-web.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1100\" \/>\n\t<meta property=\"og:image:height\" content=\"683\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Manuel Gertrudix Barrio\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/proyectos.comunicaciondigital.es\/guia-diseno-web\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/proyectos.comunicaciondigital.es\/guia-diseno-web\/\"},\"author\":{\"name\":\"Manuel Gertrudix Barrio\",\"@id\":\"https:\/\/proyectos.comunicaciondigital.es\/#\/schema\/person\/4699e2d8a8c19b218ae2f96940a3c337\"},\"headline\":\"Gu\u00eda para el desarrollo de sitios web\",\"datePublished\":\"2015-08-13T19:03:06+00:00\",\"dateModified\":\"2022-09-08T18:42:41+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/proyectos.comunicaciondigital.es\/guia-diseno-web\/\"},\"wordCount\":4265,\"image\":{\"@id\":\"https:\/\/proyectos.comunicaciondigital.es\/guia-diseno-web\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/uploads\/2015\/08\/disen\u0303o-web.png\",\"articleSection\":[\"banco-conocimiento\"],\"inLanguage\":\"en-GB\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/proyectos.comunicaciondigital.es\/guia-diseno-web\/\",\"url\":\"https:\/\/proyectos.comunicaciondigital.es\/guia-diseno-web\/\",\"name\":\"Gu\u00eda para el desarrollo de sitios web - Portal de proyectos multimedia\",\"isPartOf\":{\"@id\":\"https:\/\/proyectos.comunicaciondigital.es\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/proyectos.comunicaciondigital.es\/guia-diseno-web\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/proyectos.comunicaciondigital.es\/guia-diseno-web\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/uploads\/2015\/08\/disen\u0303o-web.png\",\"datePublished\":\"2015-08-13T19:03:06+00:00\",\"dateModified\":\"2022-09-08T18:42:41+00:00\",\"author\":{\"@id\":\"https:\/\/proyectos.comunicaciondigital.es\/#\/schema\/person\/4699e2d8a8c19b218ae2f96940a3c337\"},\"breadcrumb\":{\"@id\":\"https:\/\/proyectos.comunicaciondigital.es\/guia-diseno-web\/#breadcrumb\"},\"inLanguage\":\"en-GB\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/proyectos.comunicaciondigital.es\/guia-diseno-web\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-GB\",\"@id\":\"https:\/\/proyectos.comunicaciondigital.es\/guia-diseno-web\/#primaryimage\",\"url\":\"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/uploads\/2015\/08\/disen\u0303o-web.png\",\"contentUrl\":\"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/uploads\/2015\/08\/disen\u0303o-web.png\",\"width\":1100,\"height\":683,\"caption\":\"disen\u0303o-web\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/proyectos.comunicaciondigital.es\/guia-diseno-web\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Portada\",\"item\":\"https:\/\/proyectos.comunicaciondigital.es\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Gu\u00eda para el desarrollo de sitios web\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/proyectos.comunicaciondigital.es\/#website\",\"url\":\"https:\/\/proyectos.comunicaciondigital.es\/\",\"name\":\"Portal de proyectos multimedia\",\"description\":\"Grupo Ciberimaginario\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/proyectos.comunicaciondigital.es\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-GB\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/proyectos.comunicaciondigital.es\/#\/schema\/person\/4699e2d8a8c19b218ae2f96940a3c337\",\"name\":\"Manuel Gertrudix Barrio\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-GB\",\"@id\":\"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/litespeed\/avatar\/f3575d3bb447e8a94fb03b29e11fe081.jpg?ver=1774885201\",\"url\":\"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/litespeed\/avatar\/f3575d3bb447e8a94fb03b29e11fe081.jpg?ver=1774885201\",\"contentUrl\":\"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/litespeed\/avatar\/f3575d3bb447e8a94fb03b29e11fe081.jpg?ver=1774885201\",\"caption\":\"Manuel Gertrudix Barrio\"},\"url\":\"https:\/\/proyectos.comunicaciondigital.es\/en\/author\/gertrudix\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Gu\u00eda para el desarrollo de sitios web - Portal de proyectos multimedia","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/proyectos.comunicaciondigital.es\/en\/guia-diseno-web\/","og_locale":"en_GB","og_type":"article","og_title":"Gu\u00eda para el desarrollo de sitios web - Portal de proyectos multimedia","og_description":"El desarrollo de un sitio web o cualquier otro producto de comunicaci\u00f3n digital\u00a0comprende una fase inicial de an\u00e1lisis que es esencial para el \u00e9xito de un\u00a0proyecto. La experiencia dicta que un an\u00e1lisis previo\u00a0riguroso de la soluci\u00f3n es esencial para lograr alcanzar los objetivos que se persiguen. Primero hay que tener claro qu\u00e9 se busca para&hellip; Continua leyendo Gu\u00eda para el desarrollo de sitios web","og_url":"https:\/\/proyectos.comunicaciondigital.es\/en\/guia-diseno-web\/","og_site_name":"Portal de proyectos multimedia","article_published_time":"2015-08-13T19:03:06+00:00","article_modified_time":"2022-09-08T18:42:41+00:00","og_image":[{"width":1100,"height":683,"url":"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/uploads\/2015\/08\/disen\u0303o-web.png","type":"image\/png"}],"author":"Manuel Gertrudix Barrio","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/proyectos.comunicaciondigital.es\/guia-diseno-web\/#article","isPartOf":{"@id":"https:\/\/proyectos.comunicaciondigital.es\/guia-diseno-web\/"},"author":{"name":"Manuel Gertrudix Barrio","@id":"https:\/\/proyectos.comunicaciondigital.es\/#\/schema\/person\/4699e2d8a8c19b218ae2f96940a3c337"},"headline":"Gu\u00eda para el desarrollo de sitios web","datePublished":"2015-08-13T19:03:06+00:00","dateModified":"2022-09-08T18:42:41+00:00","mainEntityOfPage":{"@id":"https:\/\/proyectos.comunicaciondigital.es\/guia-diseno-web\/"},"wordCount":4265,"image":{"@id":"https:\/\/proyectos.comunicaciondigital.es\/guia-diseno-web\/#primaryimage"},"thumbnailUrl":"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/uploads\/2015\/08\/disen\u0303o-web.png","articleSection":["banco-conocimiento"],"inLanguage":"en-GB"},{"@type":"WebPage","@id":"https:\/\/proyectos.comunicaciondigital.es\/guia-diseno-web\/","url":"https:\/\/proyectos.comunicaciondigital.es\/guia-diseno-web\/","name":"Gu\u00eda para el desarrollo de sitios web - Portal de proyectos multimedia","isPartOf":{"@id":"https:\/\/proyectos.comunicaciondigital.es\/#website"},"primaryImageOfPage":{"@id":"https:\/\/proyectos.comunicaciondigital.es\/guia-diseno-web\/#primaryimage"},"image":{"@id":"https:\/\/proyectos.comunicaciondigital.es\/guia-diseno-web\/#primaryimage"},"thumbnailUrl":"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/uploads\/2015\/08\/disen\u0303o-web.png","datePublished":"2015-08-13T19:03:06+00:00","dateModified":"2022-09-08T18:42:41+00:00","author":{"@id":"https:\/\/proyectos.comunicaciondigital.es\/#\/schema\/person\/4699e2d8a8c19b218ae2f96940a3c337"},"breadcrumb":{"@id":"https:\/\/proyectos.comunicaciondigital.es\/guia-diseno-web\/#breadcrumb"},"inLanguage":"en-GB","potentialAction":[{"@type":"ReadAction","target":["https:\/\/proyectos.comunicaciondigital.es\/guia-diseno-web\/"]}]},{"@type":"ImageObject","inLanguage":"en-GB","@id":"https:\/\/proyectos.comunicaciondigital.es\/guia-diseno-web\/#primaryimage","url":"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/uploads\/2015\/08\/disen\u0303o-web.png","contentUrl":"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/uploads\/2015\/08\/disen\u0303o-web.png","width":1100,"height":683,"caption":"disen\u0303o-web"},{"@type":"BreadcrumbList","@id":"https:\/\/proyectos.comunicaciondigital.es\/guia-diseno-web\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Portada","item":"https:\/\/proyectos.comunicaciondigital.es\/"},{"@type":"ListItem","position":2,"name":"Gu\u00eda para el desarrollo de sitios web"}]},{"@type":"WebSite","@id":"https:\/\/proyectos.comunicaciondigital.es\/#website","url":"https:\/\/proyectos.comunicaciondigital.es\/","name":"Portal de proyectos multimedia","description":"Grupo Ciberimaginario","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/proyectos.comunicaciondigital.es\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-GB"},{"@type":"Person","@id":"https:\/\/proyectos.comunicaciondigital.es\/#\/schema\/person\/4699e2d8a8c19b218ae2f96940a3c337","name":"Manuel Gertrudix Barrio","image":{"@type":"ImageObject","inLanguage":"en-GB","@id":"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/litespeed\/avatar\/f3575d3bb447e8a94fb03b29e11fe081.jpg?ver=1774885201","url":"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/litespeed\/avatar\/f3575d3bb447e8a94fb03b29e11fe081.jpg?ver=1774885201","contentUrl":"https:\/\/proyectos.comunicaciondigital.es\/wp-content\/litespeed\/avatar\/f3575d3bb447e8a94fb03b29e11fe081.jpg?ver=1774885201","caption":"Manuel Gertrudix Barrio"},"url":"https:\/\/proyectos.comunicaciondigital.es\/en\/author\/gertrudix\/"}]}},"_links":{"self":[{"href":"https:\/\/proyectos.comunicaciondigital.es\/en\/wp-json\/wp\/v2\/posts\/76344","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/proyectos.comunicaciondigital.es\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/proyectos.comunicaciondigital.es\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/proyectos.comunicaciondigital.es\/en\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/proyectos.comunicaciondigital.es\/en\/wp-json\/wp\/v2\/comments?post=76344"}],"version-history":[{"count":3,"href":"https:\/\/proyectos.comunicaciondigital.es\/en\/wp-json\/wp\/v2\/posts\/76344\/revisions"}],"predecessor-version":[{"id":81109,"href":"https:\/\/proyectos.comunicaciondigital.es\/en\/wp-json\/wp\/v2\/posts\/76344\/revisions\/81109"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/proyectos.comunicaciondigital.es\/en\/wp-json\/wp\/v2\/media\/77508"}],"wp:attachment":[{"href":"https:\/\/proyectos.comunicaciondigital.es\/en\/wp-json\/wp\/v2\/media?parent=76344"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/proyectos.comunicaciondigital.es\/en\/wp-json\/wp\/v2\/categories?post=76344"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/proyectos.comunicaciondigital.es\/en\/wp-json\/wp\/v2\/tags?post=76344"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}