Este documento presenta una ficha de aprendizaje para estudiantes de grado 10 en la asignatura de diseño web. La ficha incluye información sobre el Colegio Visión Mundial en Montería, Colombia, el tema de la clase sobre lenguajes de programación y HTML, y una actividad propuesta para que los estudiantes desarrollen código HTML para crear una estructura básica de página web.

1. COLEGIO VISIÓN MUNDIAL
(Antes Institución Educativa Asodesi)
Con reconocimiento oficial de estudios según resolución No. 0916 del 25 de
Noviembre de 2010 Emanada de la Secretaria de Educación Municipal de Montería
6
Fechas:
24-02-14
28-02-14
Grado:
10
FICHA DE APRENDIZAJE Número:
Nombre del Docente:
Oscar Ramos Martínez
Área: Tecnología e Informática
Asignatura: Diseño web
Estándar: Explico la importancia que se debe manejar para el diseño web aplicando las diferentes técnicas de desarrollo tratamiento y
conocimiento de imágenes gráficos y colores
Tópico Generativo: Lenguajes de programación, trabajo con HTML
Competencias
Declarativo
Procedimental
Investiga como es el proceso de desarrollo web en sus inicios,
Introducción al diseño web
navegadores lenguajes
Actitudinal
Analiza los lenguajes de programación y caracteriza su uso
Tipología Textual (Genero/Nivel)
Lectura descriptiva en la cual se adapte el conocimiento declarativo
Ciudadana y Emprendimiento
Colaboró activamente para el logro de metas comunes en mi salón y
reconozco la importancia que tienen las normas para lograr esas
metas.
Competencias Lectora/Escritora
Dirige la atención a lo fundamental y no a lo accesorio, en función de los
objetivos de la lectura
Reflexión: Libre, y para mi sagrado, es el derecho de pensar... La educación es fundamental para la felicidad social; es el principio en el que
descansan la libertad y el engrandecimiento de los pueblos.
Presentación:
Para esta sesión de clases se pretende que los estudiantes conozcan los diferentes lenguajes de programación, así mismo la estructura de HTML
Desarrollo:
1. Se inicia con la lectura de la reflexión diaria
2. Explicación de los conceptos de lenguajes de programación
3. Definir y conocer el lenguaje HTML
4. Ejemplo de sintaxis de HTML
Recursos:
Tablero, marcadores, presentaciones digitales
Bibliografía – Webliografía
http://www.htmlya.com.ar/
OBSERVACIONES:
COMPROMISOS Y PRODUCTOS:
Calle 13 N° 14C-10 – Barrio 6 de Marzo
Teléfono (4) 789 71 40
www.colvm.blogspot.com
Montería – Córdoba – Colombia
Fecha de Entrega:

2. COLEGIO VISIÓN MUNDIAL
(Antes Institución Educativa Asodesi)
Con reconocimiento oficial de estudios según resolución No. 0916 del 25 de
Noviembre de 2010 Emanada de la Secretaria de Educación Municipal de Montería
Cuerpo de la ficha
Cuando se produjo la explosión de Internet el estándar de HTML que circulaba era el 2.0 (establecido en noviembre del 95), de modo que
cualquier navegador que encontremos será capaz de interpretarlo. Prácticamente todo lo que veamos en los próximos seis capítulos está
contemplado por este estándar.
2.2. HTML 3.0 y 3.2
Aunque la versión 2.0 cumplía bien el objetivo para el que se creó, carecía de herramientas para tener un control mínimamente complejo de los
documentos. No se consideró necesario que lo tuviera, ya que por aquel entonces Internet era un fenómeno más bien circunscrito a la
actividad académica y el contenido primaba sobre el diseño. Debido a ello, Netscape (líder del mercado de navegadores por aquel entonces)
empezó a incluir etiquetas nuevas no incluidas en ningún estándar.
Por estos problemas, el IETF (el comité que suele decidir todos los estándares dentro de Internet) comenzó a elaborar el borrador del HTML
3.0, que resultó ser demasiado grande para la época, lo que dificultó su aceptación en el mercado.
Esto llevó a una serie de compañías (entre ellas Netscape, Microsoft, IBM, Sun, etc...) a crear un nuevo comité llamado W3C, que es el que
actualmente elabora las nuevas versiones del HTML. Su primer trabajo consistió en crear el borrador del HTML 3.2, que incluía muchas de las
mejoras que los principales navegadores (Netscape y Explorer) habían introducido en Internet, como son las tablas, los applets, etc..
Este borrador fue aprobado en enero de 1997 e inmediatamente el W3C se puso a trabajar en la elaboración del siguiente estándar: el 4.0.
2.3. HTML 4.0
En julio de 1997 se presenta el borrador de este estándar. Por fin se estandarizan los marcos (frames), las hojas de estilo y los scripts (entre
otras cosas). El 17 de diciembre de 1997 dicho borrador fue finalmente aprobado.
Estructura de página web
El principio esencial del lenguaje HTML (HyperText Markup Language) es el uso de las etiquetas (tags) que tienen la siguiente estructura:
<ETIQUETA> inicio
[.......]
</ETIQUETA> cierre
Una etiqueta es una palabra (en mayúscula o minúscula), delimitada por los signos < (mayor que) y > (menor que).
Por regla general, las etiquetas forman bloques que se inician con una instrucción y finalizan con la misma instrucción a la que se le antepone
una barra inclinada (/):
Cada elemento se divide en tres partes: una etiqueta inicial, el contenido, y una etiqueta final. Todo lo que hay entre la etiqueta de apertura y la
etiqueta de cierre se ve afectado por esa etiqueta:
<ETIQUETA>
[... contenido ...]
</ETIQUETA>
A veces, es necesario agregar datos adicionales a una instrucción, en ese caso, la etiqueta de apertura será la que contendrá esos parámetros
llamados atributos:
<ETIQUETA atributo1="valor" atributo2="valor">
... contenido ...
</ETIQUETA>
Eventualmente, ciertas etiquetas no forman bloques ya que son autosuficientes, en ese caso, la barra inclinada se agrega al final de esa única
etiqueta separada de esta por un espacio en blanco:
<ETIQUETA />
Este concepto de etiquetas de apertura y cierre es la clave para entender el lenguaje. Como cualquier elemento puede contener a otros
elementos, las etiquetas deben abrirse y cerrarse en el mismo orden en que fueron creadas. Una página web está compuesta por elementos
(objetos) metidos unos dentro de otros (anidados). El elemento principal, el que contiene a todos los demás es el documento HTML.
Toda página web está comprendida entre dos etiquetas: <HTML> y </HTML>. A su vez, el elemento HTML contiene otros dos, los elementos
HEAD y BODY. Esas son las principales zonas de cualquier página web, el encabezamiento, comprendido entre las etiquetas <HEAD> y
</HEAD> y el cuerpo, comprendido entre las etiquetas <BODY> y </BODY>.
Dentro del encabezado se coloca información genérica que afecta a toda la página pero que no son visibles. El elemento principal es el título,
comprendido entre las etiquetas <TITLE> y </TITLE>. El título es un texto breve que describe el contenido y es el mismo que vemos cuando
agregamos una página a los favoritos en Internet Explorer o a los marcadores en Firefox.
Calle 13 N° 14C-10 – Barrio 6 de Marzo
Teléfono (4) 789 71 40
www.colvm.blogspot.com
Montería – Córdoba – Colombia

3. COLEGIO VISIÓN MUNDIAL
(Antes Institución Educativa Asodesi)
Con reconocimiento oficial de estudios según resolución No. 0916 del 25 de
Noviembre de 2010 Emanada de la Secretaria de Educación Municipal de Montería
<TITLE> Título de la página </TITLE>
El código
<HTML>
<HEAD>
<TITLE>Mi primera página</TITLE>
</HEAD>
<BODY>
<CENTER><H1>Mi Primera pagina</H1></CENTER>
<HR>
<P>Esta es mi primera pagina. Por el
momento no se que tendra, pero dentro de poco
pondre aqui muchas cosas interesantes.
</BODY>
</HTML>
Actividad en clases
Desarrolla el código propuesto por el docente para realizar una estructura web de ejemplo, la estructura debe contener lo siguiente
a.
b.
c.
d.
Título en grande, color rojo, centrado
Separados por párrafos
Textos en negrilla
Texto y subtítulos en color azul
Calle 13 N° 14C-10 – Barrio 6 de Marzo
Teléfono (4) 789 71 40
www.colvm.blogspot.com
Montería – Córdoba – Colombia