Diseno Web
Upcoming SlideShare
Loading in...5
×
 

Diseno Web

on

  • 3,282 views

Es una Web de interés educativo, diseñado con un objetivo pedagógico. Busca facilitar aprendizajes o acceso a recursos didácticos Proporciona información, comunicación y formación, ...

Es una Web de interés educativo, diseñado con un objetivo pedagógico. Busca facilitar aprendizajes o acceso a recursos didácticos Proporciona información, comunicación y formación, convirtiéndose...

Statistics

Views

Total Views
3,282
Views on SlideShare
3,282
Embed Views
0

Actions

Likes
2
Downloads
74
Comments
1

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Diseno Web Diseno Web Presentation Transcript

  • Diseño de Páginas Web y Portales Educativos Unidad I. Semiología aplicado al diseño multimedia de páginas Web. Sección de Post Grado Doctorado en Educación Robert Aldo Velásquez Huerta Mg. Informática y Multimedios [email_address]
  • I. Internet: Aplicaciones
    • Consultar información
    • Servicios públicos
    • Consultar diarios
    • Acceso a base de datos
    • Radio/Tv
    • Intercambio información
    • Crear información
    • Descargar archivos
  • I. Internet: Aplicaciones
    • Consultar información
    • - Millones de páginas con información de todo tipo y en diferentes idiomas
    • - Accedemos mediante los buscadores (google, quintura)
  • I. Internet: Aplicaciones
    • Servicios Públicos
    • - Acceso a información y servicios a través de Internet
    • - Web del estado (e-government)
    • - Trámites administrativos en línea
  • I. Internet: Aplicaciones
    • Consultar Periódicos
    • - Webs de los periódicos y revistas
    • - Ofrecen la misma información que las ediciones impresas
  • I. Internet: Aplicaciones
    • Acceso a Bases de Datos
    • - Bases de datos de investigaciones
    • - Accesos a bibliotecas
  • I. Internet: Aplicaciones
    • Radios, TV, música, videos
    • - Transmisión de sonidos (podcast )y video (broadcast)
    • - Acceso a radios y televisión en línea.
  • I. Internet: Aplicaciones
    • Intercambio de información – comunicación
    • - Correo electrónico
    • - Mensajería electrónica MSN
    • - Mensajes a móviles SMS
    • - Chat
    • - Telefonía IP
    • - Videoconferencia
  • I. Internet: Aplicaciones
    • Crear Información
    • - Construir su propia página Web
    • - Generar una bitácora (Blogs)
  • I. Internet: Aplicaciones Educativas
    • Comunicación interpersonal
    • Elimina las distancias y los muros de la clase, favorece actividades entre grupos.
    • - Correspondencia telemática ( kidlink )
    • - Clases globales
    • - Tutoría virtual
    • - Reuniones virtuales
  • I. Internet: Aplicaciones Educativas
    • Recogida de información
    • Se orienta a recabar información inédita utilizando las herramientas de comunicación
    • - Encuestas por correo
    • - Cuestionarios en la Web
  • I. Internet: Aplicaciones Educativas
    • Trabajo colaborativo en grupo
    • Comprende la construcción de los conocimientos a través del trabajo en grupo.
    • Obliga al estudiante a desarrollar capacidades para el trabajo en grupo
    • - Creación colectiva. Secuencial o conjunta, se puede emplear el e-mail o herramientas colaborativas (Wiki, editores en línea )
    • - Concursos como motivación para realizar una tarea escolar,
  • I. Internet: Aplicaciones Educativas
    • Búsqueda de información y acceso a recursos
    • - La red tiene una gran cantidad de documentos en formato digital (textos, imágenes, música, programas, etc.)
    • - Proyectos que implican la investigación, exploración de Internet en busca de datos e informaciones. (WebQuest)
    • - Herramientas para la búsqueda y selección de información (google, quintura,etc.)
  • I. Internet: Aplicaciones Educativas
    • Publicación electrónica
    • - La Web es el servicio con mayor difusión.
    • - La publicación y difusión de información no tiene control.
    • - Se requiere un mínimo de conocimientos técnicos.
  • I. Internet: Aplicaciones Educativas
    • Autoaprendizaje y formación continua.
    • - Los diversos servicios posibilitan generar entornos de autoaprendizaje.
    • - Sistemas de enseñanza virtual (e-learning), para actividades de formación y entrenamiento.
  • II. Portales: ¿Qué es un portal?
    • Es un conjunto de páginas Web o Web site que sirve como un punto de entrada único a la información de una institución o empresa.
    • Los portales deben estar organizados de forma que para los usuarios sea fácil, cómodo e intuitivo encontrar la información que desean.
    • Actúa como punto de entrada a Internet
    • Concentra servicios y productos
    • Organiza Internet ayudando a los usuarios en sus requerimientos de información.
    • Cuentan con un mecanismo de búsqueda
  • II. Portales: Características
    • Entre las características claves que debe cumplir un buen portal están:
    • Un diseño agradable de sus páginas y una interfaz de fácil uso para los usuarios
    • Proporcionar mecanismos de organización y búsqueda de información
    • Proveer mecanismos de gestión y seguridad adecuados
    • Permitir el acceso a una variedad de recurso, no sólo HTTP.
  • II. Portal: Aplicaciones Educativas
    • Servicios.
    • - Búsqueda de información. (Buscador o índices)
    • - Cuentas de acceso a e-mail
    • - Noticias ( suscripciones rss)
    • - Entretenimientos (páginas personales)
    • - Servicios comunicaciones (chat, foros)
    • - Descargas
    • Contenidos.
    • - Información (noticias, información especializada, galerías, etc.)
    • - Comunidades virtuales.
    • - Directorios de información.
  • II. Portal: Aplicaciones Educativas
  • II. Portal: Clasificación
    • Temporales
    • - Tienen una vida limitada
    • - Objetivo es informar y promocionar eventos
    • Medios de opinión
    • - Publicaciones diarias de prensa o académicos
    • - Fácil mantenimiento para facilitar su actualización
    • Ejm. Colegio de Arquitectos
    • Entretenimiento
    • - Su contenido es light
    • - Variedad y originalidad de entretenimientos
    • - El chat es uno de sus mayores servicios
    • Ejm. Terra
    • Consumidores
    • - Uso de consumidores o clientes finales
    • - Permite transacciones comerciales de compra
    • Ejm. Hiraoka
  • II. Portal: Clasificación
    • Business to business
    • - Orientado solo a usuarios finales, no pueden realizar transacciones
    • - Acceso a catálogos y enlaces de productos
    • Ejm. Unique
    • Información
    • - Sitios de información y corresponden a organismos educativos, cultural, etc.
    • Ejn. Espacios educativos
    • Educativos
    • - Brindan servicios de formación, capacitación
    • - Brindan recursos para los docentes, educadores y público en general
    • Ejm. Huascarán. Enlaces
  • II. Portal: Aplicaciones Educativas
    • Servicios.
    • - Búsqueda de información. (Buscador o índices)
    • - Cuentas de acceso a e-mail
    • - Noticias ( suscripciones rss)
    • - Entretenimientos (páginas personales)
    • - Servicios comunicaciones (chat, foros)
    • - Descargas
  • III. Web educativa: ¿Qué es?
    • Es una Web de interés educativo, diseñado con un objetivo pedagógico.
    • Busca facilitar aprendizajes o acceso a recursos didácticos
    • Proporciona información, comunicación y formación, convirtiéndose en un espacio virtual de trabajo individual y colaborativo.
    • Pueden ser Web personales (Web docente), institucionales (Portales educativos), formativas (Campus virtuales)
  • III. Web educativa: Etapas construcción
    • Etapa de Conceptualización (Prediseño)
    • - Objetivo
    • - Público
    • - Contenidos
    • - Estructura
    • - Visualización
    • Etapa de armado y configuración (Construcción)
    • - Diseño gráfico (textos, fondos, imágenes, tablas, marcos)
    • - Diseño de las páginas (estructura de los contenidos)
    • - Establecer enlaces (estructura de navegación, elementos de exploración)
    • - Incorporar multimedias (videos, sonidos)
    • - Incorporar archivos (download)
  • III. Web educativa: Etapas construcción
    • Etapa de puesta en marcha (Implementación servidor)
    • - Pruebas de funcionamiento links, multimedia, scripts
    • - Ajustes finales
    • - Publicación del Web
  • III. Web educativa: Prediseño ¿para que? OBJETIVOS ¿qué,cuánto? CONTENIDOS ¿para quienes? PUBLICO ¿cómo? ESTRUCTURA ¿cómo? VISUALIZACION Se determinan mutuamente Qué les interesa Cómo buscarán Orientación Estética/ Cultura/ Gustos Cómo se encuentran las cosas Cómo se organizan Qué contener para cumplirlos
  • III. Web educativa: Objetivos
    • Establece los propósitos de su elaboración y publicación.
    • ¿Para que se realiza esta página Web?
      • Para presentar la imagen de la institución educativa como la mejor ante la comunidad educativa y el contexto local
      • Para que la comunidad educativa (docentes y estudiantes) accedan a información y recursos para apoyar los procesos de formación
  • III. Web educativa: Público
    • Establecer la población a la que pretendemos alcanzar con la Web.
    • ¿Para quienes es esta página Web?
      • Establecer un identi-kit del publico, definir sus intereses, inclinaciones, gustos, preferencias, etc. en general y particular
      • Esa gente ¿qué busca en mi página?
      • Información posibilita establecer los criterios del diseño de contenidos, lenguaje y estética.
  • III. Web educativa: Contenidos
    • Es la información y recursos que se presenta en la página Web.
    • ¿Qué información y recursos es lo que interesa?
      • Información y recursos deben ser significativos, interesantes, útiles para le publico.
      • El lenguaje para tratar la información debe ser adecuada, concisa y concreta. No lenguaje insinuante ni ambiguo.
  • III. Web educativa: Estructuras Jerárquica lineal mixta Red
    • La relación de las páginas entre si configuran la estructura del sitio.
    • La estructura debe responder a los criterios de búsqueda.
    • ¿Cómo se intentará encontrar la información?
    • Conviene dividir las unidades de información en sub-unidades pequeñas, completas y coherentes luego enlazarlos
  • III. Web educativa: Visualización
    • Se refiere a los aspectos de la visualización de una página Web
    • ¿Cómo se deben ver la página los usuarios?
    • Los elementos gráficos deben enmarcarse a los objetivos y aspectos culturales del publico.
    • No se debe “decorar” o “adornar” con elementos que distorsionan el mensaje.
    • La estética no debe adecuarse a los gustos y preferencia de los responsables.
  • III. Web educativa: Visualización
    • La página debe ser fácil de cargar.
    • Las páginas deben ser fáciles de leer
    • Establecer guías visuales
  • III. Web educativa: Consideraciones para el diseño
    • Diseño estructural
    • - Fragmentación de contenidos : División lógica de los contenidos, mantener la estructura conceptual, aprovechar la fragmentación hipertextual.
    • - Construcción de la estructura : definición de la jerarquía, organización de los niveles de información
    • - Sistema de navegación : elementos que permiten explorar las páginas, rutas a seguir por los usuarios, definir los caminos de exploración.
    • Diseño gráfico
    • - Textos : letras fácilmente legibles, tamaño (no -12), párrafos breves, uso adecuado de las mayúsculas.
    • - Fondos : contraste adecuado para legibilidad de los textos, no muchas tramas, fondos como elementos de orientación y comunicación.
  • III. Web educativa: Consideraciones para el diseño
    • - Imágenes : deben cumplir una función, tamaño proporcional, tamaño en bytes.
    • - Tablas: no ajustar a los márgenes, aprovechar para ordenar el diseño.
    • - Marcos: proporcionar una simetría adecuada
    • Visión global
    • - Definir las características de los títulos, subtítulos, y cuerpo del texto.
    • - Elección de fuentes , colores, apariencia de los hipervínculos.
    • - Definir los fondos , elementos multimediales a incluir (videos, sonidos).
  • III. Web educativa: Consideraciones para el diseño
    • Otras consideraciones
    • - Compatibilidad con los navegadores
    • - Compatibilidad de resoluciones
    • - Facilidad de navegación
    • - Rapidez al cargar páginas gráficas
    • - Considerar las actualizaciones
  • La información y la libertad son indivisibles. La revolución informática es inimaginable sin la democracia y la verdadera democracia es inimaginable sin la libertad de información. Kofi Annan