Unidad1 Guion OVI Kelly Johanna Garavito

Universidad Nacional Abierta y a Distancia – UNAD - Vicerrectoría Académica y de Investigación - VIACI Escuela: Ciencias Básicas Tecnología e Ingeniería Programa: Ingeniería de Sistemas Curso: Diseños de Sitios Web Código: 301122

Unidad 1: Fase de Diseño - Crear el Guión y la maquetación para un OVI en formato WEB con HTML5 y CSS3.

Presentado a: Mauricio Perdomo Vargas Tutor

Entregado por: Kelly Johanna Garavito Motta Código: 40740587

Grupo: 301122_43

UNIVERSIDAD NACIONAL ABIERTA Y A DISTANCIA - UNAD ESCUELA DE CIENCIAS BÁSICAS TECNOLOGÍA E INGENIERÍA SEPTIEMBRE DE 2017 FLORENCIA


ACTIVIDAD FASE DE PLANEACION Y ANALISIS CURSO DISEÑOS DE SITIOS WEB - COD. 301122 FORMATO GUION SITIO WEB DEL OVI Diseñado Por: Director Curso

CURSO:

Diseños de Sitios Web

CODIGO:

301122

1. Objetivos del OVI (describa mediante el registro de 1 objetivo general y tres específicos para que se construye este OVI)

Objetivo general: Fundamentar teóricamente a los estudiantes sobre las generalidades básicas del Diseño Web para que puedan utilizar de forma correcta los lenguajes HTML5 y CSS3, aplicarlos en la construcción de Sitios Web e implementarlos a través de sistemas de control de versiones. Objetivo específico 1: Ofrecer información para que el estudiante pueda operar y administrar sistemas de control de versiones como GIT o GITHUB. Objetivo específico 2: Brindar documentación para que el estudiante utilice de forma correcta los lenguajes HTML5 y CSS3 para aplicarlos en la solución de problemas de construcción de Sitios Web.

Objetivo específico 3: Brindar pautas para que le estudiante pueda evaluar y desarrollar Sitios Web que satisfagan las necesidades del usuario y dar recomendaciones concretas para su actualización.


2. Contenido informativo del OVI por secciones (Replique el siguiente cuadro de acuerdo al número de secciones que vaya a crear en el OVI) Nombre de la sección que se creara en el OVI: SECCION DE INICIO 2.1 Objetivo de la sección: (Registre a continuación el objetivo que tiene esta sección) Presentar la estructura, las generalidades y las unidades temáticas con que cuenta el curso de Diseño de Sitios Web.

2.2 Recursos de consulta que usara en la sección: (coloque el nombre del material que usara para crear los contenidos de la sección y el enlace de descarga de los mismos sean estos Texto, Imágenes, Audios o Vídeos) Tendencias de Diseño Web. Maida (2017). 5 tendencias del diseño web para el año 2017. Recuperado de: https://www.youtube.com/watch?v=YqTFlY5kkco. Tendencias de Diseño Web. Castaño (2017). 10 Tendencias de Diseño Web para 2017 y 2018. Recuperado de: https://www.youtube.com/watch?v=LWajvdpFn_c. Logo UNAD. UNAD (2017). Imagen PNG. Logo Universidad Nacional Abierta y a Distancia. Recuperado de: https://sur.unad.edu.co/templates/unadgeneral/images/logoUNAD.png Logo HTML. w3c.org (2017). HTML 5. Recuperado de: https://www.w3.org/html/logo/downloads/HTML5_Logo_512.png


2.3 Redacte un borrador del contenido de lectura en formato de texto que tendrá la sección: (Sea este la presentación de la sección, el contenido o ambos; redacte un borrador del texto que publicara como contenido en la sección coloque un subtítulo para identificar si corresponde a la presentación de la sección o el contenido de lectura de la sección) El curso de Diseño de Sitios Web está dirigido a estudiantes que estén interesados en el diseño web y la administración básica de sitios web. Presenta introducción, profundización e información complementaria sobre el uso de GIT y GIHUB para gestionar proyectos colaborativos de diseño web, HTML5 y CSS3 para creación de contenidos en formato web como páginas y sitios Web. El curso esta estructurado en 3 unidades didácticas: Unidad 1. Introducción al Diseño Web. HTML 5. CSS3. Las tres unidades abordan aspectos de desarrollo , implementación y administración de proyectos de diseño web, para el curso se define a su vez el uso de las Tics como agente mediador en el curso entre Docentes y Estudiantes; para esto la Universidad Cuenta con un campus virtual el cual posee elementos de aprendizaje interactivo como OVAS, Tutoriales y Vídeos, que se complementan con la aplicación de actividades académicas en línea y la utilización de canales síncronos y asíncronos de comunicación para el desarrollo del proceso académico que propone el curso. (Sillabus Curso de Diseño Web, 2017)


3. Contenido informativo del OVI por secciones (Replique el siguiente cuadro de acuerdo al número de secciones que vaya a crear en el OVI) Nombre de la sección que se creara en el OVI: INTRODUCCION 3.1 Objetivo de la sección: (Registre a continuación el objetivo que tiene esta sección) Presentar los conceptos básicos de Diseño de Sitios Web, Sistemas de Control de Versiones, aplicaciones web y diseño de interfaces web.

3.2 Recursos de consulta que usara en la sección: (coloque el nombre del material que usara para crear los contenidos de la sección y el enlace de descarga de los mismos sean estos Texto, Imágenes, Audios o Vídeos) Lectura Aplicaciones Web. Zofío Jiménez, J. (2013). Aplicaciones web. [N.p.]: Macmillan Iberia, S.A. Recuperado de:http://bibliotecavirtual.unad.edu.co:2162/openurl?sid=EBSCO%3aedsebk&g enre=book&issn=&ISBN=9788415656654&volume=&issue=&date=&spage=&p ages=&title=Aplicaciones+web&atitle=Aplicaciones+web&aulast=&id=DOI%3a& site=ftf-live Lectura Diseño de Interfaces Web. Córcoles Tendero, J. E. (2015). Diseño de interfaces web. Recuperado de: http://bibliotecavirtual.unad.edu.co:2077/lib/unadsp/reader.action?docID=1104 6236 Video Conceptos Básicos de Desarrollo Web. Farias Navarro (2013). Conceptos Básicos de Desarrollo Web, Curso de HTML y CSS. Recuperado de: https://www.youtube.com/watch?v=ddJng5IST1I


3.3 Redacte un borrador del contenido de lectura en formato de texto que tendrá la sección: (Sea este la presentación de la sección, el contenido o ambos; redacte un borrador del texto que publicara como contenido en la sección coloque un subtítulo para identificar si corresponde a la presentación de la sección o el contenido de lectura de la sección) Presentación. Estimado estudiante, la Universidad Nacional Abierta y a Distancia le da la bienvenida al curso de Diseño de Sitios Web. En esta sección encontrará los conceptos básicos y la introducción al fabuloso mundo del Diseño Web. Contenido. Actualmente la cultura Web está presente en nuestra vida diaria. Cualquier persona, sobre todo estudiantes de Diseño de aplicaciones Web, sabe o ha oído hablar de lo que es un sitio web. Un sitio web es un conjunto de páginas web agrupadas bajo un dominio y que comparten una dirección en la Web. Hoy por hoy, muchos son los sitios web que se pueden encontrar en Internet. De hecho, cualquier institución pública o privada posee un sitio en la Web. El siguiente video presenta los conceptos básicos de desarrollo web. Te invitamos a verlo. Concepto Básicos En el siguiente link encontrará un documento con información sobre planificación de interfaces, uso de estilos, implantación de contenido multimedia, desarrollo de webs accesibles, entre otros temas interesantes. Diseño de Interfaces Web El siguiente documento contiene información sobre evolución de las aplicaciones web, lenguaje de marcas, herramientas de comunicación y colaboración en línea y otros temas de mucha importancia para el diseño web. Aplicaciones Web


4. Contenido informativo del OVI por secciones (Replique el siguiente cuadro de acuerdo al número de secciones que vaya a crear en el OVI)

Nombre de la sección que se creara en el OVI: HTML5 4.1 Objetivo de la sección: (Registre a continuación el objetivo que tiene esta sección) Dar a conocer los conceptos básicos, estructura y nuevas características de HTML 5.

4.2 Recursos de consulta que usara en la sección: (coloque el nombre del material que usara para crear los contenidos de la sección y el enlace de descarga de los mismos sean estos Texto, Imágenes, Audios o Vídeos)

Guía de HTML. Vega, Van Der Henst (2011). Guía HTML. Recuperado de: https://radiosyculturalibre.com.ar/biblioteca/PROGRAMACION/HTML5/CursoHTML5-v1.pdf Logo HTML. w3c.org (2017). HTML 5. Recuperado de: https://www.w3.org/html/logo/downloads/HTML5_Logo_512.png


4.3 Redacte un borrador del contenido de lectura en formato de texto que tendrá la sección: (Sea este la presentación de la sección, el contenido o ambos; redacte un borrador del texto que publicara como contenido en la sección coloque un subtítulo para identificar si corresponde a la presentación de la sección o el contenido de lectura de la sección) Presentación. Estimado estudiante en esta sección encontrará los conceptos básicos, estructura y nuevas características de HTML 5. Bienvenidos… Contenido. HTML5 (HyperText Markup Language, versión 5) es la quinta revisión del lenguaje HTML. En conjunto con CSS3, define los nuevos estándares de desarrollo web, rediseñando el código para resolver problemas y actualizándolo así a nuevas necesidades. No se limita solo a crear nuevas etiquetas o atributos, sino que incorpora muchas características nuevas y proporciona una plataforma de desarrollo de complejas aplicaciones web. (Arkaitz (2014), https://www.arkaitzgarro.com/html5/capitulo-1.html) El siguiente link le permitirá ingresar y descargar una Guía Básica de HTML 5. Guía HTML 5


5. Contenido informativo del OVI por secciones Nombre de la sección que se creara en el OVI: CSS3 5.1 Objetivo de la sección: (Registre a continuación el objetivo que tiene esta sección) Presentar las diversas características y novedades de CSS3, con lecturas y videos cortos en los que se puede encontrar explicaciones sencillas y ejemplos. 5.2 Recursos de consulta que usara en la sección: (coloque el nombre del material que usara para crear los contenidos de la sección y el enlace de descarga de los mismos sean estos Texto, Imágenes, Audios o Vídeos) Guía Completa de CSS3. Navajas Ojeda (2017). Guía Completa de CSS3. Recuperado de: http://stadium.unad.edu.co/ovas/10596_9136/gua_completa_sobre_css3_anto nio_navajas.html CSS3 y HTML5. Damián De Luca y Alejandro De Luca (2010). CSS3 y HTML5. Recuperado de: http://html5.dwebapps.com/que-es-css3/. Introducción a CSS3. Peña, G. [Geekytuts]. (2016, febrero 24). Aprende HTML5 y CSS3 - Introducción al CSS - Video 8 [Archivo de video]. Recuperado de https://www.youtube.com/watch?v=NKYCOrnZomU Como Insertar CSS. Peña, G. [Geekytuts]. (2016, febrero 25). Aprende HTML5 y CSS3 - Cómo Insertar CSS - Video 9 [Archivo de video]. Recuperado de https://youtu.be/hMIBsaZn0VA Selectores en CSS. Peña, G. [Geekytuts]. (2016, febrero 26). Aprende HTML5 y CSS3 - Selectores Básicos de CSS - Video 10 [Archivo de video]. Recuperado de https://www.youtube.com/watch?v=ydC4j9BAf6w HTML5: HEADER, NAV, UL, LI con CSS3. Perdomo, M. [Mauricio Perdomo Vargas]. (2014, Octubre 12). VIDEOTUTORIAL - HTML5: HEADER, NAV, UL, LI CON CSS [Archivo de video]. Recuperado de https://www.youtube.com/watch?v=3raTq4ebDdQ HTML5: SECTION, ASIDE, FOOTER CON CSS3. Perdomo, M. [Mauricio Perdomo Vargas]. (2014, Octubre 17). VIDEOTUTORIAL - HTML5: SECTION, ASIDE, FOOTER CON CSS [Archivo de video]. Recuperado de https://www.youtube.com/watch?v=-i4OHNoW8ms Menú Desplegable con HTML5 y CSS3. Falcon, C, A. [FalconMasters]. (2012, febrero 26). Como hacer un menú desplegable con HTML y CSS [Archivo de video]. Recuperado de https://www.youtube.com/watch?v=oZa2Ut8u2S0


5.3 Redacte un borrador del contenido de lectura en formato de texto que tendrá la sección: (Sea este la presentación de la sección, el contenido o ambos; redacte un borrador del texto que publicara como contenido en la sección coloque un subtítulo para identificar si corresponde a la presentación de la sección o el contenido de lectura de la sección) Presentación. Estimado estudiante, en esta sección encontrará información sobre las diversas características y novedades de CSS3. Bienvenidos…. Contenido. Mientras que HTML nos permite definir la estructura de una página web, las hojas de estilo en cascada (Cascading Style Sheets o CSS) son las que nos ofrecen la posibilidad de definir las reglas y estilos de representación en diferentes dispositivos, ya sean pantallas de equipos de escritorio, portátiles, móviles, impresoras u otros dispositivos capaces de mostrar contenidos web. Las hojas de estilo nos permiten definir de manera eficiente la representación de nuestras páginas y es uno de los conocimientos fundamentales que todo diseñador web debe manejar a la perfección para realizar su trabajo. (Damián De Luca y Alejandro De Luca (2010). http://html5.dwebapps.com/que-es-css3/) El siguiente enlace permite ingresar y descargar una Guía Completa de CSS3. Guía Completa de CSS3 En cada uno de los siguientes enlaces encontrara videos con temas relacionados con el funcionamiento de CSS3.  Introducción a CSS3.  Como Insertar CSS.  Selectores en CSS.  HTML5: HEADER, NAV, UL, LI con CSS3.  HTML5: SECTION, ASIDE, FOOTER CON CSS3.  Menú Desplegable con HTML5 y CSS3.


MAQUETACION.

Unidad1 Guion OVI Kelly Johanna Garavito

Recommend Documents