Aprendizajes Adquiridos

El realizar este blog y nutrirlo con informaión relacionada al diseño web, nos ha permitido investigar, seleccionar, analizar y poner en práctica diversos tipos de aprendizajes desde el algoritmico al heuristico.

Es muy importante que el estudiante no sea repetitivo sino que ponga su imaginación a volar y pueda ser muy creativo.

Hemos aprendido muchisimo en esta asignatura desde la creación de un sitio web, worpress que nunca lo habiamos utilizado y sus grandes ventajas para publicar contenidos online, los metadatos que es la nueva revolución de la web y el formato doublin core que permite filtrar la información en esta era en que la red es una gran máquina sobresaturada de información.

El querer aprender hoy depende de nosotros, asi que a explorar se ha dicho porque existen innumerables recursos a nuestra dispocisión y gratuitos, solo tenemos que animarnos.

Gracias profesora por sus orientaciones para enseñarnos a crear, investigar cosas novedosas.

Estructura vs Diseño del sitio web

Diferencia entre Estructura vs.Diseño

Estructura:se refiere a la forma que tendrá el Sitio Web en términos generales con sus secciones, funcionalidades y sistemas de navegación. No considera ni incluye elementos gráficos (logotipos, viñetas, etc.).


Diseño:se refiere a la solución gráfica que se creará para el sitio, en la cual aparecen colores, logotipos, viñetas, y otros elementos de diseño que permiten identificar visualmente al sitio.

Dado lo anterior, cuando hablamos de la estructura nos estamos refiriendo básicamente a cuál será la experiencia que tendrá un usuario cuando accede al sitio. De esta manera podremos determinar dónde estarán ubicados los servicios interactivos (buscador, sistemas de encuestas, áreas de contenidos).

Gracias a la realización de esta etapa es posible discutir en términos muy prácticos cuál será la oferta de elementos de información e interacción que tendrá el usuario. Al no incluir elementos de diseño, se permite que la discusión sobre la estructura se desarrolle en aspectos concretos, sin que intervengan aún consideraciones
estéticas que habitualmente atrasan la aprobación de esta etapa del desarrollo.

Referecias

Guía web 1.0

Esta página , es un buen ejemplo para oreintarse en el diseño web porque la misma describe cada una de las etapas que conlleva realizar un sitio web. Se puede apreciar en la misma un sistema de navegación local con marcos o frames y tablas de contenidos con indices.

te invito a explorar la Guía web 1.0

Diseños de Sitios y Paginas Web

Presentación sobre Diseño Web

View more PowerPoint from Marcelo Freitas

Diseño Fisico de una Pagina Web

Antes de Desarrollar en diseño Visual hay que definir la estructura fìsica de la pagina web a Desarrollar.

El Diseño de la estructura física como la teoría lo dice facilita el mantenimiento del sitio web desarrollado, esto requiere de una buena organización de los archivos que serán utilizados.

Ventajas que considero al construir una estructura física de recursos y almacenamiento de un sitio web:

·         Facilidad para localizar el lugar de almacenamiento de los archivos y carpetas

·         Mantenimiento eficiente de cada recurso utilizado por la clasificación de imágenes y otros archivos.

·         Claridad y entendimiento de cada componente,  agilizando las actualizaciones del servidor web.

·         Rapidez en el mantenimiento del sitio, incluso para los administradores web que no lo diseñaron.

La estructura física jerarquizada utilizada como una norma o regla garantiza un sitio web organizado y libre de complicaciones que entorpezcan el trabajo.

Diseño Visual - Diagramación

Software para hacer diagramas

Existen diferentes aplicaciones software que se utilizan para la confección de diagramas. Para una mejor comprensión de los mismos se han clasificado en 2 grupos: los que originalmente fueron ideados para hacer diagramas, y los que originalmente no fueron pensados para diagramación, pero que también pueden usarse con este objetivo ya que son poderosas herramientas de diseño gráfico.


Algunas aplicaciones software que fueron ideadas para hacer diagramas:
SmartDraw (http://www.smartdraw.com)
Microsoft Visio (http://www.microsoft.com)
iGrafx Flowcharter (http://www.igrafx.de)
DENIM & Silk. (http://guir.berkeley.edu/projects/denim/)
Mindmanager (http://www.mindjet.com)
Freemind (http://freemind.sourceforge.net/)
OmniGraffle (OSX) (http://www.omnigroup.com)

Aplicaciones software que no fueron ideadas específicamente para hacer diagramas:
Corel Draw (http://www.corel.com)
Adobe [antes Macromedia] Freehand (http://www.adobe.com)
Adobe Illustrator (http://www.adobe.com)

Tipos de Sistemas de Navegación

Durante el diseño de un sitio web, generalmente se incluyen varios tipos de Sistema de Navegación. Para lograr el éxito es necesario conocerlos y entender en qué medida ofrece flexibilidad y una noción del contexto en el que nos encontramos. Pueden identificarse cuatro tipos de Sistema de Navegación, ellos son:

- Sistemas de navegación jerárquicos: es el más tradicional. Ofrece acceso a los diferentes niveles jerárquicos inferiores a partir de la página inicial. Frecuentemente presenta inconvenientes para la navegación horizontal por lo que se recomienda combinarlo con otros sistemas. Ofrece conceptos muy detallados e incluidos bajo conceptos más generales, esto es, los conceptos más generales se desglosan en conceptos más detallados que son relacionados con eventos u objetos individuales.

- Sistemas de navegación globales: Este sistema complementa a uno jerárquico. Brinda la posibilidad de navegación tanto a lo profundo como a lo largo del sitio - navegación vertical y horizontal. Es común el establecimiento de reglas que regulen las condiciones y situaciones en las que se utilizará la navegación según el nivel dentro del sitio.

- Sistemas de navegación locales: Para comprender la necesidad de implementar un SNL es necesario entender el concepto de subsede o subsitio. El diseño visual debe tener cierta coherencia entre módulos. La estructura de navegación debe ser igualmente coherente entre módulos y ésta debe incluir navegación local para el subsitio o módulo, y la navegación global del sitio de contenido principal, es decir, se debe apreciar ambos sistemas claramente.


- Sistemas de navegación específicos: Se utiliza principalmente cuando no es posible clasificar las relaciones entre las páginas web en algunos de los sistemas de navegación anteriores. El ejemplo más ilustrativo se encuentra en los enlaces dentro de un texto hacia otro documento relacionado, esté o no en el sitio. Es muy frecuente hallar este tipo de navegación en revistas digitales que los incluyen en las notas finales o a pie de página (imitando a las publicaciones impresas). Este tipo de Navegación es común encontrarlo en las Wikis.