Más contenido relacionado
HTML
- 1. Hypertext Markup Language HTML DiseñoDigital Lic. Diseño Gráfico UCA
- 2. HTML HTML es unlenguaje de marcas, sencillo, pensado para el intercambio de información en la WWW. Se trata de una "Definición de Tipo de Documento (DTD)" SGML (Standard Generalised Markup Language) que contiene un juego de marcas con las que se identifican gran parte de los elementos que se encuentran en los documentos electrónicos típicos.
- 3.
- 4. Elementos • Etiquetas <BR> <HR> <P> • Paresde etiquetas <Etiqueta> Texto </Etiqueta> ■ Etiquetas con atributos <Etiqueta Atributo="Valor"> • Las etiquetas pueden anidarse
- 5. Estructura básica <HTML> Código dela página </HTML>
- 6. Estructura General <!DOCTYPE HTMLPUBLIC “version html”> <HTML> <HEAD> <TITLE> Titulo de mi Página</TITLE> ...... Información opcional ..... </HEAD> <BODY> .... el texto del documento con marcas.... </BODY> </HTML> Cabecera Cuerpo
- 7. Reglas Generales • Losdocumentos son estructurados • Nombres de elementos o atributos no sensibles a mayúsculas • Valores de atributos pueden ser sensibles a mayúsculas • Nombres de elementos no pueden contener espacios • Usar comillas para valores de atributos • El browser destruye e ignora caracteres de espacio • No es un WYSIWYG
- 8. Reglas Generales • Puedecontener comentarios <!- Comentario -> • Anidamiento estricto (bien formado) • Ignora elementos desconocidos • Ignora atributos desconocidos • Los browsers suelen ser permisivos
- 9. Herramientas para escribirHTML ■ Editores de texto: programas sencillos, que nos permiten escribir el código de la página en texto sin formato, y guardarlo con extención .HTML
- 10. Herramientas para escribirHTML ■ Editores WYSIWYG (What You See Is What You Get, lo que ves es lo que obtienes): estos editores permiten crear páginas web sin escribir código HTML como si se tratase de un programa de dibujo por ordenador.
- 11. Elemento HTML Nombre de La Etiqueta Nombredel atributo Valor del atributo Atribut o Contenido Etiquet a Final Elemento HTML <H1 ALIGN=“LEFT”> Encabezado de Ejemplo </H1> Etiqueta de Inicio
- 12. Documento HTML concabecera <html> <head> Elementos de la cabecera </head> ... Resto de código de la página ... </html>
- 13. Documento HTML contítulo <html> <head> <title>Mi primera página WEB</title> </head> </html>
- 14. Documento HTML concontenido <html> <head> <title>Mi primera página WEB</title> </head> <body> Hola a todos, como han deducido por el título esta es la primera página web que hago, espero que les guste. Seguiré mejorando. </body> </html>
- 15. Documento HTML conencabezados <h1>Encabezado 1</h1> <h2>Encabezado 2</h2> <h3>Encabezado 3</h3> <h4>Encabezado 4</h4> <h5>Encabezado 5</h5> <h6>Encabezado 6</h6>
- 16. Uso de etiquetasHTML ■ <HR> Dibujo de líneas horizontales ■ <BR> Escritura de contenido sin tener en cuenta espacios en blanco ■ ■ <P> Escritura de párrafos ■ Comentarios <!-- Esto es un comentario -->
- 17. Presentación de textoen HTML ■ Alineamiento align "center", "left" y "right" ■ Espaciado <br> ■ Tipo de letra <B>, <I>, <TT>, <STRIKE>, <BIG>, <SMALL>, <SUB>, <U> <SUP>, <SUB>, <STRONG>, <EM>, <CODE>, <SAMP>, <VAR> <CITE>, <DFN>, <PRE> ■ Tamaño de letra <FONT SIZE=""> ■ Color de letra <FONT COLOR="#RRGGBB">
- 18. Presentación de textoen HTML ■ Escritura de caracteres del alfabeto español á, é, í, ó, ú, ñ Á, É, Í, Ó, Ú, Ñ ■ Escritura de caracteres especiales <, >, &, " &#nnn;
- 19. Presentación de textoen HTML ■ Listas – Numerada u ordenada <OL> <LI> – No ordenada <UL> <LI> – Listas de glosario o de definición <DL> <LI> – Menús <MENU> <LI> – Listas de directorio <DIR> <LI> ■ Tablas <TABLE>, <TR>, <TH>, <TD>
- 20. Imágenes en HTML <imgsrc=“image001.gif"> ■ <IMG> ■ La imagen tiene que estar en un archivo separado ■ Ejemplos de tipo de archivo: BMP, GIF, JPEG, XPM, XBM, PNG, TIFF,
- 21. Enlaces hipertexto enHTML ■ Referencia externa: <a href="http://www.sitio.com/ancla_en#S">Texto sensible</a>
- 22. Apariencia de unapágina ■ Color de fondo <body bgcolor="#RRGGBB"> ■ Imágenes de fondo <body background="fondo1.jpg"> ■ Imágenes y texto <h2> <img src=“dibujo.gif">Texto …</h2> ■ Imagen de enlace <a href="index.htm"> <img src="img/izda.gif"> </a>
- 23. Otras facilidades enHTML ■ Uso de frames ■ Videos ■ Sonido ■ Multimedia <A HREF=“archivo_multimedia"> Un archivo multimedia </A>
- 24. Hypertext Markup Language HTML Diseñoy programación web Lic. Marketing Digital UCA