miércoles, 11 de agosto de 2021

APRENDAMOS HTML

 


El World Wide Web (WWW) es un sistema que contiene una cantidad de información casi infinita. Pero esta información debe estar ordenada de alguna forma de manera que sea posible encontrar lo que se busca. La unidad básica donde está almacenada esta información son las páginas Web. Estas páginas se caracterizan por contener texto, imágenes, animaciones... e incluso sonido y video. Una de las características más importantes de las páginas Web es que son hipertexto. Esto quiere decir que las páginas no son elementos aislados, sino que están unidas a otras mediante los links o enlaces hipertexto. Gracias a estos enlaces el navegante de internet puede pulsar sobre un texto de una página para navegar hasta otra página. Será cuestión del programador de la página inicial decidir que palabras o frases serán activas (hiperenlaces) y a donde nos conducirá pulsar sobre ellas. En algunos ambientes se discute que el World Wide Web ya no es un sistema hipertexto sino hipermedia. Los que defienden el cambio se apoyan en que aunque en sus orígenes el WWW constaba únicamente de texto en la actualidad es un sistema principalmente gráfico y se puede hacer que las zonas activas sean, no sólo texto, sino imágenes, videos, botones,... en definitiva cualquier elemento de una página. 

CARACTERÍSTICAS DEL LENGUAJE HTML 

Pero empecemos ya con lo que nos interesa. ¿Cómo se hace una página Web? Cuando los diseñadores del WWW se hicieron esta pregunta decidieron que se debían cumplir, entre otras, las siguientes características: }

• El Web tenía que ser distribuido: La información repartida en páginas no muy grandes enlazadas entre sí.

 • El Web tenía que ser hipertexto y debía ser fácil navegar por él.

 • Tenía que ser compatible con todo tipo de ordenadores (PCs, Macintosh, estaciones de trabajo...) y con todo tipo de sistemas operativos (Windows, MS-DOS, UNIX, MAC-OS,...). 

• Debía ser dinámico: el proceso de cambiar y actualizar la información debía ser ágil y rápido.

Estas características son las que marcaron el diseño de todos los elementos del WWW incluida la programación de páginas Web. Como respuesta a todos estos requisitos se creo el lenguaje HTML (HiperText Markup Language), cuyas siglas significan "lenguaje hipertexto de marcas". Este lenguaje será el encargado de convertir un inocente archivo de texto inicial en una página web con diferentes tipos y tamaños de letra, con imágenes impactantes, animaciones sorprendentes, formularios interactivos, etc.


QUÉ SE NECESITA PARA CREAR UNA PÁGINA WEB

Una de las características de este lenguaje más importantes para el programador es que no es necesario ningún programa especial para crear una página Web. Gracias a ello se ha conseguido que se puedan crear páginas con cualquier ordenador y sistema operativo. El código HTML, como hemos adelantado en el párrafo anterior, no es más que texto y por tanto lo único necesario para escribirlo es un editor de texto como el que acompañan a todos los sistemas operativos: edit™ en MS-DOS, block de notas en Windows, vi™en UNIX, etc. Por supuesto estos no son los únicos editores de texto que pueden ser usados, sino cualquier otro. También se puede usar procesadores de texto, que son editores con capacidades añadidas, como pueden ser Microsoft Word™ o WordPerfect™ pero hay que tener cuidado porque en ocasiones hacen traducciones automáticas del código HTML que no siempre son deseadas. En estos dos últimos casos, también hay que tener en cuenta que deberemos guardar el archivo en modo texto, por eso es recomendable hacerlo para nuestro caso con el BLOG DE NOTAS.

ESTRUCTURA BASICA DE PAGINA EN HTML



Como dijimos previamente, necesitamos escribir el código en el Blog de notas, es necesario siempre seguir la anterior estructura, cada una de los comandos o etiquetas se escriben dentro de los signos < > y se deben cerrar con un slash </ >;  Iniciamos  siempre la codificación con el comando <HTML>, de lo contario el navegador no reconocerá el documento como página WEB, seguimos con el comando <HEAD> para el encabezado, aquí van algunas características de la página como el color del fondo y el título, posteriormente cerramos esta sección con </HEAD>. Todo el contenido de la página web; texto, imágenes, listas, tablas, hipervínculos, etc se deben incorporar dentro del cuerpo, para ello utilizamos la etiqueta <BODY>, finalmente, cuando hayamos terminado de incorporar todo el contenido de nuestra página debemos cerrar con los comandos </BODY> Y </HTML>. Ahora guarda el archivo con extensión .html o .htm en tu disco duro. Para ello accedemos al menú Archivo y seleccionamos la opción Guardar como. En la ventana elegimos el directorio donde deseamos guardarlo y colocaremos su nombre, por ejemplo mi_pagina.html

EJEMPLO:

<HTML>
<HEAD><body bgcolor="pink"></HEAD>
<BODY>
<CENTER><B>LUZ DE DIA</B>

<P>
Destapa el champaigne<BR>
Apaga la luces<BR>
Dejemos las velas encendidas<BR>
Y afuera las heridas.</P>

<P>
Ya no pienses más<BR>
En nuestro pasado<BR>
Hagamos que choquen nuestras copas<BR>
Por habernos encontrado.</P>

<P>
Y porque puedo mirar el cielo<BR>
Besar tu manos<BR>
Sentir tu cuerpo<BR>
Decir tu nombre<BR>
Y las caricias seran la brisa<BR>
Que aviva el fuego de nuestro amor<BR>
De nuestro amor.</CENTER></P>

</BODY>
</HTML>

Hemos colocado un color de fondo de la página en el encabezado con la etiqueta <body bgcolor="pink">, dentro del cuerpo la letra de la canción centrada con la ayuda de las etiqueta <CENTER>, el título en negrita con <B> y </B>, los parrafos con <P>y</P> y los saltos de línea con <BR>, esta etiqueta no necesita cerrarse como las anteriores.


ACTIVIDADES

1. Contesta en tu cuaderno:

  • Que traduce WWW?
  • Que traduce HTML?
  • Cuales son las características del lenguaje HTML?
  • Qué se necesita para crear una página web?
  • Cual es la estructura básica de una página en lenguaje HTML?
2. Crea tu primera página WEB en la que escribas tu canción favorita utilizando los comandos o etiquetas vistos en esta clase.

3. Envía tu trabajo al correo habitual hasta el 19 de Agosto de 2021.

WEBGRAFIA:

http://es.tldp.org/Manuales-LuCAS/doc-curso-html/doc-curso-html.pdf


No hay comentarios:

Publicar un comentario

TRABAJO FINAL