MANUAL DE USUARIO ANDRES PACHON 11A
HTML
Contenido INTRODUCCION..................................................................................................................................2 Introducción de uso...........................................................................................................................4 ETIQUETA BASICAS.............................................................................................................................8 ADVERTENCIAS.................................................................................................................................11
I
INTRODUCCION HTML es un lenguaje de marcado que se utiliza para el desarrollo de páginas de Internet. Se trata de la sigla que corresponde a HyperText Markup Language, es decir, Lenguaje de Marcas de Hipertexto, que podría ser traducido como Lenguaje de Formato de Documentos para Hipertexto. Se trata de un formato abierto que surgió a partir de las etiquetas SGML (Standard Generalized Markup Language). Concepto traducido generalmente como «Estándar de Lenguaje de Marcado Generalizado» y que se entiende como un sistema que permite ordenar y etiquetar diversos documentos dentro de una lista. Este lenguaje es el que se utiliza para especificar los nombres de las etiquetas que se utilizarán al ordenar, no existen reglas para dicha organización, por eso se dice que es un sistema de formato abierto. EL HTML se encarga de desarrollar una descripción sobre los contenidos que aparecen como textos y sobre su estructura, complementando dicho texto con diversos objetos (como fotografías, animaciones, etc). Es un lenguaje muy simple y general que sirve para definir otros lenguajes que tienen que ver con el formato de los documentos. El texto en él se crea a partir de etiquetas, también llamadas tags, que permiten interconectar diversos conceptos y formatos. Para la escritura de este lenguaje, pues, se crean las etiquetas que aparecen especificadas a través de corchetes o paréntesis angulares: < y >. Entre sus componentes, los elementos dan forma a la
estructura esencial del lenguaje, ya que tienen dos propiedades (el contenido en sí mismo y sus atributos). Por otra parte, cabe destacar que el HTML permite ciertos códigos que se conocen como scripts, los cuales brindan instrucciones específicas a los navegadores que se encargan de procesar el lenguaje. Entre los scripts que pueden agregarse, los más conocidos y utilizados son JavaScript y PHP. El marcado estructural es el que estipula la finalidad del texto, aunque no define cómo se verá el elemento. El marcado presentacional, por su parte, es el que se encarga de señalar cómo se verá el texto más allá de su función. Para conocer el código HTML que utiliza una página web, hay que seleccionar Ver código fuente en nuestro navegador (como Internet Explorer o Mozilla Firefox). Al elegir esta opción, se abrirá el editor de texto con el código HTML de la página que se está visualizando.
Introducción de uso 1.Paso
Para comenzar primero debemos descargar una aplicación donde podamos escribir el código html, hay dos opciones en el block de notas o sublime text, por mi parte recomiendo mucho sublime text es más sencillo a la hora de escribir nuestro código. Lo primero es en el navegador buscar sublime text 3 y damos click en la primera parte que dice descargar.
Le damos descargar versión Windows 64 y nos va a dar un archivo para instalar el programa.
Le damos abrir al instalador y damos next, y por último instalar el programa, ya solo sería esperar a que instale, abrir la aplicación y empezar con el código html
Ahora en sublime text debemos guardar nuestro archivo como un documento html de la siguiente manera.
Damos click donde dice save(guardar).
Guardamos nuestro documento como index.html, esto es muy importante escribir el html al final porque se esta dando a entender que es un documento tipo html.
Nos va a quedar este archivo que lo podremos abrir en una pagina de Chrome o cualquier navegador, mientras pongamos etiquetas van aparecer texto o imágenes, si no tenemos ninguna etiqueta va a salir en blanco.
ETIQUETA BASICAS ¡La primera etiqueta que usamos al iniciar nuestro código es <!DOCTYPE html> esta nos permite identificar el tipo de lenguaje programación que vamos a usar que es html.
La siguiente etiqueta que usamos después del doctype es la de (<htm>l) que esta nos indica desde donde empieza nuestro código y hasta donde termina.
Seguiría la de <head> que nos permite editar el encabezado de la página web y va acompañado de otra etiqueta que es <title>.
Asi quedaría.
Después sigue la etiqueta donde va el cuerpo de trabajo, donde se pone todo los textos, títulos, imágenes, videos, etc.
Las etiquetas para los títulos o subtítulos son las siguientes:
Cada una tiene distinto tamaño y la h1 es para el titulo principal, las que siguen después de h2 se pueden usar cuantas veces quieran.
La <p> nos sirve para poner nuestros textos más importantes.
Esta nos sirve para hacer listas, lo primero es usar la etiqueta <ul></ul> entre medio de estas ponemos <li></li> y después entre medio de estas escribimos la cosa que queremos notar en forma de lista.
Lo primero es poner table, después <tr> y en medio de estas <td>que es el texto que vamos a poner en nuestra tabla, por cada fila hay que escribir, <tr> y en medio el <td>, y en medio del td el texto. quedaría de esta forma y para poner borde a la tabla hay que escribir al pie de table de la siguiente forma. <table border=”2”> Depende de número se pone más grueso el marco.
Esta nos sirve para poner imágenes, es importante guardar las imágenes en una misma carpeta donde este la página, porque donde dice (perro.jpg) lo que va hacer es buscar dentro de esa carpeta ese archivo con ese nombre. Siempre hay que poner de nombre al final .png o jpg a la imagen que vayan a poner. Y el widht, height es para el alto y ancho de la imagen.
Esta nos sirve para poner hipervínculos, después del( <a href) ponemos algún link de youtube o de una página.
ADVERTENCIAS Cada etiqueta siempre se cierra con </> esto es muy importante o si no el programa no va a saber hasta dónde cierra esa etiqueta y no va funcionar. Guardar todo en una misma carpeta así es más fácil organizarse al momento de poner imágenes. Mirar que las etiquetas estén bien escritas porque podrían fallar. No usar muchos h1, este es solo para el titulo principal. Ver que el nombre de las imágenes terminen.jpg o png
