Stanmx

Buscando la accesibilidad

Las 5 etiquetas que mas uso en XHTML

Publicado en xhtml el 17/06/09 a las 08:43 am

Utilizo más de cinco, sin embargo hablar de estas es un buen comienzo para lo que sigue, por lo tanto aquí están las 5 etiquetas que más uso en XHTML.

<div>

La etiqueta div, tiene una etiqueta que abre <div>. u otra que cierra </div> es una etiqueta de bloque, que nos permite ordenar contenido dentro de ella. Y me atrevo a decir que es la etiqueta favorita de los estándares, pues le vino a dar killer a la mal usada <table>. Su sintaxis es:

<div>
   otras etiquetas...
</div>

<p>

La etiqueta párrafo, tiene una etiqueta que abre <p> y otra que cierra </p> sirve para hacer párrafos, suena obvio pero por increíble que parezca, muchos sitios no la usan. Su sintaxis es:

<p>Aquí va mi párrafo</p>

<a>

La etiqueta de hipervínculo o de link, tiene una etiqueta que abre <a> y otra que cierra </a>. Dentro de la que abre <a> carga un elemento obligatorio href, así como otros elementos que la complementan. Su sintaxis es:

<a title=”Link al index” href=”index.html”>Link al index</a>

<img />

La etiqueta para llamar una imagen, es una sola etiqueta, la cual carga un elemento obligatorio en su interior src, así como otros elementos que la complementan. Su sintaxis es:

<img alt=”la imagen de un ave” src=”ave.jpg” />

<h1>

Las etiquetas de titulo, tiene una etiqueta que abre <h1> y otra que cierra </h1> así como tiene varios niveles h1, h2, h3, etc. Siendo h1 la ideal para utilizar en el titulo de un sitio, y es recomendable que solo exista una h1 por documento, y saber utilizar el resto para darle un nivel jerárquico a los títulos de cada documento. Por desgracia esta práctica poco común y muchas veces nos encontramos con sitios que no utilizan el <h1> para el titulo de su documento. La sintaxis es:

<h1>Este es mi título</h1>

Ahora bien, si hacemos un licuado con estas 5 etiquetas, tendríamos algo así:

<div>
   <h1>Mi primer div</h1>
   <p>Este es mi primer div, sacado de <a title=”Stanmx.com” href=”http://www.stanmx.com/”>Stanmx.com</a></p>
   <p>En la parte inferior pueden ver la imagen de un perfect, ja!:</p>
   <img alt=”perfect” src=”http://www.stanmx.com/photos/pablasso.jpg” />
</div>

En un próximo post, veremos la estructura básica de un documento XHTML.

8 comentarios

Victor De la Rocha

dijo el 17/06/09 a las 11:57 am

Orale, se pone bueno esto! :)

Stan

dijo el 17/06/09 a las 02:15 pm

@Victor, esperate a leer el de mas tarde, trae bonus!

Arath

dijo el 17/06/09 a las 08:17 pm

Basics para la maquetacion de paginas Web, interesante...

Lucas Varela

dijo el 17/06/09 a las 08:21 pm

El "" es muy fundamental para ordenar cualquier contenido, otras de las cuales comence a usar mucho y que se puede ver en mi diseño es el "" otras sobre las etiquetas de titulo llego a usar hasta "" para darle otras funciones.

Lucas Varela

dijo el 17/06/09 a las 08:22 pm

Sorry no se visualizaron las etiquetas :S

Lucas Varela

dijo el 17/06/09 a las 08:26 pm

Me refiero a los DIV, SPAN usar etiqueta hasta H4

Arath

dijo el 17/06/09 a las 08:34 pm

Hace como 3 posts preguntabas que era lo que nos gustaría leer en tu blog o algunas sugerencias para el mismo. Y creo que esto es algo de lo que comentabamos, eso demuestra el interés por tus lectores, felicidades...
Espero que haya más de estos posts técnicos para Paginas Web y vayan aumentando de nivel gradualmente...

Saludos Stan!

Stan

dijo el 18/06/09 a las 10:28 am

@Arath asi es, la forma que me funciono a mi para aprender a maquetar fue por las etiquetas comunes, y de ahi fui utilizando poco a poco cada vez mas. Gracias por los comentarios y espero poder llevar adelante esta serie de post, hice algunos ajustes en mi diseño para mostrar las etiquetas de CODE y PRE.

@Lucas Saludos man, si el DIV, SPAN y H4 son el pan de cada dia.

Aporta tu comentario

Tu Email no sera publicado.

Opcional.