Tutorial: Aprender HTML5 de forma eficiente (4ta parte)
En la 3ra parte hicimos el marco de una página, utilizando etiquetas de HTML5, usamos etiquetas como <header> <div> <nav> <section> <article> <aside> y <footer> en esta parte de este tutorial para aprender HTML5, vamos hoy a aprender las etiquetas más comunes para colocar hipertexto en las páginas web, ya tenemos nuestra estructura asi que vamos a empezar a rellenarla.
Para las personas que conocen ya HTML4 esta parte no es tan importante ya que estas etiquetas no han sufrido grandes cambios, sin embargo si quieres refrescar conocimientos o colaborar con algún consejo o alguna etiqueta que olvide, pueden hacerlo en los comentarios.
a, abbr, acronym, address, applet, area, b, base, basefont, bdo, big, blockquote, body, br, button, caption, center, cite, code, col, colgroup, dd, del, dfn, dir, div, dl, dt, em, fieldset, font, form, frame, frameset, h1, h2, h3, h4, h5, h6, head, hr, html, i, iframe, img, input, ins, isindex, kbd, label, legend, li, link, map, menu, meta, noframes, noscript, object, ol, optgroup, option, p, param, pre, q, s, samp, script, select, small, span, strike, strong, style, sub, sup, table, tbody, td, textarea, tfoot, th, thead, title, tr, tt, u, ul, var.
Esta etiqueta es utilizada para colocar enlaces a otras paginas o secciones, contiene un atributo llamado “href” en donde se coloca la dirección url y se usa de esta manera:
<a href=”www.ejemplo.com”> Pagina de Ejemplo </a>
br
Se utiliza para hacer un salto de línea, aunque también podemos hacer estos saltos utilizando css, siempre es bueno saber la forma de hacerlo solo usando HTML y solo es necesario colocar </br> donde lo necesitemos
Caption
Se utiliza para colocar la leyenda o titulo de una tabla y en las especificaciones dice que se debe colocar inmediatamente de la etiqueta <table>
H1, H2, H3, H4, H5 y H6
Son usadas para colocar títulos, visualmente solo pareciera afectar el tamaño de la letra, pero es importante saber utilizarlos para tener una estructura correcta en nuestra página web, el <h1> debe utilizarse para el titulo principal de la pagina, el <h2> para subtítulos y así sucesivamente, por ejemplo:
Img
La etiqueta <img> es utilizada para subir imágenes a nuestra página web, su atributo principal es “src” que es el sitio donde está alojada nuestra imagen, sin embargo les aconsejo utilizar también los atributos “alt” y “title” ya que con ellos le daremos un titulo y una descripción corta de la imagen que estamos utilizando
ol, ul y li
Esta etiqueta está diseñada para crear listas dentro de las páginas web, con <ol> creamos una lista ordenada, o sea que nos aparecerá marcara con (1,2,3,4,……) mientras que con <ul> creamos una lista desordenada, es decir que nos coloca solo una marca a la izquierda mas no la enumera. Y con el elemento <li> creamos los distintos elementos de la lista, Ejemplo:
<ul>
<li>Inicio</li>
<li>Acerca</li>
<li>Blog</li>
<li>Contáctanos</li>
</ul>
Table, tr, td, th, thead, tbody
Es utilizado para crear tablas con <table> el <thead> es para la cabecera de la tabla <th> es para los elementos de esa cabecera, <tbody> es el cuerpo de la tabla, es decir dónde van los datos. Con <tr> hacemos una fila y con <td> hacemos columnas.
En esta parte no me adentrare tanto en el uso de tablas, lo importante es comprender los demás elementos para introducir datos en nuestra página web, en la siguiente parte de este tutorial les explicare como hacer formularios, las cajas de texto, botones, checkbox y todos los elementos que componen un formulario.
Como siempre si tienes alguna duda o te gustaría que explicara más a fondo alguno de los elementos escríbeme en en los comentarios y con gusto lo hare.
0 comentarios: