Vamos a hablar de…HTML
Body:
Conceptos del lenguaje
Estructura para documentos
Herramientas usadas para crear documentos
Buenas prácticas en la publicación de documentos
Problemas que se nos pueden presentar
HTML: qué es?
Lenguaje que da formato
Define la sintáxis y ubicación de imágenes, instrucciones y objetos al navegador
Posibilidad de conectar un documento con otros, o con otros recursos en Internet a través de hipertexto
HTML: qué no es?
Body: No es un procesador de palabra
No es una herramienta de escritorio para diagramación
No es un lenguaje de programación
No es multimedia
Como funciona?
Body: Cliente
(Gp:) Cliente:
Explorer
Netscape
Dame el
archivo x
Aquí está
Protocolo http
Servidor
Remoto
La Telaraña Mundial
Body: Múltiples usos:
Educación
Investigación
Mercadeo
Desarrollo (ddhh y paz, medio ambiente, equidad, diversidad, hábitat, comercio justo)
Estándares de HTML
Body: HTML 1 Desarrollado en CERN
HTML 2.0 Incluye mejoras en NCSA Mosaic (formularios e imágenes)
HTML 3.2 Mejoras para controlar el formateo de tablas, etc.
HTML 4.0 Mejoras para publicaciones multiplataforma (CSS, XML, WAP, DHTML)
Terminología
Body: HTTP: Hypertext Transfer Protocol Parámetros de comunicación cliente – servidor Web
HTML: Hypertext Markup Language Lenguaje nativo para documentos publicados en el Web independiente del tipo de plataforma.
URL: Uniform Resource Locator
Dirección de un objeto en el Web http://www.colnodo.org.co/
Fundamentos
Body: Rótulos < H1>Inicio< /H1>
No sensitivos a mayúsculas y minúsculas < H1> o < H1>
Algunos atributos pueden ser sensibles a mayúsculas y minúsculas como los nombre de archivos, por ejemplo.
Normalmente van en pares denotando inicio y fin < H1> y < /H1>
Documentos Básicos
Body: Deben incluir
< HEAD> y < /HEAD> contiene información sobre el documento
< BODY> y < /BODY> es el contenido principal del documento
< HTML> y < /HTML> contiene los 2 elementos anteriores
2 Ejemplos…
< TITLE>Mi Primer Documento< /TITLE>
Este es mi primer documento HTML.
< HTML>
< HEAD>
< TITLE>Un mejor documento< /TITLE>
< /HEAD>
< BODY>
< P>Novedades sobre el < EM>World Wide Web< /EM> disponible en < A HREF="http://www.w3.org/">W3C< /A>< /P>
< /BODY>
< /HTML>
doc1.html
doc2.html
Elementos Básicos
Body: Rótulos Básicos < HEAD> < TITLE> < P>
Rótulos de Formato Físico < B> < I>
Rótulos de Formato Lógico
< STRONG> < EM> < UL> < LI>
Enlaces de Hipertexto < A HREF="…">
Caracteres Especiales
Body: Permiten que diferentes navegadores hagan visibles los caracteres diagráficos de los idiomas diferentes al inglés:
á é í ó ú á
à è ì ò ù à
ñ ç ö ñ
Tablas
Body: Organización comparativa de información
Ubicación dentro de la página
Múltiples atributos para especificar
Formularios
Body: Interactividad
Retroalimentación
Recolección de datos
Pueden tabularse y analizarse
Respuestas personalizadas
Aceptado por todos los navegadores
Creando documentos
Body: Pueden ser creados usando editores simples como Notepad, vi, emacs.
Ventajas
Es barato
Se aprende a comprender el lenguaje HTML
Desventajas
Es fácil cometer errores
Necesita comprender la sintáxis HTML
Herramientas avanzadas
Body: Interface amigable y fácil de usar para crear documentos
Ocultan a disposición las complejidades del código HTML
Pueden ser herramientas autónomas o insertas en procesadores de texto