Академический Документы
Профессиональный Документы
Культура Документы
la elaboracin de pginas web. Es un conjunto de etiquetas incluidas en archivos de texto que estructuran una pgina web. Los navegadores leen estos archivos de texto e interpretan esas etiquetas para determinar cmo desplegar la pgina Web.
Para la elaboracin de una pgina web, debemos de tener en cuenta en donde crearemos el archivo de texto donde contendr dichas instrucciones HTML, para lo cual necesitaremos de ciertas herramientas o programas, entre ellas tenemos: Microsoft Front Page Bloc de Notas o NotePad Dreamweaver CS6 Sublime Text 2
Ahora podemos decir que es un archivo de texto que contiene instrucciones que pueden ser interpretados por los navegadores de internet, estas instrucciones se denominan Etiquetas.
Una pgina web est compuesta de 2 partes, que son el encabezamiento y el cuerpo de la pgina. Existen 3 etiquetas que deben de estar de manera obligatoria dentro del archivo HTML y que son fundamentales para su funcionamiento
<html></html> Indica al navegador que el documento de texto que se esta leyendo es un documento HTML. Esta etiqueta se abre al inicio y se cierra al final del mismo. <head></head> En esta etiqueta se detalla el encabezado de la pagina WEB. Esta etiqueta se abre luego de <html>.
<body></body> Cuerpo de la pagina, aqu en donde se despliega el contenido global que se mostrara en la pagina, se abre luego del cierre de la etiqueta </head> y se cierra antes de la etiqueta </html>.
La primera lnea de HTML de cualquier pgina web sirve para identificar el tipo de lenguaje utilizado y se le conoce como DOCTYPE (Document Type Declaration, Declaracin de tipo de documento). La declaracin de esta etiqueta al inicio del desarrollo de una pgina web, es muy importante, ya que a travs de ella podemos definir el tipo de documento que vamos a utilizar.
<meta charset=UTF-8> Al aadir esta lnea en la cabecera, indica el tipo de codificacin, para que los caracteres en castellano aparezcan bien en los navegadores cuando se escribe cdigo HTML5.
UTF-8: (8-bit Unicode Transformation Format) es un formato de codificacin de caracteres Unicode e ISO 10646 utilizando smbolos de longitud variable.
Desarrollaremos de una manera mas didctica la estructura bsica de una pgina web, con las etiquetas aprendidas hasta el momento:
Guardando el archivo con la extensin (.html) y al ejecutarlo tenemos como resultado una pgina con el mensaje escrito en el cuerpo.
Esta etiqueta va en la parte del encabezamiento de la pgina web, es decir en el HEAD, y define el titulo de la pgina web, misma que aparecer en la parte superior del navegador.
La etiqueta meta se utiliza para aadir informacin sobre la pgina. Esta informacin puede ser utilizada por los navegadores. Los navegadores consultan la informacin de las etiquetas <meta/> de las paginas, buscando coincidencias con las que el usuario pretende encontrar
Cuenta con dos atributos name y content. El atributo name indica el tipo de informacin, y el atributo content indica el valor de dicha informacin. Tipo de Informacin:
Tipo
Author Classification Description
Significado
Autor de la pagina Palabras para clasificar la pagina en los buscadores Descripcin del contenido de la pgina. Programa utilizado para crear la pagina. Palabras clave.
Generator
Keywords
Como hemos visto anteriormente la etiqueta body es el cuerpo de la pgina, entonces es dentro de ella donde debemos incluir texto, imgenes y formatos visibles al usuario, que son las que se mostrara en la pagina.
Vlink Background
Define el color del vnculo ya visitado. Define el archivo grafico que ser desplegado como fondo.
Realizaremos una pagina con un fondo de color amarillo (#FFFF00) y con texto de color rojo (#FF0000):
Obtendremos como resultado una pagina con los colores que hemos determinado, as mismo podramos ponerle una imagen de fondo a travs de el atributo background
Las indicaciones del color se pueden definir de diferentes maneras. Las mas utilizada es, sin duda, la notacin hexadecimal de pares de valores (#FF9933)
Se definen tambien por valores RGB(red,green,blue), representa todos los colores como combinaciones de rojo, verde y azul claro; por ejemplo rgb(75.5%,32.75%,24.25%) o rgb(0.1,0,0.1).
Por otro lado, existen 17 palabras clave para indicar el color, basadas en los colores VGA originales de Windows.
Es un software que brinda una amplia paleta de colores donde obtendrs tambin el codigo hexadecimal de color elegido . Adems con la herramienta Screen Piker (selector de pantalla), podrs obtener el cdigo hexadecimal de un color que elijas en la pantalla.
Noshade Width
Size
Quita el sombreado predeterminado de la regla. Permite especificar el ancho de la regla (en pixeles o porcentaje). Permite especificar el alto de la regla (en pixeles).
Etiqueta <center></center>
Se utiliza para ubicar ya sea una imagen o texto de forma centrada
Etiqueta <a> <a/> Para colocar un enlace, nos serviremos de las etiquetas <a> y </a>. Dentro de la etiqueta de apertura deberemos especificar asimismo el destino del enlace. Este destino ser introducido bajo forma de atributo, el cual lleva por nombre href.
<a href="destino">contenido</a>
destino: se trata de una pgina, un correo electrnico o un archivo. contenido: puede tratarse de un texto o una imagen.
En funcin del destino los enlaces son clsicamente agrupados del siguiente modo: I. Enlaces internos: los que se dirigen a otras partes dentro de la misma pgina. II. Enlaces locales: los que se dirigen a otras pginas del mismo sitio web. III. Enlaces remotos: los dirigidos hacia pginas de otros sitios web. IV. Enlaces con direcciones de correo: para crear un mensaje de correo dirigido a una direccin. V. Enlaces con archivos: para que los usuarios puedan hacer descarga de ficheros.
Enlaces Internos:
Son los enlaces que apuntan a un lugar diferente dentro de la misma pgina.
<a href=#destino">contenido</a>
#destino: a travs del smbolo # se especifica al navegador que el enlace apunta a una seccin en particular. contenido: puede tratarse de un texto o una imagen.
<a href=mailto:dir@mail.com">contenido</a>
Para colocar un enlace dirigido hacia una direccin de correo colocamos mailto: en el atributo href del enlace, seguido de la direccin de correo a la que se debe dirigir el enlace.
mailto: Permite a los usuarios hacer clic en un vnculo de un sitio web para enviar un e-mail sin tener que copiar el destino de e-mail y abrir un cliente de correo electrnico
As como podemos insertar texto en un documento HTML, tambin podemos insertar grficos (imgenes), los cuales van a ser visualizados dentro de la pgina. Los formatos que soporta son: *.gif y *.jpg o *.jpeg. Las imgenes no deben ser de tamao grande porque el navegador tardara en cargarla
Esta etiqueta instruye al navegador para que exhiba la imagen especificada. El formato bsico para incluir una imagen es:
<img src=imagen.jpg/>
Descripcin Ruta de la imagen a mostrar Redimensiona el ancho de la imagen (en pixeles o porcentaje). Redimensiona el largo de la imagen (en pixeles o porcentaje).