Please enable JavaScript.

Coggle requires JavaScript to display documents.

UNIDAD 2 HTML,XML,CSS image - Coggle Diagram

- - - - Especifica las operaciones tipograficas y las funciones que deben ejecutar el programa navegador/visualizar sobre dichos elementos.
        Separar un texto en los elementos de los que se compone, como un parrafo, un capitulo ,un encabezado.
- - - - Los distintos navegadores muestran sus documentos de formas distintas: varía el color, el tipo de fuente, el tamaño, etc. Por lo tanto debes pensar en tu documento como una entidad lógica y no física, reconociendo que el aspecto físico puede variar de un visor a otro y de un PC a otro. Por ejemplo, si introduces tipos de letra especiales (que se salgan de los corrientes que tienen todos los PCs, en Arial, Courier, Times o Helvetica) dentro de tu página web, cuando alguien la "vea" en Internet, visualizará esos tipos de letra si están instalados en su PC, si no los verá con el tipo de letra que tenga cargado por defecto en su navegador.
      - Los códigos de composición se acotan con unos caracteres especiales, que permiten diferenciarlos del texto del documento propiamente dicho. Estos símbolos son los corchetes angulares < y >. Estos códigos no distinguen entre mayúsculas y minúsculas aunque la normalización W3C indique que debemos usar minúsculas.
      - Lo que distingue a un archivo HTML de cualquier otro archivo de texto es la presencia de códigos de composición, denominados marcadores HTML. Estos códigos se incluyen en el documento y sirve para controlar el formato y la presentación del documento final. Los códigos también sirven para crear hipervínculos con otros documentos.
  - - - Marcador <html>: todos y cada uno de los documentos HTML deben empezar y terminar con este marcador que sirve para indicar que se trata de un documento HTML. En el marcador de cierre es obligatoria la barra inclinada (/html).
      - En html 5 la prímera línea es <!DOCTYPE html>
      - Marcador <head>: los documentos HTML se dividen en dos partes, la cabecera y el cuerpo. Los navegadores Web necesitan distinguir entre cabecera y cuerpo para poder interpretar correctamente los documentos. En general la cabecera del documento (head) incluye la información general sobre el documento. Este marcador tienen su marcador de terminación con la barra inclinada (/head).
      - Marcador <body>: incluye el contenido real del documento (body o cuerpo). Este marcador tiene también su marcador de terminación con la barra inclinada </body>.
  - - - Los navegadores muestran el título de cada uno de los documentos HTML que encuentran. El título que aparece se toma del contenido de este marcador. Este marcador debe aparecer con su pareja con la barra inclinada </title> y dentro de la sección <head>
      - Marcador <title>
      - Contiene información general sobre el documento HTML. Es obligatorio incluir el marcador <title>, el resto de los marcadores son opcionales.
- - - - La mayor parte del contenido de las páginas HTML habituales está formado por texto, llegando a ser más del 90% del código de la página. Por este motivo, es muy importante conocer los
      - elementos y etiquetas que define HTML para el manejo del texto.El lenguaje HTML incorpora al tratamiento del texto muchas de las ideas y normas establecidas en otros entornos de publicación de contenidos.
      - De esta forma, HTML define etiquetas para estructurar el contenido en secciones y párrafos y define otras etiquetas para marcar
      - La forma más sencilla de estructurar un texto consiste en separarlo por párrafos. Además, HTML
        
        permite incluir títulos que delimitan cada una de las secciones.
        
        Una de las etiquetas más utilizadas de HTML es la etiqueta <p>, que permite definir los párrafos
        
        forman el texto de una página
  - - - Ordenadas.
        
        Son aquellas que ordenan la lista anteponiendo números ,letras o signos.Las listas ordenadas comienzan con la etiqueta <ol> y para cada uno de los items de la misma, utilizamos la etiqueta <li>
        
        Desordenadas.
        
        Exponen la lista anteponiendo un punto, cuadrado o triángulo negro.
        
        Las listas desordenadas comienzan con la etiqueta <ul> y para cada uno de los Items de la misma utilizamos la etiqueta <li>.
        
        De definición.
        
        Se utilizan para definir términos.Las listas de definición se representan con la etiqueta <dl>.Los términos de las mismas con <dt>.La definición de esos términos comienza con <dd>.
  - - - Los Enlaces o Links
      - Los enlaces o links(en Inglés) nos permiten conectarnos con otros documentos:
      - una imagen
      - un video
      - un archivo de sonido
      - sitios en la web(otra página web)
      - mandar un email
      - Para ello debemos usar la etiqueta <a> que proviene de la primera letra de la palabraanchor(ancla).
      - La etiqueta <a> tiene como cierre </a>.
      - Sintaxis
        <a atributo="valor">Texto del enlace</a>
  - - - Las tablas permiten ordenar y alinear los elementos de un documento de una manera precisa.
      - Las tablas son mucho más frecuentes de lo que parece a primera vista, puesto que, en la mayor parte de los casos, las líneas que las definen permanecen ocultas.
      - Las etiquetas fundamentales que definen una tabla son las siguientes:
  - - - Para insertar imágenes en un sitio usaremos la etiqueta <img>.
      - Esta etiqueta debe ir acompañada del atributo src que es el que contiene el URL de la ubicación del archivo de la imagen.
      - El atributo alt se utiliza para dar una breve descripción de la imagen, la cual podremos observar en caso que el navegador del usuario, por alguna razón, no muestre la misma.
      - La etiqueta <img> no tiene cierre.
- - - - El lenguaje de presentación es aquel que indica el formato del texto. Este tipo de marcado es útil para maquetar la presentación de un documento para su lectura, pero resulta insuficiente para el procesamiento automático de la información.
- - - - METHOD indica cómo se enviarán las respuestas
        
        “POST” es el valor que envía los datos al agente de procesamiento almacenándolos en el cuerpo del formulario, en tanto que “GET” envía los datos agregándolos a la dirección URL y separándolos de la dirección con un signo de interrogación (para aprender más sobre los métodos POST y GET, consulte el artículo sobre protocolo HTTP)
        
        ACTION indica la dirección a la que se enviará la información (un script CGI o dirección de correo electrónico)
        
        Un atributo opcional de la etiqueta FORM es ENCTYPE, que especifica cómo se codifican los datos del formulario
      - La etiqueta FORM actúa como una especie de contenedor para almacenar elementos que permiten al usuario seleccionar o introducir datos. Todos los datos se enviarán a la dirección URL indicada en el atributo ACTION de la etiqueta FORM, por el método indicado en el atributo METHOD.
        
        Se puede insertar cualquier elemento HTML en una etiqueta FORM (como texto, botones, tablas y enlaces), pero los elementos interactivos son los más interesantes. Estos elementos interactivos son:
        
        La etiqueta INPUT: Todos los botones y casillas de texto
        
        La etiqueta TEXTAREA: una casilla de texto
        
        La etiqueta SELECT: una lista de opciones múltiples
- - - - Los navegadores crean y colocan las cajas de forma automática, pero CSS permite modificar todas sus características. Cada una de las cajas está formada por seis partes
        
        Las partes que componen cada caja y su orden de visualización desde el punto de vista del usuario son las siguientes:
        
        Contenido (content): se trata del contenido HTML del elemento (las palabras de un párrafo, una imagen, el texto de una lista de elementos, etc.)
        
        Relleno (padding): espacio libre opcional existente entre el contenido y el borde.
        
        Borde (border): línea que encierra completamente el contenido y su relleno.
        
        Imagen de fondo (background image): imagen que se muestra por detrás del contenido y el espacio de relleno.
        
        Color de fondo (background color): color que se muestra por detrás del contenido y el espacio de relleno.
        
        Margen (margin): separación opcional existente entre la caja y el resto de cajas adyacentes.