• Recuerda unirte a IlustraIdeas Community, nuestro grupo en Facebook, visitando este link.
  • En nuestro grupo podras encontrar y preguntar todo acerca del mundo del diseño y desarrollo.

¿Quieres crear una web? Te explicamos HTML5

Francis AntonyPublicado hace 3 años

Te explicamos las nociones básicas que deberías saber de HTML5 para comenzar a crear tu sitio web.

En este articulo haré una pequeña introducción donde explicaré algunas nociones básicas que debes saber y tener en cuenta para que puedas crear una web, no me liaré tanto detallando cada parte pero si lo trataré de explicar de manera que si estas iniciando puedas entenderlo, también debes saber que aprender HTML puede tomar algo de tiempo por lo que debes tener paciencia.

¿Qué es HTML?

HTML (HyperText Markup Language – Lenguaje de marcas de hipertexto) es el lenguaje con el que se hacen las páginas web. Básicamente se trata de un conjunto de códigos que sirven para hacer la estructura básica y contenido de una página web, como texto, imágenes, entre otros.

Sin embargo debemos entender que HTML por si solo no sera capaz de mostrarnos sitios web tan agradables a la vista como actualmente podemos verlos, para ello se hará uso de otros lenguajes, pero quizás la mas importante que debas aprender inicialmente sea CSS.

¿Qué es CSS?

CSS (Cascading Style Sheets – Hojas de estilo en cascada) es un lenguaje que nos permite dar una mejor presentación a nuestro sitio web, pudiendo hacer muchas cosas que no se podía hacer utilizando solamente HTML, como incluir márgenes, tipos de letra, fondos, colores y más.

HTML5 y CSS3

HTML5 Y CSS3 son las ultimas versiones que han salido de ambos lenguajes, los cuales han traído consigo grandes mejoras , como es el caso en HTML5, la posibilidad de reproducción de audio y video sin la necesidad de otras herramientas, animaciones y más. Y de parte de CSS3 la gran cantidad de efectos como bordes redondeados, sombras, animaciones y más.

HTML5+CSS3

Una vez comprendido algunos conceptos básicos iremos conociendo un poco sobre HTML5, para ello debes tener claro que si quieres iniciar, tendrás que hacer uso de algún programa que nos permita usar HTML, CSS y otros lenguajes. Dentro de los más conocidos tenemos Adobe Dreamweaver, que podría ser un apropiado programa si estas iniciando, ya cuando tengas más practica se puede hacer uso de otros como Sublime Text o Notepad++, que se encuentran dentro de los preferidos por muchos programadores.

Estructura básica de una web en HTML5

<!DOCTYPE html>
<html lang="es">
<head>
   <meta charset="UTF-8">
   <title>Título de la Página</title>
</head>
<body>
   Contenido de la Página	
</body>
</html>
  • LÍNEA 1: Inicialmente tenemos el DOCTYPE, que viene a ser una declaración estándar que toda página en HTML5 debe llevar.
  • LÍNEA 2-10: Luego tenemos la etiqueta HTML donde indicamos el inicio de la estructura de nuestra web así como el final en la línea 10.
  • LÍNEA 3-6: En esta línea tenemos la etiqueta HEAD donde iremos colocando todas las herramientas que iremos usando en nuestra página, como podría ser CSS.
  • LÍNEA 4: Dentro de HEAD también apreciamos una linea de código que inician con la etiqueta META, donde estamos indicando que en nuestra página podemos usar toda clase de caracteres como las tildes.
  • LÍNEA 5: Además tenemos dentro también la etiqueta TITLE donde indicaremos el titulo de nuestra página.
  • LÍNEA 7-9: Y ya por último tenemos la etiqueta BODY donde vamos a colocar todas las lineas de códigos que podrán mostrarse de nuestra página.

HTML5 incluye una gran cantidad de etiquetas para usarlas de diferentes formas en la estructura de nuestra web, es por ello que dejaré esta imagen donde podrán encontrar una gran lista de todas las etiquetas más usadas en HTML5, además nos explica un poco todos los atributos que podremos agregar a cada etiqueta.

HTML
Da clic en la imagen para poder verlo más grande
“Imagen extraída de Woork”

Ahora que ya hemos visto una pequeña introducción, también debemos saber que detrás de HTML se encuentra una gran organización, es quien establece los estándares de la programación web, nos referimos a la W3C.

¿Qué es W3C?

W3C (World Wide Web Consortium) es una organización internacional donde los estados miembros trabajan para poder desarrollar estándares para el desarrollo web y así ayudar a una mejor evolución del internet a nivel mundial.
W3C es reconocido a nivel mundial por ser la organización encargada de estandarizar el lenguaje de Marcas de Hipertexto o como mejor lo conocemos HTML.

w3c

Podrás encontrar mayor información de la W3C en su sitio web: www.w3.org.

Quizás una de las cosas más importantes que nos ofrece la W3C es poder validar nuestro sitio web, así asegurarnos de que hemos usado correctamente HTML. Esto lo podrán hacer mediante este enlace con tan solo colocar la URL de tu sitio web: validator.w3.org.

Esto nos ayudará a cumplir los estándares que nos da la W3C y la vez resulta muy importante para el buen posicionamiento en buscadores de tu sitio web. Sin embargo debes saber que no siempre podrás validar tu web en su totalidad, pero si darte cuenta de pequeños errores que pudieras cometer. Esto resulta muy irónico ya que si te das cuenta ni el buscador mas famoso del mundo ha logrado validar en su totalidad su sitio web, por lo que no debe causar en ti una preocupación el no poder validarlo completamente.

Espero que todo lo tratado en este articulo haya podido ayudarte, recuerda tener paciencia y posiblemente con mucha práctica podrás tener un mejor manejo de HTML5.

¿Te gustó este artículo? ¡Vota y ayúdanos a mejorar!

PobreRegularEstá bienMuy buenoExcelente (2 votos, promedio: 4,00 de 5)
Cargando…
Francis Antony on FacebookFrancis Antony on Twitter
Francis Antony
Francis Antony
Soy estudiante de Ingeniería Informática, alguien enamorado de las nuevas tecnologías y en especial de Android, también soy un amante de la programación web y diseño. Además soy un adicto al cine y las buenas series. Si tienes alguna duda puedes contactarme.
Compartir:

Desarrollo

¿Algo que decir? !Deja tu comentario!

  • Alejandro Lopez

    Muy buen articulo :3