SlideShare una empresa de Scribd logo
1 de 20
Introducción al HTML
Colnodo
Ariel Barbosa & Sylvia Cadena
02.2001
Vamos a hablar de...HTML
• 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?
• 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?
Cliente Cliente:
• Explorer
• Netscape
Dame el
archivo x
Aquí está
Protocolo http
Servidor
Remoto
La Telaraña Mundial
Múltiples usos:
• Educación
• Investigación
• Mercadeo
• Desarrollo (ddhh y paz, medio
ambiente, equidad, diversidad,
hábitat, comercio justo)
Estándares de HTML
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
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
• 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
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
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
• Permiten que diferentes
navegadores hagan visibles los
caracteres diagráficos de los
idiomas diferentes al inglés:
á é í ó ú &aacute;
à è ì ò ù &agrave;
ñ ç ö &ntilde;
Tablas
• Organización comparativa de
información
• Ubicación dentro de la página
• Múltiples atributos para especificar
Formularios
• Interactividad
• Retroalimentación
• Recolección de datos
• Pueden tabularse y analizarse
• Respuestas personalizadas
• Aceptado por todos los navegadores
Creando documentos
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
• 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

Más contenido relacionado

La actualidad más candente

1.3 ALMACENAMIENTO Y GESTIÓN DE LA INFORMACIÓN
1.3 ALMACENAMIENTO Y GESTIÓN DE LA INFORMACIÓN1.3 ALMACENAMIENTO Y GESTIÓN DE LA INFORMACIÓN
1.3 ALMACENAMIENTO Y GESTIÓN DE LA INFORMACIÓNMARITZA PORRAS
 
Scribd, issuu y docstoc
Scribd, issuu y docstocScribd, issuu y docstoc
Scribd, issuu y docstocKarla Ibañez
 
Cango erik ii bimestre
Cango erik ii bimestreCango erik ii bimestre
Cango erik ii bimestreErik Cango
 
Diferencias entre word on line y drive
Diferencias entre word on line y driveDiferencias entre word on line y drive
Diferencias entre word on line y driveCamila Nieto
 
Menú archivo
Menú archivoMenú archivo
Menú archivokkobbyy
 
Scribd, issuu y docstoc
Scribd, issuu y docstocScribd, issuu y docstoc
Scribd, issuu y docstocAnyWriter
 
Funciones de word
Funciones de wordFunciones de word
Funciones de wordpaola196
 
Google Suite: Gmail, Inbox, Hangouts y Contactos
Google Suite: Gmail, Inbox, Hangouts y ContactosGoogle Suite: Gmail, Inbox, Hangouts y Contactos
Google Suite: Gmail, Inbox, Hangouts y ContactosRosa Liarte Alcaine
 
Almacenamiento y gestion de la informacion
Almacenamiento y gestion de la informacionAlmacenamiento y gestion de la informacion
Almacenamiento y gestion de la informacionlichita02
 

La actualidad más candente (20)

1.3 ALMACENAMIENTO Y GESTIÓN DE LA INFORMACIÓN
1.3 ALMACENAMIENTO Y GESTIÓN DE LA INFORMACIÓN1.3 ALMACENAMIENTO Y GESTIÓN DE LA INFORMACIÓN
1.3 ALMACENAMIENTO Y GESTIÓN DE LA INFORMACIÓN
 
Menú archivo
Menú archivoMenú archivo
Menú archivo
 
Scribd, issuu y docstoc
Scribd, issuu y docstocScribd, issuu y docstoc
Scribd, issuu y docstoc
 
Cango erik ii bimestre
Cango erik ii bimestreCango erik ii bimestre
Cango erik ii bimestre
 
Web 2.0
Web 2.0Web 2.0
Web 2.0
 
2 c Moran Danny
2 c Moran Danny 2 c Moran Danny
2 c Moran Danny
 
Diferencias entre word on line y drive
Diferencias entre word on line y driveDiferencias entre word on line y drive
Diferencias entre word on line y drive
 
Menú archivo
Menú archivoMenú archivo
Menú archivo
 
Scribd, issuu y docstoc
Scribd, issuu y docstocScribd, issuu y docstoc
Scribd, issuu y docstoc
 
Mis búsquedas google
Mis búsquedas googleMis búsquedas google
Mis búsquedas google
 
Diferencias.
Diferencias.Diferencias.
Diferencias.
 
Funciones de word
Funciones de wordFunciones de word
Funciones de word
 
Video
VideoVideo
Video
 
Scribd
ScribdScribd
Scribd
 
Google Suite: Gmail, Inbox, Hangouts y Contactos
Google Suite: Gmail, Inbox, Hangouts y ContactosGoogle Suite: Gmail, Inbox, Hangouts y Contactos
Google Suite: Gmail, Inbox, Hangouts y Contactos
 
Scribd
ScribdScribd
Scribd
 
Búsqueda en la web
 Búsqueda en la web Búsqueda en la web
Búsqueda en la web
 
Diapositivas daniela
Diapositivas danielaDiapositivas daniela
Diapositivas daniela
 
Almacenamiento y gestion de la informacion
Almacenamiento y gestion de la informacionAlmacenamiento y gestion de la informacion
Almacenamiento y gestion de la informacion
 
Taller
TallerTaller
Taller
 

Destacado

Lezione 16 (2 aprile 2012)
Lezione 16 (2 aprile 2012)Lezione 16 (2 aprile 2012)
Lezione 16 (2 aprile 2012)STELITANO
 
All about CSS MoRA ITS 11-12
All about CSS MoRA ITS 11-12All about CSS MoRA ITS 11-12
All about CSS MoRA ITS 11-12Ulir Rohwana
 
2012051101
20120511012012051101
2012051101ganaa_62
 
Heartwalk banner
Heartwalk bannerHeartwalk banner
Heartwalk bannerICrawford56
 
Programma pomezia
Programma pomeziaProgramma pomezia
Programma pomeziamaicagiulia
 
Claude Resources Inc. Q4 2011 Conference Call Presentation
Claude Resources Inc. Q4 2011 Conference Call PresentationClaude Resources Inc. Q4 2011 Conference Call Presentation
Claude Resources Inc. Q4 2011 Conference Call PresentationClaude Resources Inc.
 
Classification of cost accountant
Classification of cost accountantClassification of cost accountant
Classification of cost accountantBabasab Patil
 
LT at JavaOne2012 JVM language BoF #jt12_b101
LT at JavaOne2012  JVM language BoF #jt12_b101LT at JavaOne2012  JVM language BoF #jt12_b101
LT at JavaOne2012 JVM language BoF #jt12_b101Takeshi AKIMA
 
Writing Technology & Claro
Writing Technology & ClaroWriting Technology & Claro
Writing Technology & Claroiansyst
 
您可以幫心路什麼忙
您可以幫心路什麼忙您可以幫心路什麼忙
您可以幫心路什麼忙olivia1360
 
судьба его музыка
судьба его музыкасудьба его музыка
судьба его музыкаsvetlanakaizer
 
Judge 3D Sectors
Judge 3D SectorsJudge 3D Sectors
Judge 3D SectorsJohn Judge
 
Unit Results. APPENDIX 2
Unit Results. APPENDIX 2Unit Results. APPENDIX 2
Unit Results. APPENDIX 2Georgia Butler
 
PHILIP MORRIS_Selma Pinjo
PHILIP MORRIS_Selma PinjoPHILIP MORRIS_Selma Pinjo
PHILIP MORRIS_Selma PinjoDejan Civsa
 
美麗(雲南東川 )太美了 人間仙境
美麗(雲南東川 )太美了 人間仙境美麗(雲南東川 )太美了 人間仙境
美麗(雲南東川 )太美了 人間仙境olivia1360
 
saudi council of engineering
saudi council of engineeringsaudi council of engineering
saudi council of engineeringahmed abdelkader
 
Фрактальная природа IT-проектов (блиц)
Фрактальная природа IT-проектов (блиц)Фрактальная природа IT-проектов (блиц)
Фрактальная природа IT-проектов (блиц)Andrey Bibichev
 

Destacado (20)

7. fundamentos de las estrategias
7. fundamentos de las estrategias7. fundamentos de las estrategias
7. fundamentos de las estrategias
 
Lezione 16 (2 aprile 2012)
Lezione 16 (2 aprile 2012)Lezione 16 (2 aprile 2012)
Lezione 16 (2 aprile 2012)
 
All about CSS MoRA ITS 11-12
All about CSS MoRA ITS 11-12All about CSS MoRA ITS 11-12
All about CSS MoRA ITS 11-12
 
2012051101
20120511012012051101
2012051101
 
Heartwalk banner
Heartwalk bannerHeartwalk banner
Heartwalk banner
 
Programma pomezia
Programma pomeziaProgramma pomezia
Programma pomezia
 
Claude Resources Inc. Q4 2011 Conference Call Presentation
Claude Resources Inc. Q4 2011 Conference Call PresentationClaude Resources Inc. Q4 2011 Conference Call Presentation
Claude Resources Inc. Q4 2011 Conference Call Presentation
 
Classification of cost accountant
Classification of cost accountantClassification of cost accountant
Classification of cost accountant
 
LT at JavaOne2012 JVM language BoF #jt12_b101
LT at JavaOne2012  JVM language BoF #jt12_b101LT at JavaOne2012  JVM language BoF #jt12_b101
LT at JavaOne2012 JVM language BoF #jt12_b101
 
I am a bird
I am a birdI am a bird
I am a bird
 
Writing Technology & Claro
Writing Technology & ClaroWriting Technology & Claro
Writing Technology & Claro
 
您可以幫心路什麼忙
您可以幫心路什麼忙您可以幫心路什麼忙
您可以幫心路什麼忙
 
судьба его музыка
судьба его музыкасудьба его музыка
судьба его музыка
 
I cloud
I   cloudI   cloud
I cloud
 
Judge 3D Sectors
Judge 3D SectorsJudge 3D Sectors
Judge 3D Sectors
 
Unit Results. APPENDIX 2
Unit Results. APPENDIX 2Unit Results. APPENDIX 2
Unit Results. APPENDIX 2
 
PHILIP MORRIS_Selma Pinjo
PHILIP MORRIS_Selma PinjoPHILIP MORRIS_Selma Pinjo
PHILIP MORRIS_Selma Pinjo
 
美麗(雲南東川 )太美了 人間仙境
美麗(雲南東川 )太美了 人間仙境美麗(雲南東川 )太美了 人間仙境
美麗(雲南東川 )太美了 人間仙境
 
saudi council of engineering
saudi council of engineeringsaudi council of engineering
saudi council of engineering
 
Фрактальная природа IT-проектов (блиц)
Фрактальная природа IT-проектов (блиц)Фрактальная природа IT-проектов (блиц)
Фрактальная природа IT-проектов (блиц)
 

Similar a 1 (20)

Principios basicos del html
Principios basicos del htmlPrincipios basicos del html
Principios basicos del html
 
Camilo diaz
Camilo diazCamilo diaz
Camilo diaz
 
Desarrolla aplicaciones-web
Desarrolla aplicaciones-webDesarrolla aplicaciones-web
Desarrolla aplicaciones-web
 
Presentación
PresentaciónPresentación
Presentación
 
Narrativa pagina-web-welinton-burgos
Narrativa pagina-web-welinton-burgosNarrativa pagina-web-welinton-burgos
Narrativa pagina-web-welinton-burgos
 
Presentacion asignatura
Presentacion asignaturaPresentacion asignatura
Presentacion asignatura
 
S01
S01S01
S01
 
Html, Css y JavaScript
Html, Css y JavaScriptHtml, Css y JavaScript
Html, Css y JavaScript
 
Tipo
TipoTipo
Tipo
 
Codigos html y como crear una pagina Web
Codigos html y como crear una pagina WebCodigos html y como crear una pagina Web
Codigos html y como crear una pagina Web
 
Html
HtmlHtml
Html
 
(HTML) Conceptos básicos de una web
(HTML) Conceptos básicos de una web(HTML) Conceptos básicos de una web
(HTML) Conceptos básicos de una web
 
CODIGO HTML
CODIGO HTMLCODIGO HTML
CODIGO HTML
 
html
htmlhtml
html
 
HTML.ppt
HTML.pptHTML.ppt
HTML.ppt
 
Presentación de html, css y javascript.
Presentación  de html, css y javascript.Presentación  de html, css y javascript.
Presentación de html, css y javascript.
 
Etiquetas en Html
Etiquetas en HtmlEtiquetas en Html
Etiquetas en Html
 
Pres 2
Pres 2Pres 2
Pres 2
 
Cap02 (1)
Cap02 (1)Cap02 (1)
Cap02 (1)
 
Programación Avanzada
Programación AvanzadaProgramación Avanzada
Programación Avanzada
 

Último

La empresa sostenible: Principales Características, Barreras para su Avance y...
La empresa sostenible: Principales Características, Barreras para su Avance y...La empresa sostenible: Principales Características, Barreras para su Avance y...
La empresa sostenible: Principales Características, Barreras para su Avance y...JonathanCovena1
 
la unidad de s sesion edussssssssssssssscacio fisca
la unidad de s sesion edussssssssssssssscacio fiscala unidad de s sesion edussssssssssssssscacio fisca
la unidad de s sesion edussssssssssssssscacio fiscaeliseo91
 
DECÁGOLO DEL GENERAL ELOY ALFARO DELGADO
DECÁGOLO DEL GENERAL ELOY ALFARO DELGADODECÁGOLO DEL GENERAL ELOY ALFARO DELGADO
DECÁGOLO DEL GENERAL ELOY ALFARO DELGADOJosé Luis Palma
 
La triple Naturaleza del Hombre estudio.
La triple Naturaleza del Hombre estudio.La triple Naturaleza del Hombre estudio.
La triple Naturaleza del Hombre estudio.amayarogel
 
el CTE 6 DOCENTES 2 2023-2024abcdefghijoklmnñopqrstuvwxyz
el CTE 6 DOCENTES 2 2023-2024abcdefghijoklmnñopqrstuvwxyzel CTE 6 DOCENTES 2 2023-2024abcdefghijoklmnñopqrstuvwxyz
el CTE 6 DOCENTES 2 2023-2024abcdefghijoklmnñopqrstuvwxyzprofefilete
 
Dinámica florecillas a María en el mes d
Dinámica florecillas a María en el mes dDinámica florecillas a María en el mes d
Dinámica florecillas a María en el mes dstEphaniiie
 
Sesión de aprendizaje Planifica Textos argumentativo.docx
Sesión de aprendizaje Planifica Textos argumentativo.docxSesión de aprendizaje Planifica Textos argumentativo.docx
Sesión de aprendizaje Planifica Textos argumentativo.docxMaritzaRetamozoVera
 
Manual - ABAS II completo 263 hojas .pdf
Manual - ABAS II completo 263 hojas .pdfManual - ABAS II completo 263 hojas .pdf
Manual - ABAS II completo 263 hojas .pdfMaryRotonda1
 
Lecciones 04 Esc. Sabática. Defendamos la verdad
Lecciones 04 Esc. Sabática. Defendamos la verdadLecciones 04 Esc. Sabática. Defendamos la verdad
Lecciones 04 Esc. Sabática. Defendamos la verdadAlejandrino Halire Ccahuana
 
EXPANSIÓN ECONÓMICA DE OCCIDENTE LEÓN.pptx
EXPANSIÓN ECONÓMICA DE OCCIDENTE LEÓN.pptxEXPANSIÓN ECONÓMICA DE OCCIDENTE LEÓN.pptx
EXPANSIÓN ECONÓMICA DE OCCIDENTE LEÓN.pptxPryhaSalam
 
TIPOLOGÍA TEXTUAL- EXPOSICIÓN Y ARGUMENTACIÓN.pptx
TIPOLOGÍA TEXTUAL- EXPOSICIÓN Y ARGUMENTACIÓN.pptxTIPOLOGÍA TEXTUAL- EXPOSICIÓN Y ARGUMENTACIÓN.pptx
TIPOLOGÍA TEXTUAL- EXPOSICIÓN Y ARGUMENTACIÓN.pptxlclcarmen
 
2024 - Expo Visibles - Visibilidad Lesbica.pdf
2024 - Expo Visibles - Visibilidad Lesbica.pdf2024 - Expo Visibles - Visibilidad Lesbica.pdf
2024 - Expo Visibles - Visibilidad Lesbica.pdfBaker Publishing Company
 
RETO MES DE ABRIL .............................docx
RETO MES DE ABRIL .............................docxRETO MES DE ABRIL .............................docx
RETO MES DE ABRIL .............................docxAna Fernandez
 
CALENDARIZACION DE MAYO / RESPONSABILIDAD
CALENDARIZACION DE MAYO / RESPONSABILIDADCALENDARIZACION DE MAYO / RESPONSABILIDAD
CALENDARIZACION DE MAYO / RESPONSABILIDADauxsoporte
 
Caja de herramientas de inteligencia artificial para la academia y la investi...
Caja de herramientas de inteligencia artificial para la academia y la investi...Caja de herramientas de inteligencia artificial para la academia y la investi...
Caja de herramientas de inteligencia artificial para la academia y la investi...Lourdes Feria
 
Heinsohn Privacidad y Ciberseguridad para el sector educativo
Heinsohn Privacidad y Ciberseguridad para el sector educativoHeinsohn Privacidad y Ciberseguridad para el sector educativo
Heinsohn Privacidad y Ciberseguridad para el sector educativoFundación YOD YOD
 
NARRACIONES SOBRE LA VIDA DEL GENERAL ELOY ALFARO
NARRACIONES SOBRE LA VIDA DEL GENERAL ELOY ALFARONARRACIONES SOBRE LA VIDA DEL GENERAL ELOY ALFARO
NARRACIONES SOBRE LA VIDA DEL GENERAL ELOY ALFAROJosé Luis Palma
 
TECNOLOGÍA FARMACEUTICA OPERACIONES UNITARIAS.pptx
TECNOLOGÍA FARMACEUTICA OPERACIONES UNITARIAS.pptxTECNOLOGÍA FARMACEUTICA OPERACIONES UNITARIAS.pptx
TECNOLOGÍA FARMACEUTICA OPERACIONES UNITARIAS.pptxKarlaMassielMartinez
 

Último (20)

La empresa sostenible: Principales Características, Barreras para su Avance y...
La empresa sostenible: Principales Características, Barreras para su Avance y...La empresa sostenible: Principales Características, Barreras para su Avance y...
La empresa sostenible: Principales Características, Barreras para su Avance y...
 
la unidad de s sesion edussssssssssssssscacio fisca
la unidad de s sesion edussssssssssssssscacio fiscala unidad de s sesion edussssssssssssssscacio fisca
la unidad de s sesion edussssssssssssssscacio fisca
 
DECÁGOLO DEL GENERAL ELOY ALFARO DELGADO
DECÁGOLO DEL GENERAL ELOY ALFARO DELGADODECÁGOLO DEL GENERAL ELOY ALFARO DELGADO
DECÁGOLO DEL GENERAL ELOY ALFARO DELGADO
 
La triple Naturaleza del Hombre estudio.
La triple Naturaleza del Hombre estudio.La triple Naturaleza del Hombre estudio.
La triple Naturaleza del Hombre estudio.
 
el CTE 6 DOCENTES 2 2023-2024abcdefghijoklmnñopqrstuvwxyz
el CTE 6 DOCENTES 2 2023-2024abcdefghijoklmnñopqrstuvwxyzel CTE 6 DOCENTES 2 2023-2024abcdefghijoklmnñopqrstuvwxyz
el CTE 6 DOCENTES 2 2023-2024abcdefghijoklmnñopqrstuvwxyz
 
Dinámica florecillas a María en el mes d
Dinámica florecillas a María en el mes dDinámica florecillas a María en el mes d
Dinámica florecillas a María en el mes d
 
Sesión de aprendizaje Planifica Textos argumentativo.docx
Sesión de aprendizaje Planifica Textos argumentativo.docxSesión de aprendizaje Planifica Textos argumentativo.docx
Sesión de aprendizaje Planifica Textos argumentativo.docx
 
Manual - ABAS II completo 263 hojas .pdf
Manual - ABAS II completo 263 hojas .pdfManual - ABAS II completo 263 hojas .pdf
Manual - ABAS II completo 263 hojas .pdf
 
Lecciones 04 Esc. Sabática. Defendamos la verdad
Lecciones 04 Esc. Sabática. Defendamos la verdadLecciones 04 Esc. Sabática. Defendamos la verdad
Lecciones 04 Esc. Sabática. Defendamos la verdad
 
EXPANSIÓN ECONÓMICA DE OCCIDENTE LEÓN.pptx
EXPANSIÓN ECONÓMICA DE OCCIDENTE LEÓN.pptxEXPANSIÓN ECONÓMICA DE OCCIDENTE LEÓN.pptx
EXPANSIÓN ECONÓMICA DE OCCIDENTE LEÓN.pptx
 
TIPOLOGÍA TEXTUAL- EXPOSICIÓN Y ARGUMENTACIÓN.pptx
TIPOLOGÍA TEXTUAL- EXPOSICIÓN Y ARGUMENTACIÓN.pptxTIPOLOGÍA TEXTUAL- EXPOSICIÓN Y ARGUMENTACIÓN.pptx
TIPOLOGÍA TEXTUAL- EXPOSICIÓN Y ARGUMENTACIÓN.pptx
 
2024 - Expo Visibles - Visibilidad Lesbica.pdf
2024 - Expo Visibles - Visibilidad Lesbica.pdf2024 - Expo Visibles - Visibilidad Lesbica.pdf
2024 - Expo Visibles - Visibilidad Lesbica.pdf
 
Power Point: "Defendamos la verdad".pptx
Power Point: "Defendamos la verdad".pptxPower Point: "Defendamos la verdad".pptx
Power Point: "Defendamos la verdad".pptx
 
RETO MES DE ABRIL .............................docx
RETO MES DE ABRIL .............................docxRETO MES DE ABRIL .............................docx
RETO MES DE ABRIL .............................docx
 
CALENDARIZACION DE MAYO / RESPONSABILIDAD
CALENDARIZACION DE MAYO / RESPONSABILIDADCALENDARIZACION DE MAYO / RESPONSABILIDAD
CALENDARIZACION DE MAYO / RESPONSABILIDAD
 
Caja de herramientas de inteligencia artificial para la academia y la investi...
Caja de herramientas de inteligencia artificial para la academia y la investi...Caja de herramientas de inteligencia artificial para la academia y la investi...
Caja de herramientas de inteligencia artificial para la academia y la investi...
 
Repaso Pruebas CRECE PR 2024. Ciencia General
Repaso Pruebas CRECE PR 2024. Ciencia GeneralRepaso Pruebas CRECE PR 2024. Ciencia General
Repaso Pruebas CRECE PR 2024. Ciencia General
 
Heinsohn Privacidad y Ciberseguridad para el sector educativo
Heinsohn Privacidad y Ciberseguridad para el sector educativoHeinsohn Privacidad y Ciberseguridad para el sector educativo
Heinsohn Privacidad y Ciberseguridad para el sector educativo
 
NARRACIONES SOBRE LA VIDA DEL GENERAL ELOY ALFARO
NARRACIONES SOBRE LA VIDA DEL GENERAL ELOY ALFARONARRACIONES SOBRE LA VIDA DEL GENERAL ELOY ALFARO
NARRACIONES SOBRE LA VIDA DEL GENERAL ELOY ALFARO
 
TECNOLOGÍA FARMACEUTICA OPERACIONES UNITARIAS.pptx
TECNOLOGÍA FARMACEUTICA OPERACIONES UNITARIAS.pptxTECNOLOGÍA FARMACEUTICA OPERACIONES UNITARIAS.pptx
TECNOLOGÍA FARMACEUTICA OPERACIONES UNITARIAS.pptx
 

1

  • 1. Introducción al HTML Colnodo Ariel Barbosa & Sylvia Cadena 02.2001
  • 2. Vamos a hablar de...HTML • 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
  • 3. 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
  • 4. HTML: qué no es? • 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
  • 5. Como funciona? Cliente Cliente: • Explorer • Netscape Dame el archivo x Aquí está Protocolo http Servidor Remoto
  • 6. La Telaraña Mundial Múltiples usos: • Educación • Investigación • Mercadeo • Desarrollo (ddhh y paz, medio ambiente, equidad, diversidad, hábitat, comercio justo)
  • 7.
  • 8. Estándares de HTML 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)
  • 9. Terminología 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/
  • 10. Fundamentos • 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>
  • 11. Documentos Básicos 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
  • 12. 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
  • 13. Elementos Básicos 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="…">
  • 14. Caracteres Especiales • Permiten que diferentes navegadores hagan visibles los caracteres diagráficos de los idiomas diferentes al inglés: á é í ó ú &aacute; à è ì ò ù &agrave; ñ ç ö &ntilde;
  • 15. Tablas • Organización comparativa de información • Ubicación dentro de la página • Múltiples atributos para especificar
  • 16.
  • 17. Formularios • Interactividad • Retroalimentación • Recolección de datos • Pueden tabularse y analizarse • Respuestas personalizadas • Aceptado por todos los navegadores
  • 18.
  • 19. Creando documentos 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
  • 20. Herramientas avanzadas • 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