logo eduetka

WebQuest Tecnología e Informática Informática Crear Una Pagina Html

Crear Una Pagina Html

Publicado el 24 Septiembre de 2012

Autor: Chrisitan

Introducción

En muchas de las nuevas tecnologías virtuales se tiene la posibilidad de edición de documentos o de restructuración de los mismos esto debido a la finalidad de contemplar una mejora continua como dicen los japoneses, un Kaissen. Se puede deducir que mucha gente como tú, sabe editar información con elementos virtuales en internet,  ahora es necesario para el objetivo de la materia conocer el lenguaje que crea las páginas, lo cual te permitirá crear una tu gusto.

Es indispensable el conocimiento de las etiquetas básicas del lenguaje, que es HTML, el cual utiliza códigos textuales comunes para crear la pagina, para animaciones, videos y aplicaciones de otro tipo se comienza a utilizar otras herramientas como PHP, JavaScript y otros lenguajes de internet los cuales son útiles para las presentaciones de trabajo o información, además de que utiliza medios de interactuación como formularios.

Sin embargo en esta etapa o sección del conocimiento nos enfocaremos únicamente al trabajo con las etiquetas mas básicas y de mayor uso para las paginas web, que nos permita crear nuestra pagina básica y utilizaremos herramientas básicas para crearla, que en este caso es el wordpad o block de notas.

Ficha técnica

Área:Tecnología e Informática

Asignatura:Informática

Edad: No hay restriccion de edad

Herramientas:

Imágenes

logo IDEA

Crear proyectos de clase utilizando inteligencia artificial dando clic aquí

Tarea

Al final de trabajo tendrás que realizar una página web por medio de un conjunto de etiquetas, donde muestres la información de tu comunidad. La información debe tener lo siguiente:

  1. Un tema principal.
  • El tema consta de su nombre y un objetivo ecológico (situación problema).
  • Se mostraran 2 vínculos, uno a cada página donde tendrá información del subtema.
  • Se mostraran por medio de una imagen y texto la situación o problemática que se tiene.
  • Se mostrara dos vínculos a páginas con información relevante a nuestro trabajo.
  • Se mostrara un vinculo a la conclusión y datos
  1. Dos subtemas como mínimo de manera secundaria que estarán en paginas independientes, a los que se accederán con los vínculos de la pagina principal, donde cada subtema tendrá:
  • Nombre de este subtema
  • Descripción de la importancia con el tema principal.
  • Un vínculo de retorno a la página principal.
  1. Conclusión es la parte de la pagina que muestra posibles soluciones a la problemática, en base a lo investigado y conocimiento adquirido o en su caso fotos o imágenes si se realizo la actividad que lo soluciona.
Cuando termines los trabajos de la página mostraras el resultado a tu salón y describirás la importancia de esta solución

Procesos

En cada proceso evolutivo que ha tenido la manera de mostrar y dejar la información siempre el ser humano a corregido el rumbo de la historia y a desarrollado nuevos procesos para que la información llegue a todos desde el pasado de papiro, papel arroz, cuero y papel, asta llegar a nuestros días donde la parte física ya no es prioridad, sino que  la información en si, promedio de los sistemas digitales se mueve mucho mas rápido, lo cual el conocimiento de elementos esenciales como paginas web, desde que las crea, hasta el como las crean, permitirá que el estudiante tenga la capacidad no solo de obtener información sino de darla.

1.      El alumno contestara las siguientes preguntas que el permitan tener conocimientos básicos de internet:

  • ¿Qué es una Web?
  • ¿Qué es un cliente y un servidor?
  • ¿Cómo funciona la tecnología web cliente-servidor?
  • ¿Qué es el protocolo http?
  • ¿Que es HTML?
  • ¿Qué características tiene el lenguaje?

2.      El alumno Investigara las etiquetas básicas del lenguaje realizando la siguiente actividad:

  • Para empezar buscara en internet o libro que es una etiqueta HTML y cuales son sus partes principales.
  • Continuaremos investigando ahora cuales son las partes que tiene una pagina web y como distinguirlas.
  • Creará un cuadro con 3 columnas y 6 filas, cabe mencionar que pueden agregarse mas, estas solo son como mínimas, en las columnas anotará como titulo en cada columna lo siguiente, el nombre de la etiqueta HTML, que función realiza y un ejemplo de la escritura.
  • Las etiquetas a buscar son <p>, <script>, <title>, <rfc>, <meta>, <h1>, <a>, <table>, <div>, <img>, <b>, <i>, <s> y <u>.
  • Buscar los distintos procedimientos para escribir pro medio del teclado los siguientes símbolos “, &, < y >.

3.      El alumno creará el cuerpo de la pagina en el bloc de notas y únicamente pondrá el titulo de esta:

  • Lo primero será accesár la bloc de notas que nos fungirá como medio de edición de la página.
  • Después escribiremos las cuatro partes de la pagina:
         1 <HTML>
         2       <HEAD>
         3                       <TITLE>
         4                       </TITLE>
         5       </HEAD>
         6       <BODY>
         7       </BODY>
         8 </HTML>
  • Para guardar el documento se tendrá que indicar el nombre “xxxxxxx.html”, la parte después del punto será el formato que permita al explorador de internet poder definir  cada parte y organizar el archivo, para su visualización.
  • Una vez guardado se accederá al explorador y en la opción de abrir se buscará el archivo que guardamos, con lo cual nos permitirá ver la pagina, debemos comprender que para esta parte solo hemos creado la pagina con sus partes, sin embargo falta el contenido de esta.
  • Para el agregado de la información en la página creada se volverá al blog de notas y ahí se editara el archivo “xxxxxx.html”, donde solamente agregaremos información en la opción del titulo de nuestra página.
  • En el siguiente vinculo podemos encontrar una guía para la practica que se menciono  http://mx.answers.yahoo.com/question/index?qid=20100505171833AAESsyG

4.      En este paso se dará tiempo para que practiques y anexes información a la pagina creada, se te recomienda los siguientes pasos a buscar:

  • Como dividir una pagina por medio de la etiqueta tabla o div.
  • Como asignar color y formato al texto.
  • Como incrustar imágenes.
  • Como agregar vínculos para navegar de una pagina a otra.
5.      El alumno investigará un problema ecológico que le permitirá tener un punto de partida para todo el proyecto, además de que servirá de guía para la realización de cada una de las 4 páginas que se toman en el proyecto.
  • Etapa de elección:
  • i.      Anota 5 problemas ecológicos que tengas cerca de tu casa.
  • ii.      Anota y desarrolla en una hoja las siguientes preguntas, ¿Desde cuando existen?, ¿Quién las provoca?, ¿Qué afectaciones tiene al pueblo o colonia?, ¿Cómo se puede solucionar?
  • iii.      En base al conocimiento que tengas elige el que según tú sea más importante y pueda tener una solución.
  • Etapa de diseño
  • i.      Primero que nada navega en internet, observa o enfócate en 4 diseños que te gusten y observes como están distribuida la información.
  • ii.      Con el tema elegido y en base a los diseños vistos, crear tu propio diseño en papel de cómo quieres o quisieras que se mostrara la información de tu página.

6.      Una vez hecho esto crea una pagina a tu gusto con las etiquetas y usando como guía el tema que elegido en la etapa 5.

7.      Por ultimo mostraras a tus compañeros el trabajo que realizaste.

Evaluación

Se avaluaran las siguientes partes del proyecto la ponderación será asignada en conjunto con el maestro:

  • El trabajo ecológico
    • Impacto
    • Ortografía
    • Redacción
    • Importancia
    • Fotografías
  • Partes del proyecto web
    • Inicio
      • Etiquetas de distribución
      • Color del texto
      • Estructura del texto
      • Vínculos
      • imágenes
    • Primer subtema
      • Etiquetas de distribución
      • Color del texto
      • Estructura del texto
      • Vínculos
      • imágenes
    • Segundo subtema
      • Etiquetas de distribución
      • Color del texto
      • Estructura del texto
      • Vínculos
      • imágenes
    • Conclusión
      • Etiquetas de distribución
      • Color del texto
      • Estructura del texto
      • Vínculos
      • imágenes

Notas

.

Creditos

Proyecto Creado Por Chrisitan - Utilizando A Eduteka.org

Responsive image

*Nota: toda la información que aparece en los Proyectos de Clase y WebQuest del portal educativo Eduteka es creada por los usuarios del portal.

Ficha técnica

Área:Tecnología e Informática

Asignatura:Informática

Edad: No hay restriccion de edad

Herramientas:

Imágenes

logo IDEA

Crear proyectos de clase utilizando inteligencia artificial dando clic aquí