Las Páginas Web: posibilidades educativas

Loading...

Flash Player 9 (or above) is needed to view presentations.
We have detected that you do not have it on your computer. To install it, go here.

0 comments

Post a comment

    Post a comment
    Embed Video
    Edit your comment Cancel

    3 Favorites

    Las Páginas Web: posibilidades educativas - Presentation Transcript

    1. “ Las Páginas Web: posibilidades educativas” Pedro Cuesta Morales Departamento de Informática (Universidade de Vigo) CURSO: Elaboración da páxina web docente
    2. Índice
        • Fundamentos
        • Criterios de calidad
        • Posibilidades educativas
        • Elaboración de una web docente
        • Herramientas
    3. 1. Fundamentos
      • WEB: Sistema de información basado en hipertexto, hoy en día hipermedia
        • Hipertexto : es un sistema de presentación de documentos en el que las diferentes páginas que contienen la información no siguen una secuencia lineal, sino que se relacionan a través de enlaces entre ellas (“link”)
        • Hipermedia: es un sistema de presentación de información que utiliza más de un medio en un mismo documento: texto, imágenes, sonido, animaciones, formularios, ...
    4. Proceso de visualización de una página Web Navegador
    5. Sitio Web: conjunto de ficheros
      • Un sitio Web va a estar formado por una conjunto de archivos organizados en carpetas:
        • Páginas web: htm/html
        • Imágenes: gif, jpg, ...
        • Documentos: doc, ppt, pdf, ...
        • Otros: css, swf, ...
      • Un sitio Web también puede estar formado por información almacenada en bases de datos y recuperada dinámicamente
    6. Sitio Local / Servidor web
      • Aunque la creación de las páginas se hace en un equipo local es necesario alojarlas en un equipo conectado permanentemente a la red  Servidor Web
      • Espacio para alojar las páginas de los centros:
        • http://centros.edu.xunta.es/
    7. 2. Criterios de calidad
      • Facilitar la navegación por las páginas
      • Estructurar adecuadamente la información
      • Utilizar un estilo homogéneo
      • Tiempo de descarga prudencial
    8. Facilitar la navegación por las páginas
      • Uno de los aspectos más importantes es que el usuario no se pierda en la estructura del web, que sepa en todo momento donde está y como moverse entre las diferentes secciones.
        • Índices siempre visibles
        • Títulos de sección
        • Botones de navegación, ...
      • Poder regresar siempre a la página principal o a las principales secciones
    9. Estructurar adecuadamente la información
      • El objetivo tiene que ser ofrecer al usuario la información que desea con el mínimo de pasos posibles y en el tiempo más corto
      • Construir una jerarquía de información eficiente para minimizar el número de pasos a través de páginas con menús
      • “ Es recomendable que no haya que dar mas de tres clicks para llegar a la información requerida”
    10. Utilizar un estilo homogéneo
      • El que todas las páginas sigan un mismo estilo:
        • mejora la visión global del sitio
        • ofrece una imagen corporativa y
        • ayuda a identificarlo
    11. Tiempo de descarga prudencial
      • Si las páginas están “sobrecargadas” (muchas imágenes o elementos multimedia) necesitarán mucho tiempo para cargarse
      • El típico usuario de Internet no suele tolerar esperar demasiado tiempo para cargar una página
      • Errores habituales:
        • Páginas muy grandes, con muchos contenidos (imágenes, sonido, …)
        • Páginas con fotos extraídas directamente de una cámara digital
        • Enlaces a documentos (p.e. presentaciones powerpoint) demasiado grandes, …
    12. 3. Posibilidades educativas: Webs docentes
      • Página Web utilizada como soporte al proceso de enseñanza/aprendizaje
        • “ Un sitio web creado para guiar o facilitar el aprendizaje de unos determinados conocimientos”
      • Web elaborado por profesores para la enseñanza de una asignatura:
        • Guía didáctica o programación (objetivos, contenidos, procedimientos, evaluación,...)
        • Acceso a materiales: apuntes, ejercicios, esquemas, …
        • Canales de comunicación interpersonal: correo, foros, ...
        • Noticias y novedades (tablón de anuncios)
        • Enlaces de interés, …
    13. Ventajas
      • Facilita la publicación y actualización de contenidos
      • Acceso “permanente” a la información
      • Permite a los alumnos estructurar su propio aprendizaje (a que acceder y en qué orden)
      • Facilita la comunicación profesor-alumno
    14. Inconvenientes
      • Necesidad de formación adecuada del profesorado (TIC, diseño Web, tratamiento de imágenes, …)
    15. Actualidad: herramientas de teleformación
      • Descarga de contenidos
      • Agenda
      • Foros
      • Chat
      • Cuestionarios de autoevaluación
      • Secuencias de aprendizaje
      • Glosario, …
    16. 4. Elaboración de una web docente
      • En la construcción de un sitio web entran en juego dos aspectos:
        • Contenidos  la información que ofrece el sitio. Es importante una buena estructuración/organización de los mismos.
        • Diseño gráfico  la interfaz utilizada. Un diseño atractivo aporta calidad al sitio. Sin olvidar que ha de facilitar la navegación por los contenidos.
    17. 4. Elaboración de una web docente
      • Etapas:
        • Análisis inicial
        • Diseño de la Web
        • Construcción
        • Publicación
        • Mantenimiento
    18. Análisis inicial
      • ¿Qué pretendemos con la Web? /¿Cuáles son los objetivos del sitio Web que queremos construir?
        • Web de una materia, de un departamento, de un centro, …
        • Ofrecer información complementaria o utilizarla como soporte a la enseñanza presencial
      • Es importante conocer el perfil del usuario de nuestra Web, ¿A quien va dirigido?
        • P.e. no la organizaremos igual para alumnos de educación infantil que para alumnos de bachillerato
      • ¿Qué información/contenidos queremos ofrecer? Y ¿cómo organizarlos?
    19. Diseño de la Web
      • Organización de la información :
        • Estructurar información: secciones principales – subsecciones
      • Diseño de la interfaz (estilo gráfico):
        • Se tiene en cuenta (si existe) material gráfico existente (folletos, logos, etc.)
        • Se realizan bocetos en papel o utilizando herramientas gráficas
        • Se eligen colores a utilizar, fondo, tipos de letra, ...
    20. Construcción
      • Utilizando herramientas adecuadas se crean las páginas y los contenidos que se van a ofrecer (siguiendo las normas de estilo definidas)
        • Texto, imágenes,…
        • Enlaces entre páginas (elementos de navegación),…
      • Probar la corrección del sitio:
        • Visualización (navegador)
        • Enlaces, …
    21. Publicación
      • Una vez construido y validado el sitio Web hay que publicarlo en Internet
        • Proceso de transferencia de archivos desde un ordenador local a un servidor Web
        • Determinación de la dirección del sitio (URL)
      • “ Publicitar” el sitio:
        • Proporcionar la dirección a los usuarios a los que va dirigida
        • Enlazar en otras Webs
        • Proporcionar la URL al suministrar otra información
    22. Mantenimiento
      • Parte de la información publicada en el web es perecedera , seguro que necesitará con el tiempo una revisión  necesidad de mantenimiento
      • “ Una Web es realmente útil si está actualizada”
      • Cambios:
        • Nuevas páginas, modificar contenidos, eliminar información “caducada”, y… corregir errores!
      • Proceso:
        • Realizar cambios en nuestro equipo local y volver a publicar las modificaciones (o todo el sitio Web)
    23. 5. Herramientas
      • Las páginas Web se crean en HTML
        • Editores: Dreamweaver, Frontpage, …
      • Contienen gráficos/imágenes
        • Herramientas de tratamiento de imágenes: Photoshop, Firefox, Paint Shop Pro, …
      • Contenidos multimedia: flash, video, …
        • Herramientas de generación de contenidos multimedia
      • Herramientas de publicación (ftp, …):
        • WS_FTP, filezilla, …
      • Utilidades:
        • Conversión a PDF, …
    24. HTML
      • HTML (“ Hypertext Markup Language ”): lenguaje en el que se escriben las páginas web
      • U n conjunto de códigos especiales o "etiquetas", que le indican al navegador Web cómo mostrar un documento de hipertexto
      • Las etiquetas de HTML empiezan por “ < “, seguido del nombre de la etiqueta y por “>”. Por ejemplo:
        • Etiquetas independientes: <HR>,<BR>, ....
        • Etiquetas por pares, con una etiqueta de comienzo y otra de finalización : <B> texto </B>
    25. Estructura básica de una página web (html)
      • <HTML>
      • <HEAD>
      • <TITLE> Título del documento</TITLE>
      • </HEAD>
      • <BODY>
      • Contenido del documento
      • </BODY>
      • </HTML>
      “ Una página web es un archivo de texto”
    26. Edición de páginas web:
      • Cualquier editor de texto (p.e. Bloc de Notas):
        • Escribe los códigos correspondientes de la página y se almacena con la extensión “htm” o “html”
        • Inconveniente: dominar el lenguaje HTML
      • Utilizar programas específicos para la creación de páginas web: FrontPage, Dreamweaver, ...
        • Pensados para facilitar la creación de sitios web
        • Editores WYSIWYG (“What You See Is What You Get”)
      Navegador : simplemente interpreta las etiquetas y permite la navegación por los contenidos hipermedia

    + Pedro CuestaPedro Cuesta, 3 years ago

    custom

    4157 views, 3 favs, 5 embeds more stats

    Fundamentos. Criterios de calidad. Posibilidades ed more

    More info about this document

    CC Attribution-NonCommercial-ShareAlike LicenseCC Attribution-NonCommercial-ShareAlike LicenseCC Attribution-NonCommercial-ShareAlike License

    Go to text version

    • Total Views 4157
      • 4149 on SlideShare
      • 8 from embeds
    • Comments 0
    • Favorites 3
    • Downloads 0
    Most viewed embeds
    • 3 views on http://elearning.tadelformacion.com
    • 2 views on http://camaraforma.tadelformacion.com
    • 1 views on http://postgrado.ei.uvigo.es
    • 1 views on http://www.telefonica.net
    • 1 views on http://pedrocuesta.blogspot.com

    more

    All embeds
    • 3 views on http://elearning.tadelformacion.com
    • 2 views on http://camaraforma.tadelformacion.com
    • 1 views on http://postgrado.ei.uvigo.es
    • 1 views on http://www.telefonica.net
    • 1 views on http://pedrocuesta.blogspot.com

    less

    Flagged as inappropriate Flag as inappropriate
    Flag as inappropriate

    Select your reason for flagging this presentation as inappropriate. If needed, use the feedback form to let us know more details.

    Cancel
    File a copyright complaint
    Having problems? Go to our helpdesk?

    Categories