Diagramación de

un sitio web
En que consiste la diagramación

 Consiste en la representación de los contenidos que tendrá un producto

digital, y las relaciones entre dichos contenidos.

 El diseño web es una actividad que consiste en la planificación, diseño e

implementación de sitios web y páginas web. No es simplemente una
aplicación del diseño convencional, ya que requiere tener en cuenta
cuestiones tales como navegabilidad, interactividad, usabilidad,
arquitectura de la información y la interacción de medios como
el audio, texto, imagen y vídeo. Se lo considera dentro del Diseño
Multimedial.
Diseño con Jerarquía

 La unión de un buen diseño con una jerarquía bien elaborada de contenidos aumenta la
eficiencia de la web como canal de comunicación e intercambio de datos, que brinda
posibilidades como el contacto directo entre el productor y el consumidor de contenidos,
característica destacable del medio.
Creación de una página web

 Para la creación de páginas WEB bien estructuradas, debemos saber de antemano el

mensaje que se desea transmitir. Las imágenes y los elementos a utilizar serán distintos si
se plantea una WEB para vender un producto, o para dar información o para publicar un
trabajo científico. En este último caso, la página debe dar una imagen más formal.
Perfilar una línea de diseño

 La línea de diseño debe ser coherente y homogénea, que mantenga una apariencia visual
común: los mismos colores o motivos de fondo, el mismo estilo de líneas divisorias
horizontales y verticales, los mismos iconos o viñetas o los mismos logotipos gráficos
siempre en la misma posición de la página. Su aspecto profesional con elementos comunes
hará que los usuarios visiten las páginas con orden y no se pierdan pensando que están en
otra Web.
Crear el organigrama
de navegación

 Planificar cómo van a desplazarse los usuarios por

ellas. Se debe realizar un diagrama de flujo claro
para definir los índices principales, las páginas
secundarias y las ramificaciones de todos los
documentos.
Definición de estilo

 Una vez creada la estructura básica del WEB, se debe definir el estilo de las páginas.
Resulta práctico crearse una página de estilo para aplicar a todas las páginas que vayamos
generando, incluyendo los logotipos, encabezados y pies.
Como organizar una página web

 La forma de estructura del contenido de la web será determinante para que los usuarios
encuentren o no lo que buscan. Por tanto, ésta debe facilitar y agilizar al máximo la
búsqueda de información de tus visitantes. Para crear la estructura, puede ser útil hacer
un inventario de todo el material a exponer en la página e ir organizándolo en un primer
momento por temas para después construir gráficamente la estructura de la web.
Como organizar una página web

 Página de Inicio
 La página de inicio es la principal puerta de entrada de visitas por lo que se debe adaptar su
estructura a tu público objetivo, haciendo bien visibles los contenidos que más pueden
interesarles y especificar claramente qué se va a encontrar. Por otro lado, algo tan sencillo como
incluir un enlace bien visible a la página principal , se usa mucho también un enlace en el banner o
logo de la cabecera que apunte a la página principal del sitio.
Como organizar una página web

 Diseño del menú de navegación

 Una de las cosas más importantes a la hora de estructurar la página es el diseño del menú de
navegación , cuáles son las secciones más grandes ,cuáles agrupan más contenido, esas pueden ser
las secciones en el menú principal.
Tipos de estructuras de sitios web

 Sitio web estático

 Las páginas web estáticas son aquellas realizadas en HTML que pueden mostrar en alguna parte
de la página objetos en movimiento tales como banners, gifs animados, videos, etc. es aquel cuyo
contenido no se cambia con frecuencia y se actualiza de forma manual por alguna persona o
personas a través de programas editores de páginas web. En este tipo de web la información
actualizable son pequeños detalles como sustitución de fotos, o de telefono, dirección.
Tipos de estructuras de sitios web

 Pagina web animada

 Son aquellas que se realizan con la tecnología FLASH, ésta permite que una página web presente el
contenido con ciertos efectos animados continuados. El uso de esta tecnología permite diseños
más vanguardistas, modernos y creativos.
Tipos de estructuras de sitios web

 Sitio web dinámico

 Es aquel que necesite cambios frecuentes en la información. Suelen ser secciones de noticias,
ofertas, boletines...Entre los tipos de programación dinámica, destacan la programación en PHP,
Active Server Pages (ASP), y Java Server Pages (JSP).Los sitios dinámicos a menudo incluyen
contenido que se recupera de una o más bases de datos o usando tecnologías basadas en XML como
por ejemplo el el RSS.Existen también contenidos activos mostrados mediante Flash, Shockwave o
Java.
Tipos de estructuras de sitios web

 Sitio web institucional

 Los sitios institucionales pequeños son diseñados para que una empresa tenga presencia en
Internet. No pueden funcionar como la principal herramienta publicitaria para una compañía.

 Los sitios Web institucionales grandes son creados para darle a una compañía gran presencia en
Internet. Son generalmente orientados a la venta, que están formados por más de 15 páginas.

 Los sitios Web institucionales son una herramienta muy poderosa para las empresas. Estos
espacios virtuales son utilizados generalmente con el fin de incrementar el mercado internacional.
Tipos de estructuras de sitios web

 Catálogos online o electrónicos

 Los catálogos online son sitios Web orientados a la promoción de productos y servicios. Varias
páginas dinámicas conforman estos catálogos para mostrar los diferentes tipos de productos,
descripciones, ofertas, etc.

 Contiene este tipo de secciones: Información de empresa, negocio, fundación, etc. Catálogo de los
productos o servicios que se ofrecen. Formas de contacto.
Tipos de estructuras de sitios web

 Sitios web de comercio electrónico

 Son aplicaciones de negocios electrónicos destinados a transacciones comerciales. El objetivo
principal de estos sitios es la venta online. Estos espacios virtuales son realmente convenientes
para todo tipo de empresas, especialmente para pequeñas y medianas ya que les permite vender
productos a clientes
Tipos de estructuras de sitios web

 Portales Web
 Los portales Web ofrecen servicios de diferentes empresas. Son el tipo de sitio Web más extenso
que existe en Internet. Se los llama portales porque son puertas digitales a otros sitios.

 También son usados como fuentes de información, como directorios de libros electrónicos por
ejemplo, etc. Para su desarrollo también se utilizan lenguajes de códigos específicos