MANUAL BÁSICO DE HTML

MANUAL BÁSICO DE HTML

1. Manual Básico de HTML

   • Se trata de un manual y guía de instrucciones a la vez, que explica los usos, aplicaciones y resultados de varias etiquetas (instrucciones) de HTML

2. ¿Qué es HTML?

   • Es un conjunto o serie de etiquetas incluidas en archivos de texto que definen la estructura de un documento WWW y sus vínculos con otros documentos

3. ¿Por dónde comenzar?

   • Lo primero es saber donde crear el archivo texto que contendrá las instrucciones HTML (Hipertexto
     • Páginas WEB
       • El Hipertexto es un archivo de texto que contiene instrucciones que pueden ser interpretadas por un navegador de Internet. Estas instrucciones son denominadas Etiquetas.
     • Etiquetas
       • Una etiqueta cumple su función de la siguiente manera: <nombre de la etiqueta> Apertura de una etiqueta siempre entre “< >”
     • Estructura básica de una página WEB
       • Una página web esta compuesta de 2 partes: el encabezamiento y el cuerpo de la página. Paralelamente a esto, existen tres etiquetas fundamentales, las mismas que deben estar incluidas en el archivo HTML de manera obligatoria
         • <html> </html> Indica al navegador que el documento texto que esta leyendo es un documento HTML. Esta etiqueta se abre al inicio del archivo y se cierra al final del mismo.
         • <head> </head> Acá se detalla el encabezado de la página WEB. Esta etiqueta se abre luego de <html>.
         • <body> </body> Cuerpo de la página donde se despliega el contenido global

4. ¿Cómo se utilizan los colores en HTML?

   • Se pueden llegar a tener 16 millones de colores en una página web
     • 1. Se especifica el color deseado directamente con el nombre del color en ingles: Ej: blue, green, yellow
     • 2. Se especifica el color deseado mediante números hexadecimales mediante la siguiente estructura: #RRVVAA

5. Texto en HTML

   • HTML fue creado en principio para el alfabeto en inglés, sin embargo se buscaron modos para mostrar también caracteres o símbolos denominados especiales. Para utilizar caracteres especiales usaremos los símbolos & y ; para denotar el inicio y final respectivamente de un símbolo especial

6. Encabezados

   • Las etiquetas <h1> </h1> al <h6> </h6> (acrónimos de “heading 1..6”) son encabezados del cuerpo del texto. El encabezamiento <h1> nos proporciona las letras de mayor tamaño.

7. Ubicación, formato y atributos de texto

   • Etiqueta <center> </center> Se utiliza para centrar el texto/imagen o datos que se encuentren entre la apertura y el cierre.
   • Etiqueta <b> </b> Esta es la etiqueta que nos posibilita un texto con negrillas.
   • Etiqueta <u> </u> Etiqueta que posibilita resaltar un texto con subrayado
   • Etiqueta <i> </i> Etiqueta que permite resaltar el texto con inclinación itálica.

8. Imágenes en HTML

   • Comenzemos a introducir gráficos en nuestra página HTML. Se deben tener dos consideraciones importantes para trabajar con gráficos: Los únicos formatos, que por ahora soportan los visualizadores son: *.gif y *.jpg o *.jpeg.

9. Tablas

   • En HTML también podemos incluir arreglos de tablas. Se deben utilizar varias etiquetas:
     • Etiqueta <table></table> Señala el inicio y final de una tabla. Sus atributos son: • Align,• Bgcolor,• Border,• BorderColo,• BorderDark,• BorderLight,• Caption ,• Cellpadding , Cellspacing,
     • Etiqueta <th> </th> Indica al navegador cliente que exhiba el texto como un encabezado en la primera fila de una tabla. Atributos principales: Colspan ,Align
     • Etiqueta <tr> </tr> Indica al navegador que exhiba el texto dentro de una fila; puede también interpretarse como la etiqueta que define filas., Align
     • Etiqueta <td> </td> La etiqueta de datos de la tabla, es la que identifica a las columnas o celdas específicas de una tabla. Atributos principales: , Align , ,Background, Width

10. Numeración y viñetas

    • En HTML todo es posible, y tal cual en un editor de texto podemos trabajar con numeración y viñetas, lo podemos hacer acá.
      • Etiqueta <ul> </ul> Indica al navegador que cree una lista con viñetas no ordenada.
      • Etiqueta <ol> </ol> Listas ordenadas, esta etiqueta predeterminada indica al navegador que numera la lista de elementos comprendidos dentro de las etiquetas <ol>
      • Etiqueta <li> </li> Se usa para indicar al navegador que exhiba el texto que le sigue como un elemento de línea en una lista. Atributos: • Type ,• Value

11. Hipervínculos

    • Un vínculo hipertextual es un texto, botón o imagen que al seleccionar nos lleva a otra dirección URL, página WEB o recurso.
      • Etiqueta <A> </A> La etiqueta <A> que viene de “ancla”, denota el inicio y el final de una instrucción que contiene alguna forma de vínculo o hipervínculo. Esta etiqueta permite al usuario vincularse a otra ubicación dentro del mismo documento HTML, a otro sitio WEB, a un servidor FTP, enlace de correo electrónico, ... Atributos: ,• HREF ,• NAME ,• TARGET

12. Frames

    • Ofrece la posibilidad de utilizar marcos y varias páginas en una sola.
      • Etiqueta <frameset> </frameset> Define la disposición gráfica de los marcos en la pantalla. Atributos: • Rows , Cols, • Framespacing
      • Etiqueta <frame></frame> Define un solo marco que forma parte del conjunto de marcos definidos en <frameset>.Sus atributos son: ,• Marginheight ,MarginWidth , Name,Noresize , Scrolling , SRC
      • Etiqueta <noframes></noframes> Etiqueta que es usada para desplegar un texto o una página alternativa cuando un navegador no es capaz de desplegar los marcos

Bilder und Dateien der Mindmap