Scribd Logo
Carica

Benvenuto in Scribd!

  • GT6 Guia HTML5-CSS. JS

    Caricato da

    Jenny Guio
    19 visualizzazioni8 pagine
    guia html

    Titolo originale

    GT6 Guia HTML5-CSS. JS

    Copyright

    © © All Rights Reserved

    Formati disponibili

    PDF, TXT o leggi online da Scribd

    Hai trovato utile questo documento?

    Questo contenuto è inappropriato?

    Segnala questo documento
    guia html

    Copyright:

    © All Rights Reserved
    Scarica in formato PDF, TXT o leggi online su Scribd
    Segnala contenuti inappropriati
    19 visualizzazioni8 pagine

    GT6 Guia HTML5-CSS. JS

    Caricato da

    Jenny Guio
    guia html

    Copyright:

    © All Rights Reserved
    Scarica in formato PDF, TXT o leggi online su Scribd
    Segnala contenuti inappropriati
    di 8

    PROCESO DE GESTIÓN DE FORMACIÓN PROFESIONAL INTEGRAL

    FORMATO GUÍA DE APRENDIZAJE

    GT.Html-CSS-JS
    1. IDENTIFICACIÓN DE LA GUÍA DE APRENDIZAJE
    • Denominación del Programa de Formación: Programación de software
    • Código del Programa de Formación: 233104 VER.2
    • Fase del proyecto: Evaluación
    • Competencia: DESARROLLAR LA SOLUCIÓN DE SOFTWARE DE ACUERDO CON EL DISEÑO Y
    • METODOLOGÍAS DE DESARROLLO
    • Resultados de Aprendizaje Alcanzar:
    RAP 2. CREAR COMPONENTES FRONT-END DEL SOFTWARE DE ACUERDO CON LAS
    NECESIDADES DEL CLIENTE

    2. presentación

    Estimado aprendiz, bienvenido a la actividad de aprendizaje de los programas html5, CSS Y JS,
    donde se desarrollarán actividades concernientes a los conceptos y características básicas de la
    programación orientada al desarrollo web.

    Para el desarrollo de las actividades planteadas en esta guía, contará con el acompañamiento de
    la instructora, quien lo orientará con las pautas necesarias para el logro de las actividades de
    aprendizaje, brindando herramientas básicas de tipo conceptual y metodológico.

    Es importante que organice su tiempo con un promedio de trabajo diario de dos horas, dada la
    exigencia que demanda la realización de las actividades mencionadas en esta guía de
    aprendizaje. No olvide revisar y explorar los materiales y videos de apoyo para el desarrollo de la
    guía.

    GFPI-F-135 V02
    3. Actividad de reflexión inicial.

    Con la llegada de la web surgió la W3C (World Wide Web


    Consortium) como organismo encargado de velar por el
    desarrollo de protocolos y pautas que aseguran el
    crecimiento futuro de esta, haciendo posible la
    comunicación humana, el comercio y las oportunidades
    para compartir conocimiento. Teniendo como principal
    objetivo la disponibilidad de información para el público en
    general.

    ¿Qué tan importante es para la web que exista una


    organización encargada de velar por su desarrollo, como lo
    es la W3C?

    3.2 actividades de contextualización e identificación de conocimientos necesarios para


    elaprendizaje.

    Al terminar la transferencia de conocimiento, el aprendiz deberá desarrollar un cuestionario con las


    siguientes preguntas:

    Html
    a. Organizar grupo de dos personas, realizar un cuadro donde se haga una pequeña descripción
    de las etiquetas más utilizadas en
    HTML(<html>,<head>,<title>,<meta>,<body>,<center>,<h1>,<hr>,<br>,<p>,<font>,<a>,<ol><ul>,<
    audio>,<section>,<article>, <div>,<header>).
    b. Realizar un cuadro comparativo entre HTML y XHTML.
    c. Consultar los tipos de editores de texto que hay en el mercado, teniendo claras las
    características de cada uno, ¿Para usted cual es el que mejor se presta para diseñar páginas web
    con HTML5 y CSS3?
    d. ¿Por qué es importe HTML como lenguaje de marcado a la creación de estructura y contenido
    de las páginas web en la “Web 3?0” o también llamada web semántica?
    e. ¿Para usted que tanto ha cambiado la web con el uso de HTML5 y CSS3?, justificar la
    respuesta.
    f. Consultar a cerca de los elementos principales en CSS y dar un ejemplo de cada uno de ellos.
    Css
    g. Consultar acerca de los tipos de selectores (selectores de etiqueta, selectores de clase,
    selectores de ID, selectores contextualizados o pseudo-clases, pseudoelemento, selector universal
    y selectores de atributo).
    W3c
    h. ¿Cuál es la finalidad de la W3C?
    i. ¿Cuál es la pila tecnológica del W3C?

    GFPI-F-135 V02
    4 FORMULACIÓN DE LAS ACTIVIDADES DE APRENDIZAJE

    4.1 Actividad de aprendizaje 1: Definir el entorno para el desarrollo de soluciones en el lenguaje


    de programación html, css y Js.

    A continuación, se describen las actividades y las correspondientes evidencias que conforman


    la actividad de aprendizaje 1:

    Configurar el entorno de trabajo para el desarrollo de soluciones con el lenguaje HTML,


    CSS Y JS visual studio code

    Para el desarrollo de aplicaciones, es necesario contar con un software específico acorde con el
    lenguaje de programación seleccionado; es indispensable que el equipo informático tenga
    instalado y configurado el editor de texto VISUAL STUDIO CODE

    Te invito a revisar el siguiente video:


    Mi configuración de extensiones: https://www.youtube.com/watch?v=cwvpqNggpS8&t=7s

    Evidencia N° 1: Informe - Configurar el entorno de trabajo para el desarrollo de soluciones con el


    lenguaje html.css y js.
    Evaluación conceptos básicos
    Para entregar la evidencia remítase a fases del proyecto/ fase 4 Evaluación/Actividad 1 /
    Evidencias

    4.2 Actividad de aprendizaje 2: Identificar el proceso de diseño y estructuración web html5.

    Importancia de la nueva versión del lenguaje de marcado que se usa para estructurar
    páginas web
    Bueno antes que todo están las preguntas básicas, ¿qué es?, ¿para qué es?, ¿En qué me
    beneficio?, y no pueden hacer falta en este mundo del diseño y la estructura web y
    específicamente en este tema de HTML5
    ¿Qué es html 5? – Simplemente Como su nombre indica, HTML 5 es el sucesor de HTML4.
    Este trabajo o proyecto de HTML5 se inició a finales de 2003 con un grupo de trabajo que se
    propuso a hacer un lenguaje que llegara con un conjunto de tecnologías que permiten
    construir la nueva Web.
    No fue sino hasta 2007 que el HTML5 del W3C acepta la visión mediante la incorporación en ella
    del grupo de trabajo. Los principios de diseño son claras: para simplificar el uso de HTML, la
    formalización de las prácticas actuales, y garantizar la máxima compatibilidad con versiones
    anteriores.

    Revisar los siguientes videos:


    • página oficial de la W3C: HTML y CSS - W3C
    • menú de animaciones: tutorial html y css | crear menu con animacion en css3 - YouTube
    • ¿Cómo crear nuestra primera página web con HTML y CSS, URL:
    http://www.w3.org/Style/Examples/011/firstcss.es.html

    GFPI-F-135 V02
    • Lista de animaciones
    https://developer.mozilla.org/es/docs/HTML/HTML5/HTML5_lista_elementos
    http://libro.cursohtml5desdecero.com/snippets/html/

    Con el fin de contextualizar y afianzar sus conocimientos sobre eltema, investigue Sobre,
    • Alojamiento web
    • Servidores http
    • Navegadores
    • Peticiones http
    • Las URLs
    • Dominio y subdominios

    Nota: Se debe socializar a los compañeros

    1. DISEÑAR Y DESARROLLAR LA SIGUIENTE INTERFAZ

    Evidencia N° 2 Para entregar la evidencia remítase a la Actividad 2 - Evidencias

    GFPI-F-135 V02
    2. Con el fin de contextualizar y afianzar sus conocimientos sobre eltema, investigue Sobre,

    • Qué es CSS y cómo lo podemos usar para aplicar estilos


    • Qué estilos podemos aplicar a cada elemento HTML
    • Cómo combinar HTML y CSS
    • Cómo funciona la herencia de estilos

    3. Puedes acceder a los snippets interactivos de CSS a través de la siguiente URL:


    http://libro.cursohtml5desdecero.com/snippets/css/

    4. ACTIVIDADES DE EVALUACIÓN

    Evidencias de Aprendizaje Criterios de Evaluación Técnicas e Instrumentos de


    Evaluación
    Evidencias de Conocimiento: Define que es HTML Técnica: Socialización.
    y CSS.
    Cuestionario con temas
    Instrumento: Cuestionario.
    vistos en transferencia de
    Define las ventajas de
    HTML y CSS.
    HTML y CSS. Instrumento: Listas de
    Evidencias de chequeo
    Desempeño: Define las etiquetas
    usadas en HTML5. Evidencias de Producto:
    Evaluar el nivel de
    Realizar aplicación básica
    efectividad del desarrollo
    de las actividades, de Define los tipos de en HTML , CSS, y JS
    acuerdo al tiempo selectores en CSS. teniendo en cuenta las
    estimado. funcionalidades que realiza
    Define los principales el gestor de emprendimiento
    Evaluar evidencias de elementos de CSS. en la aplicación Propuesta
    aprendizaje de acuerdo a
    la lista de chequeo, con
    el fin de verificar que la
    aplicación se haya
    realizado correctamente
    de acuerdo a los
    estándares que propone
    la w3C.

    GFPI-F-135 V02
    5. GLOSARIO DE TÉRMINOS

    HTML: Es el lenguaje que se emplea para el desarrollo de páginas de internet.


    1. CSS: CSS es un lenguaje utilizado en la presentación de documentos HTML. Un documento HTML viene
    siendo coloquialmente “una página web”.
    Etiquetas: son fragmentos de texto destacado de una forma especial que permiten la definición de las
    distintas instrucciones de HTML, tanto los efectos a aplicar sobre el texto como las distintas estructuras del
    lenguaje.
    W3C: El Consorcio World Wide Web (W3C) es una comunidad internacional donde las organizaciones
    Miembro, a tiempo completo y el público en general trabajan conjuntamente para desarrollar estándares
    Web.
    XHTML: XHTML es un lenguaje similar a HTML, pero con algunas diferencias que lo hacen más robusto y
    aconsejable para la modelación de páginas web.
    SELECTORES: Los selectores identifican a un elemento dentro de la página Web para luego poder definir sus
    propiedades.

    GFPI-F-135 V02
    6. REFERENTES BIBLIOGRÁFICOS

    W3C (2012) HTML y CSS. [En línea].Sitio oficial de la World Wide Web Consortium (W3C). Disponible en:
    http://www.w3.org/standards/webdesign/htmlcss .
    LIBROSWEB (2015). [En línea]. Introducción a HTML. Disponible en: http://librosweb.es/libro/xhtml/capitulo_1.html .
    Platzi. John Freddy Vega. (2014). ¿Qué es HTML y cómo funciona?. [Vídeos]. YouTube.
    Sidar (2015). SELECTORES. [En línea].Sitio web. Disponible en : http://www.sidar.org/recur/desdi/mcss/manual/sel.php

    GFPI-F-135 V02
    7. CONTROL DEL DOCUMENTO

    Nombre Cargo Dependencia Fecha


    Autor (es) Ing. JENNY GUIO Instructor Articulación Junio de 2021
    Revisó

    8. CONTROL DE CAMBIOS (diligenciar únicamente si realiza ajustes a la guía)


    Nombre Cargo Dependencia Fecha Razón del Cambio
    Autor (es)

    GFPI-F-135 V02

    Potrebbero piacerti anche