“#num” link=“#num” vlink=“#num” alink=“#num”> Ahora veremos como poner una imagen de fondo. Es muy sencillo, basta con usar la etiqueta: background=“localización de la imagen” Esta etiqueta va dentro de la etiqueta <body>. Ejemplo: <body background=“/documentos/html/gifs/dragonball.gif”>
Con esto lograremos que la imagen dragonball.gif aparezca como fondo en nuestra pagina. Etiquetas META Son usadas para poner meta-información del documento. Esta “directiva” indica al visor de Internet las palabras clave y contenido de nuestra página Web. Muchos de los buscadores de páginas Web de Internet (Yahoo, Lycos, etc…) utilizan el contenido de esta directiva para incluir la página en sus bases de datos.
Ejemplo: <META NAME = “Pagina de Pablo” content = “Mi pagina personal de Sailor Moon”> Indica al visor el nombre de la página y sus contenidos principales. <META NAME=“Author” content=“Pablo Ravioli”>
Indica el nombre de la persona que elabora la pagina WEB <META NAME = “keywords” content = “Información de Sailor Moon”>
Indica al visor las palabras clave para los buscadores de Internet. Para hacer listas: Las listas se definen de forma muy sencilla: se dice dónde empieza la lista, dónde empieza cada punto y dónde acaba la lista. Las etiquetas que se utilicen en cada caso deben aparecer al principio de línea, o al menos sin texto por delante (sólo espacios o tabulaciones).
Las listas pueden ser: Lista desordenada, <UL> (Unordered List). Lista ordenada, <OL> (Ordered List). Ejemplos de diferentes tipos de listas:
Lista con números romanos: <ol> <li type=I>Manzana <li type=I>Zanahoria <li type=I>Lechuga <li type=I>Tomate </ol> Manzana Zanahoria Lechuga Tomate
Lista numerada: <ol> <li>Manzana <li>Zanahoria <li>Lechuga <li>Tomate </ol> Manzana Zanahoria Lechuga Tomate
Lista con puntos:
<ul> <li> Manzana <li> Zanahoria <li> Lechuga <li>Tomate </ul> Manzana Zanahoria Lechuga Tomate
Lista con círculos: <ul> <li type=circle> Manzana <li type=circle> Zanahoria <li type=circle> Lechuga <li type=circle> Tomate </ul> Manzana Zanahoria Lechuga Tomate
Lista con cuadrados: <ul>
<li type=square> Manzana <li type=square> Zanahoria <li type=square> Lechuga <li type=square> Tomate </ul> Manzana Zanahoria Lechuga Tomate
6. Como insertar una imagen
A la hora de crear una página Web podemos introducir gráficos de forma muy sencilla, sólo hay que tener en cuenta que las imágenes deben tener formato Gif o JPEG. La etiqueta utilizada para agregar imágenes a una página Web es <IMG> y va acompañada de un atributo fundamental “SCR”, que indica la ruta donde se encuentra el archivo que contiene la imagen a insertar. Es decir: <IMG SRC=“lugar donde guardo la imagen”> Supongamos que tenemos la imagen dragonball.gif, que está presente en el mismo directorio en donde está la página y que la queremos insertar. La etiqueta apropiada sería: <IMG SRC=“dragonball.gif”>
Y el usuario verá en el browser:
Para poner la imagen en la izquierda escribir: <IMG ALIGN=LEFT SRC=“ dragonball.gif “> A la derecha: <IMG ALIGN=RIGHT SRC=“ dragonball.gif”> Y si se quiere poner la imagen en el centro: <P ALIGN=CENTER> <IMG SRC=“ dragonball.gif”> </P>
Hiperenlaces, Hyperlinks, Anclas o Links Para definir un enlace es necesario marcar con la etiqueta <a> el objeto del cual va a partir dicho enlace. Dicha directiva debe incluir el parámetro href=“URL” para especificar el destino del enlace. Es decir, que antes del objeto elegido debemos abrir con <a href=“URL”>, y después cerrar con </a>. Por ejemplo, si queremos que el texto “pulse aquí para visitar la NASA” nos conduzca a la “home page” de la NASA, debemos escribir en nuestro texto HTML: <a href=“http://www.nasa.gov/”>Pulse aquí para visitar a la NASA</a>
Que se vería de esta forma: Pulse aquí para visitar a la NASA Si queremos que el texto “Foto” nos lleve a una imagen tenemos que escribir: <a href=“imagen.gif”>Foto</a> entonces al hacer clic en el texto Foto nos abrirá la imagen.gif.
También se puede ir a otro enlace por medio de una imagen. Lo único que se debe hacer es cambiar el texto por una imagen: <a href=“http://www.altavista.com”><img src=“Logo.jpg”></a> Con esto tendremos por resultado que cuando se pase el puntero del mouse por arriba del Logo.jpg (que podría ser el logo del Altavista) y se convierta en una “manito”, al hacer clic nos envíe al buscador Altavista. Si se quiere hacer un link para que nos manden un E-Mail se debe hacer de la siguiente manera: <a href=“pfravioli@fibertel.com.ar”>Mandame un Email</a> Entonces cuando se haga clic sobre esta palabra Mandame un Email se abrirá (por defecto) el Microsoft Outlook Express con la dirección del destinatario ya escrita.
Caracteres especiales Existe una razón evidente que impide que podamos escribir ciertos símbolos directamente en un texto HTML, como por ejemplo el <: dichos símbolos tienen un significado en HTML, y es necesario diferenciar claramente cuándo poseen ese significado y cuándo queremos que aparezcan literalmente en el documento final. Por ejemplo, como ya sabemos, < indica el comienzo de una directiva, y, por ello, si queremos que aparezca en el texto como tal tendremos que dar un rodeo escribiendo algo que no de lugar a confusión, en este caso <. Los símbolos afectados por esta limitación, y la forma de escribirlos, se detallan a continuación:
< (Menor que): < >(Mayor que): > & (símbolo de and, o ampersand): & “ (comillas dobles): " Es decir, que para escribir <”hola”> en nuestro texto HTML original debemos poner <"hola">. El otro caso especial se da cuando en un texto HTML se quiere escribir una eñe, por ejemplo. Existe una forma fácil de hacerlo, que consiste en utilizar códigos como las que antes se presentaron para escribir ciertos símbolos. Los códigos comienzan siempre con el símbolo &, y terminan con un punto y coma (;). Entre medias va un identificador del carácter que queremos que se escriba. Los códigos necesarias en nuestro idioma son:
á: á é: é í: í ó: ó ú: ú Á: Á É: É Í: Í Ó: Ó Ú: Ú ü: ü Ü: Ü ñ: ñ Ñ: Ñ ¿: ¿ ¡: ¡ ?: ?
: !
@: @ Por lo tanto la palabra página la podríamos escribir como : página página Otro ejemplo: ¿En qué año estamos? Sería: ¿En qué año estamos? Es por ello que si deseamos que cualquier visor de páginas Web pueda visualizar las letras acentuadas de nuestro documento debemos utilizar sus correspondientes códigos para representarlas. Recuerden que las etiquetas se pueden escribir en mayúsculas o en minúsculas, es lo mismo poner <HTML>, <html> o <Htm L?>. Una vez que terminamos de escribir todo nuestro documento, lo guardamos poniéndole un nombre, y necesariamente lo debemos guardar con la extensión .HTM o .HTML. Para ir visualizando lo que hemos estado haciendo tendríamos que abrir nuestro browser (Netscape o Internet Explorer), hacemos click en la opción FILE o ARCHIVO, estando allí seleccionamos OPEN o ABRIR, le damos BROWSE o EXAMINAR, seleccionamos el archivo y le damos OPEN. Luego le damos ACEPTAR, e inmediatamente se abrirá nuestra pagina.
7. Conclusión
Sin HTML no existiría el Internet que hoy conocemos, si no se hubiera inventado, seguiríamos con el aburrido FTP (Protocolo de Transferencia de Ficheros) mandándonos o bajando archivos que a veces ni sabíamos lo que eran, sin tener la posibilidad de visualizarlo antes. Ahora por medio de una página llena de colores y botones por la cual se puede navegar, se puede tener acceso a bastante información y archivos. El lenguaje de HTML abrió una puerta al mundo permitiéndole a las personas expresar sus ideas por medio de páginas y mostrárselas a todas las personas de todos los países.
Con el HTML se logró un gran movimiento económico ya que muchísimas empresas publican, venden, y ofrecen sus productos, sus servicios y sus ofertas atrayendo a mayor cantidad de personas. También gracias al HTML nacieron muchas empresas que ofrecen diversos servicios como Yahoo, Altavista, Hot Mail?, Terra, Yupi, Mercadolibre, De Remate, etc. Infinitas son las posibilidades que te brindan las páginas WEB ya que no solo te dan la posibilidad de pasar el tiempo navegando, sino que también hasta se puede comprar un auto por Internet, solo basta con llenar un formulario con los datos personales y el número de tarjeta de crédito y en ocho días lo tenemos en nuestra casa. Todo el universo de Internet se lo debemos al HTML, ya que todas las páginas con las que se compone la World Wide Web están hechas con el lenguaje de programación HTML.
hecho por Diana Santillan y Mauricio Velazquez http://www.monografias.com/trabajos7/html/html.shtml
¿Qué es HTML?
HTML es un lenguaje de programación sencillo pensado para presentar información en la red. HTML (Hyper Text Markup Lenguaje), como su nombre indica es un lenguaje de marcas para la creación de hipertextos.
Por hipertexto entenderemos texto con una presentación agradable, con inclusión de elementos multimedia (gráficos, vídeo, audio) y con la presencia de hiperenlaces que permiten relacionar otras fuentes de información en documentos hipertextos. En definitiva es el lenguaje mayoritariamente empleado para presentar documentos en la WWW (World Wide Web).
Como se ha dicho es un lenguaje de marcas ya que en él las instrucciones son trozos de textos resaltados convenientemente que definirán la estructura lógica del documento. Por tanto un documento HTML constará de texto, que será: el contenido y la información del documento y de instrucciones HTML que resaltarán este contenido y le darán un formato fácil y agradable de leer y con la posibilidad de relacionar documentos y fuentes de información mediante hiperenlaces.
El lenguaje HTML actualmente está estandarizado en su versión 3.0, aunque ya se ha desarrollado la versión 4.0, pero todavía no la reconocen todos los navegadores. En este estándar se definen las etiquetas básicas y las estructuras de datos que forman el lenguaje. En este manual explicaremos todas las estructuras definidas en la especificación 3.0 añadiendo las extensiones incluidas por Netscape en sus versiones 2.0. y en adelante. La unión de ambos constituye la especificación del lenguaje HTML más extendida en la actualidad.
Las Etiquetas
El lenguaje HTML es un lenguaje de marcas, estas marcas serán fragmentos de texto destacado de una forma especial que permiten la definición de las distintas instrucciones de HTML, tanto los efectos a aplicar sobre el texto como las distintas estructuras del lenguaje. A estas marcas las denominaremos etiquetas y serán la base principal del lenguaje HTML. En documento HTML será un fichero texto con etiquetas que variarán la forma de su presentación.
Una etiqueta será un texto incluido entre los símbolos menor que < y mayor que >.. El texto incluido dentro de los símbolos será explicativo de la utilidad de la etiqueta. Por ejemplo:
<B> Letra Negrita, del inglés Bold (negrita). <TABLE> Definirá una tabla. <IMG> Inclusión de una I Ma Gen?.
Existe normalmente una etiqueta de inicio y otra de fin, la de fin contendrá el mismo texto que la de inicio añadiéndole al principio una barra inclinada /. El efecto que define la etiqueta tendrá validez para todo lo que este incluido entre las etiquetas de inicio y fin, ya sea texto plano u otras etiquetas HTML.
<ETIQUETA>Elementos Afectados por la Etiqueta</ETIQUETA>
Por ejemplo, con la etiqueta siguiente:
<B>Texto que será en negrita</B>.
Obtendremos:
Texto que será en negrita
Algunas etiquetas no necesitarán la de fin, serán aquellas en las que el final este implícito, por ejemplo <P> párrafo, <BR> salto de línea ó <IMG> inclusión de una imagen. Definen un efecto que se producirá en un punto determinado sin afectar a otros elementos.
El uso de mayúsculas o minúsculas en las etiquetas es indiferente, se interpretarán del mismo modo en ambos casos, pero lo normal es expresarlas en mayúsculas para que destaquen con más nitidez del texto normal.
Atributos de las Etiquetas
Las etiquetas pueden presentar modificadores que llamaremos atributos que permitirán definir diferentes posibilidades de la instrucción HTML. Estos atributos se definirán en la etiqueta de inicio y consistirán normalmente en el nombre del atributo y el valor que toman separados por un signo de igual. El orden en que se incluyan los atributos es indiferente, no afectando al resultado. Si se incluye varias veces el mismo atributo con distintos valores el resultado obtenido será imprevisible dependiendo de cómo lo interprete el navegador. Cuando el valor que toma el atributo tiene más de una palabra deberá expresarse entre comillas, en otro caso no será necesario.
Un ejemplo de atributo será:
<A HREF=“http://www.unav.es”>Página principal de la unav</A>
En este caso la etiqueta A presenta un atributo HREF cuyo valor es http://www.unav.es.
Igualmente una etiqueta podría presentar varios atributos:
<HR ALIGN=LEFT NOSHADE SIZE=5 WIDTH=50%>
En este caso la etiqueta HR presenta cuatro atributos. El segundo atributo NOSHADE es un caso especial que no presenta valor. El orden en que se especifiquen los atributos no afectarán al resultado final.
Etiquetas incorrectas
Todo texto que se encuentre entre los caracteres < y > se considerará una etiqueta, si la etiqueta no fuera una de las válidas del lenguaje HTML no será tenida en cuenta, sin causar ningún tipo de error, dejándose el texto o las etiquetas a las que afectaba como si no existiera la etiqueta extraña. Cuando se comete un error sintáctico al expresar una etiqueta o un atributo no se produce ningún error, simplemente no se obtendrá el efecto que deseábamos.
El lenguaje HTML es un lenguaje que evoluciona muy rápidamente y cada nueva versión de los programas navegadores presenta etiquetas nuevas que causan efectos más espectaculares o atributos nuevos de las etiquetas ya existentes. Esto causa que los programas más antiguos no entiendan estas nuevas etiquetas y por tanto las consideren erróneas y no realicen la acción que deseábamos. Dándose el caso de atributos que son válidos sólo para un único navegador.
Cuando creamos código HTML hay que hacerlo lo más estándar posible para permitir que el documento pueda ser visto de forma efectiva por distintos navegadores en máquinas distintas. Por tanto debemos renunciar a efectos espectaculares que sólo tienen validez en un navegador e intentar comprobar cómo se ve el documento en varios navegadores, ya que las personas que se conecten a nuestras páginas no tendrán en la mayoría de los casos el mismo que nosotros. También es interesante saber cómo se vería el documento en los distintos tamaños de la ventana del navegador, teniendo en cuenta que no todos tienen un monitor con la misma resolución.
En este manual se han tratado de incluir las características más estándar de HTML, y en caso de tratarse de instrucciones más particulares se indicará convenientemente.
http://www.unav.es/cti/curso-html/intro.html#incorrectas
Cont. y resumido por KIN-KIN
Las primeras cosas que debes saber sobre HTML: historia, objetivos
HTML es el lenguaje con el que se escriben las páginas web. Las páginas web pueden ser vistas por el usuario mediante un tipo de aplicación llamada navegador. Podemos decir por lo tanto que el HTML es el lenguaje usado por los navegadores para mostrar las páginas webs al usuario, siendo hoy en día la interface más extendida en la red.
Este lenguaje nos permite aglutinar textos, sonidos e imágenes y combinarlos a nuestro gusto. Además, y es aquí donde reside su ventaja con respecto a libros o revistas, el HTML nos permite la introducción de referencias a otras páginas por medio de los enlaces hipertexto.
El HTML se creó en un principio con objetivos divulgativos. No se pensó que la web llegara a ser un área de ocio con carácter multimedia, de modo que, el HTML se creó sin dar respuesta a todos los posibles usos que se le iba a dar y a todos los colectivos de gente que lo utilizarían en un futuro. Sin embargo, pese a esta deficiente planificación, si que se han ido incorporando modificaciones con el tiempo, estos son los estándares del HTML. Numerosos estándares se han presentado ya. El HTML 4.01 es el último estándar a septiembre de 2001.
Esta evolución tan anárquica del HTML ha supuesto toda una seria de inconvenientes y deficiencias que han debido ser superados con la introducción de otras tecnologías accesorias capaces de organizar, optimizar y automatizar el funcionamiento de las webs. Ejemplos que pueden sonaros son las CSS, Java Script u otros. Veremos más adelante en qué consisten algunas de ellas.
Otros de los problemás que han acompañado al HTML es la diversidad de navegadores presentes en el mercado los cuales no son capaces de interpretar un mismo código de una manera unificada. Esto obliga al webmáster a, una vez creada su página, comprobar que esta puede ser leída satisfactoriamente por todos los navegadores, o al menos, los más utilizados.
Además del navegador necesario para ver los resultados de nuestro trabajo, necesitamos evidentemente otra herramienta capaz de crear la página en si. Un archivo HTML (una página) no es más que un texto. Es por ello que para programar en HTML necesitamos un editor de textos.
Es recomendable usar el Bloc de notas que viene con windows, u otro editor de textos sencillo. Hay que tener cuidado con algunos editores más complejos como Wordpad o Microsoft Word, pues colocan su propio código especial al guardar las páginas y HTML es únicamente texto plano, con lo que podremos tener problemas.
Existen otro tipo de editores específicos para la creación de páginas web los cuales ofrecen muchas facilidades que nos permiten aumentar nuestra productividad. No obstante, es aconsejable en un principio utilizar una herramienta lo más sencilla posible para poder prestar la máxima atención a nuestro código y familiarizarnos lo antes posible con él. Siempre tendremos tiempo más delante de pasarnos a editores más versátiles con la consiguiente ganancia de tiempo.
Es importante tener claro todo ello puesto que en función de vuestros objetivos puede que, más que aprender HTML, resulte más interesante aprender el uso de una aplicación para la creación de páginas.
Así pues, una página es un archivo donde está contenido el código HTML en forma de texto. Estos archivos tienen extensión .html o .htm (es indiferente cuál utilizar). De modo que cuando programemos en HTML lo haremos con un editor de textos y guardaremos nuestros trabajos con extensión .html, por ejemplo mipágina.html
Descripción de la sintaxis con la que se trabaja en el lenguaje HTML.
El HTML es un lenguaje que basa su sintaxis en un elemento de base al que llamamos etiqueta. La etiqueta presenta frecuentemente dos partes:
Una apertura de forma general <etiqueta> Un cierre de tipo </ etiqueta>
Todo lo incluido en el interior de esa etiqueta sufrirá las modificaciones que caracterizan a esta etiqueta. Así por ejemplo:
Las etiquetas <b> y </b> definen un texto en negrita. Si en nuestro documento HTML escribimos una frase con el siguiente código:
<b>Esto esta en negrita</b>
El resultado Será:
Esto esta en negrita
Las etiquetas <p> y </p> definen un párrafo. Si en nuestro documento HTML escribiéramos:
<p>Hola, estamos en el párrafo 1</p> <p>Ahora hemos cambiado de párrafo</p>
El resultado sería:
Hola, estamos en el párrafo 1
Ahora hemos cambiado de párrafo
Partes de un documento HTML
Además de todo esto, un documento HTML ha de estar delimitado por la etiqueta <html> y </html>. Dentro de este documento, podemos asimismo distinguir dos partes principales:
El encabezado, delimitado por <head> y </head> donde colocaremos etiquetas de índole informativo como por ejemplo el titulo de nuestra página.
El cuerpo, flanqueado por las etiquetas <body> y </body>, que será donde colocaremos nuestro texto e imágenes delimitados a su vez por otras etiquetas como las que hemos visto.
El resultado es un documento con la siguiente estructura:
<html>
<head> Etiquetas y contenidos del encabezado Datos que no aparecen en nuestra página pero que son importantes para catalogarla: Titulo, palabras clave,… </head>
<body> Etiquetas y contenidos del cuerpo Parte del documento que será mostrada por el navegador: Texto e imágenes </body>
</html>
Las mayúsculas o minúsculas son indiferentes al escribir etiquetas
A notar que las etiquetas pueden ser escritas con cualquier tipo de combinación de mayúsculas y minúsculas. <html>, <HTML> o <Ht Ml?> son la misma etiqueta. Resulta sin embargo aconsejable acostumbrarse a escribirlas en minúscula ya que otras tecnologías que pueden convivir con nuestro HTML (XML por ejemplo) no son tan permisivas y nunca viene mal coger buenas costumbres desde el principio para evitar fallos triviales en un futuro.
SITIO WEB RECOMENDADO www.programacionfacil.com
