html

Lenguaje de marcado (html)Lenguaje de marcado (html)

Html significa hypertext markup language al español lenguaje de marcado de hipertexto se usa principalmente en el diseño de paginas webSe podria decir que es un lenguaje interpretado ya que nuestros navegadores web examinan cada etiqueta dentro del codigo fuente y luego lo combierten en la representacion grafica de este.

historia

En 1989 existían dos técnicas que permitían vincular documentos electrónicos, por un lado los hipervínculos (links) y por otro lado un poderoso lenguaje de etiquetas denominado SGML. Por entonces, Tim Berners-Lee da a conocer a la prensa que estaba trabajando en un sistema que permitirá acceder a ficheros en línea, funcionando sobre redes de computadoras o máquinas electrónicas basadas en el protocolo TCP/IP.

historia

A principios de 1990, Tim Berners-Lee define por fin el HTML como un subconjunto del conocido SGML y crea algo más valioso aún, el World Wide Web. En 1991, Tim Berners-Lee crea el primer navegador web, que funcionaría en modo texto y sobre un sistema operativo UNIX.

historia

Los trabajos para crear un sucesor del HTML, denominado HTML +, comenzaron a finales de 1993. HTML+ se diseñó originalmente para ser un superconjunto del HTML que permitiera evolucionar gradualmente desde el formato HTML anterior. A la primera especificación formal de HTML+ se le dio, por lo tanto, el número de versión 2 para distinguirla de las propuestas no oficiales previas. Los trabajos sobre HTML+ continuaron, pero nunca se convirtió en un estándar, a pesar de ser la base formalmente más parecida al aspecto compositivo de las especificaciones actuales.

Como funciona

Cada elemento de html se coloca entre signos de < y > para abrirlo y para cerrarse con </ elemento >

los atributos son los valores que el elemento va a tomas seguido de una variable que es la que toma el atributo la sintaxis de esto seria la siguiente :

<elemento atributo=”variable”>contenido</elemento>

Nota: es importante usar comillas despues de cada atributo para eliminar apegarnos a los estandares de la w3c

Como funciona

Códigos HTML básicos

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

esto indica que version de html estamos usando


<html> </html>

Estas son las etiquetas con las que se debe comenzar cualquier archivo de codigo html e indican presisamente eso que es un archivo que contiene codigo en html.


<head> </head>

La etiqueta head (cabecera) nos probee de un bloque en el cual podremos agregar algunas otras etiquetas que nos permitiran extender la capacidad de nuestro lenguaje o agregar funciones tales como cambiar el titulo de la pagina o agregar un tema


<title> </title>

Esta etiqueta nos permite cambiar el texto que aparece en la barra de titulo de nuestro navegador web

ejemplo:

<title>Mi primer Pagina en html</title>


<body> </body>

La etiqueta body como su nombre lo indica es donde iran todas las etiquetas que constituiran nuestra pagina web.

Ejemplo:

<html>

<head><title>Mi primer pagina</title></head>

<body>FUNCIONA!!!!!!!!</body>

</html>Esta web mostrara el mensaje funciona y tendra como titulo mi primer pagina


<h1> </h1>

Los encabezados o titulos de parrafo se escriben entre etiquetas <h#> siendo # un posible numero del 1 al 6:

Ejemplo:

<body>

<h1>TITULO</h1>

funciona!!!!

</body>

</html>


<table> </table>

Esta etiqueta permite crear tablas junto con otras dos etiquetas que son <tr> y <td>.

<tr> nos permite incrustar una fila

<td>nos permite incrustar una columna

dentro de <td> existen otros dos atributos llamados colspan y rowspan que nos permiten unir una o mas celdas

rowspan para unir filas y colspan para unir columnas


<a> </a>

hypervinculos o links en html se incrustan de esta manera

<a href=”ruta”>texto</a>

existen enlases o links internos tambien llamados anclas que sirven para desplazarse dentro de la pagina internamente.

<a name=”aqui”>aqui se situara</a>

<a href=”#aqui”>ve a aqui</a>es importante usar el signo # para indicar que es un enlase interno de otro modo no

funcionara


<img>

la etiqueta <img> permite incrustar una imagen con sus atributos src que tomara como valor la ruta ,width para controla el ancho y heigth para controlar el alto:

ejemplo

<img src=”imagen.jpg” width=”100” height=”250”>

es recomendable usar imagenes pequeñas o en formatos que no pesen tanto como jpg o png


Existen dos tipos de lista las ordenadas <ol> que apareceran con numeros y las no ordenadas<ul> que apareceran con viñeras.

Para <ol> y <ul> existe una misma etiqueta para agregar elementos y esa es <li>.

●1●2●3●4

1)A2)B3)C4)D


<p> </p>

los parrafos en html se incrustan con la etiqueta <p>

ejemplo:

<p>

Devus rekta oid ke, et aŭ poŭpo espereble. Pro et devi elnombrado, fo oho meta gibi antaŭeniri. If pero sori negativa ian, da kaŭ eksteren dek, os naŭ lasta des. Turpa senigi malprofitanto sia um, gv ekoo iliard pli, kuzo vidalvide substantivo kz end. Oni se aligi intere kapabl, mili jesa oid nu.

</p>


Estilos de fuente:

negritas

<b>Texto en negritas</b>

Italica

<i>Texto en italica</i>

Subrayado

<u>Texto Subrayado</u>

Tachado

<s>Texto Tachado</s>


Debemos recordar que html no fue creado pensando en el idioma ingles asi que muchos caracters como la “Ñ” no existen y solo mostraria un ? Dentro de nuestra web pero existen dos maneras de que estos aparescan una es utilizando la tabla de caracteres especiales de html y la segunda es declarando la colasion de caracteres de nuestra pagina .


La segunda manera es usando una meta etiqueta que aparece a continuacion:

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

cambia colasion de caracteres de pagina

Español : iso-8859-1

el recomendado por se casi universal seria= utf-8

por que no solo detecta caractes como la ñ si no que tanmbien caractes asiaticos comoらき☆すた

HTML5 !!!

Actualmente aun en desarrollo el estandar que sustituira al html actual ,este incorpora mejoras tales como una etiqueta especial para incrustar audio y una para video dejando obsoleto a los reproductores flash.

Pero al encontrarse aun en desarrollo el programar codigo html en esta version del lenguaje haria que nuestras paginas no se muestren adecuadamente en todos los navegadores.

Otro de los problemas que tiene es que aun no se decide que estandar de multimedia usara lo cual afectara a todos los navegadores si se escoge h.264 o ogg

html5

<audio src=”miaudio.ogg”>tu navegador no soporta html5</audio>

<video src=”mivideo.ogv”>tu navegador no soporta html5</video>

Adios D:

html

Documents