1
Download guia de aprendizaje - Portal Colegio
Document related concepts
Transcript
Subdirección de Educación Departamento de Educación Contratada Colegio CAFAM “Bellavista” CED GUIA DE APRENDIZAJE Guía No: 1 Docente: Luz del Carmen Barrera Área: Científico tecnológico Fecha: Del 04 de Febrero al 24 de marzo de 2014 Grado: NOVENO Asignatura: Informática Saber- Saber: Identifica HTML como herramienta para diseño de páginas web Saber Hacer: Elabora un sitio web, donde se evidencia el manejo de las etiquetas de HTML para elaborar páginas web. Saber Ser: Demuestra buen gusto y estética al elaborar trabajos académicos escritos, folletos, presentaciones para exposiciones, etc Utilizando colores, y lápiz dibuje y coloree un paisaje con muchos elementos: montañas, arboles, prado, flores… etc pero haciendo uso de la mano izquierda… Socialización de la dificultad de hacer el dibujo con la mano izquierda Prerrequisitos y preconceptos: Presentación en PowerPoint de los principales elementos de una página web Las paginas web son documentos con los que se construye la web, y su número crece exponencialmente. Una página web es un documento hipermedia, ya que combina la capacidad de incluir información multimedia (textos, imágenes, sonido, animaciones, etc) con la posibilidad de crear enlaces a otras páginas que pueden estar ubicadas en lugares remotos. Para la visualización de una página web es necesario un programa especial, conocido comunmente como navegador, y que hoy día se suministra con la mayoria de los sistemas operativos. Entre los navegadores más conocidos estan Netscape Navigator y Microsoft Internet Explorer. El lenguaje HTML (Hyper Text Markup Language) es el formato estándar que se utiliza para crear e interpretar documentos e imágenes, conocidos popularmente como páginas web. Estos documentos que en realidad son archivos de texto plano están compuestos por: La información que el usuario ve en la pantalla cuando accede a la página. Los códigos (tags o etiquetas), transparentes para el usuario, que son interpretados por el programa del navegador y que controlan la manera como la información es mostrada en la pantalla. Los códigos o etiquetas se escriben entre los símbolos mayor y menor que (< >). Todo archivo de HTML tiene una estructura básica y comienza con la etiqueta <html> y finaliza con la etiqueta </html>. Estructura básica de un archivo html <HTML> <HEAD> <TITLE>Encabezado de la pagina</TITLE> </HEAD> <BODY> Todo lo que quiero que se vea en la página </BODY> </HTML> Puesto que las páginas web son simples documentos de texto plano, lo único que se requiere para su creación es un editor de texto como el block d notas y para visualizar el documento un explorador como Microsoft Internet Explorer. HTML, no es un lenguaje sensible a las mayúsculas, lo que significa que puede escribir las etiquetas con mayúsculas o con minúsculas o mezclarlas, al finalizar de escribir el código en el block de notas debe guardarlo con la extensión .html y de esta manera obtendrá una página web. En una página web encontramos texto, imágenes, videos, vínculos, etc. y para agregar cada uno de estos elementos se necesitan determinadas etiquetas. Nueva Información: En una página web la parte de apariencia y estética es muy importante, por lo tanto HTML maneja variedad de etiquetas que podemos usar para diseñar las páginas a nuestro gusto. Las etiquetas más usadas son las de texto, las de diseño de tablas, las de diseño de líneas, las de colocar imágenes, mostrar videos, crear hipervínculos, etc. PARTES DE UNA PAGINA WEB Integración: Teniendo en cuenta una presentación de PowerPoint y la explicación de la docente, elabore un mapa conceptual donde explique qué es una página web?, cuáles son sus principales componentes? y cuáles son los pasos que se deben seguir para el diseño? APLICACIÓN Recordación: Pasos a seguir para elaborar un página Web Pasos para diseñar una página web con HTML 1. Definición de Objetivos: Saber de antemano el mensaje que se desea transmitir. 1. Tenga claro que información quiere mostrar en la web. 2. Perfilar una línea de diseño: La apariencia debe ser de acuerdo a la población a la que va dirigido el mensaje. 2. Cree una carpeta nueva y guarde allí las imágenes, fondos, videos, sonido, etc. que va colocar en la página. 3. Crear el organigrama de navegación: Se debe crear un diagrama de flujo claro para definir los índices principales, las páginas secundarias y las ramificaciones de todos los documentos. 3. Abrir el Block de notas 4. Definición del estilo: Resulta práctico crear una página de estilo para aplicar a todas las páginas que vayamos generando, incluyendo los logotipos, encabezados y pies de página. 5. Al finalizar la edición (escritura) de la pagina guárdela en la carpeta donde tiene los elementos que hacen parte de esta y no olvide colocarle la extensión .html 4. Edite el contenido de la página, teniendo la en cuenta la estructura básica: (El encabezado y el cuerpo de la página. Refinamiento: TRABAJO INDIVIDUAL En el cuaderno haga un crucigrama donde las pistas deben ser las definiciones de cada una de los siguientes términos: GRAFICOS, TEXTO, INTERNET, EXPLORADOR, NAVEGADOR, MULTIMEDIA, ETIQUETAS, HOMEPAGE, HIPERVÍNCULOS, PROGRAMAR, LOGICA, PAGINAS WEB, HTML. En el cuaderno escriba la estructura básica que debe tener una pagina web en html y haga una tabla con las principles etiquetas que usan HTML, cual es la función de cada una: Ejemplo: ETIQUETAS QUE SE USAN EN HTML PARA DISEÑO DE PAGINAS ETIQUETA FUNCION O USO <HX> Para escribir un texto alineado a la izquierda, a la derecha o centrado. <FONT> Para escribir un texto con color, tamaño de letra, y tipo de letra deseado… En el cuaderno escriba las etiquetas que se usan para hacer listas, aclarando en que momento se utilizan cada una de ellas. Haga una tabla con la traducción a inglés del siguiente vocabulario: colegio, estudiante, docente, aula de clase, escritorio, tablero, borrador, enseñar, aprender, computador, programa, lógica, informática, archivo, pagina, imágenes, texto, ejecutar, salir, creatividad, herramientas, Investigue en internet cuáles son los colores que se pueden usar en el diseño de paginas web y cuáles son los formatos Observe el trabajo práctico (páginas), que ha hecho en las unidades anteriores y haga un cuadro sinóptico donde se pueda ver que aprendió en el diseño de cada una de ellas. Construcción en Pequeño Grupo: 1. Haga uso del block de notas para diseñar una página web donde muestre un texto, usando adecuadamente todas las etiquetas de texto 2. Diseñe una página donde, se pueda ver el uso de las etiquetas para hacer listas 3. Diseñe una página donde se pueda observar el trabajo que se hizo individualmente (tabla con el horario) 4. Diseñe una página web que muestre una tabla con la traducción de vocabulario español a inglés que realizo en el trabajo individual. Ejemplo: VOCABULARIO ESPAÑOL- INGLÉS DEL BIMESTRE ESPAÑOL ENGLISH COLEGIO SCHOOL PRESENTADO POR: 5. Diseñe una página donde se pueda evidenciar el manejo de las etiquetas para colocar color de fondo a una página e imágenes. 6. Diseñe una página con el nombre de menú.html, donde pueda hacer los vínculos para las páginas diseñadas en las unidades anteriores. RECAPITULACIÓN Socialización al Gran Grupo: Cada relator del pequeño grupo presenta su producto en plenaria. Verificación: De acuerdo con el trabajo practico en cada una de las clases Reflexión: Mediante una matriz de evaluación cada estudiante evaluara su trabajo y actitud durante el curso. Regulación: Revisar durante el bimestre si la guía fue la adecuada para el curso, la temática y el tiempo dado. BIBLIOGRAFIA http://www.aulafacil.com/CursoHtml/temario.htm http://platea.pntic.mec.es/~abercian/guiahtml/colores.htm http://fcmfajardo.sld.cu/jornada/consejos.htm
