3- Etiquetas Básicas

Etiquetas Básicas

Headings

Nos definen el tamaño de un título o cabecera.

<h1> nos dá el tipo de letra más grande.
<h6> nos dá el tipo de letra más pequeño.
HTML agrega automaticamente un espacio antes y después de cada título.

<h1> al ser usado como título de una página Web, es de suma importancia ya que es uno de los parámetros que Google y demás buscadores tiene en cuenta, a la hora de indexar un sitio web.

Ejemplo

http://www.solvetic.com/tutoriales/article/176-aprendiendo-html-etiquetas-basicas/

Párrafos

Los párrafos se definen con la etiqueta <p>.

Comentarios

La etiqueta  se utiliza para insertar un comentario dentro del código que estamos escribiendo. El mismo es ignorado por el navegador al momento de leerlo. Los comentarios nos sirven para explicar mejor el código y son de gran ayuda en el momento que necesitemos editarlo.

* Nota que el signo de exclamación se coloca solo al principio del código.

http://harphymurx.com/curso-basico-html-sublime-text-2-etiquetas-basicas/

Trazar una línea

La etiqueta <hr> nos permite trazar una línea horizontal como las que separan las distintas secciones de este tutorial.
La etiqueta <hr> no tiene cierre.

2- Elementos y etiquetas

Los elementos

Los elementos son declaraciones para dar forma a una página Web.

Las etiquetas

Las etiquetas o tags son marcas insertadas en un documento HTML para proporcionar información sobre un conten

Reglas básicas

Las etiquetas están encerradas entre los signos "<" y ">".
Generalmente vienen en pares <p> y <⁄p>.
La primera es de apertura y la segunda de cierre.
El texto que se encuentra entre dos etiquetas es el contenido del elemento.
Las etiquetas no son sensibles a las mayúsculas y minúsculas, o sea <b> es lo mismo que <B>.

Etiquetas de HTML
Veamos un ejemplo.

<html>
<head>
<title>Una página Web</title>
</head>
<body>
Hola a todos. <b>Este texto es en negrita</b>
</body>
</html>

Esta es una etiqueta HTML:

<b>Este texto es en negrita.</b>

El elemento HTML comienza con la etiqueta de apertura <b>(etiqueta que nos muestra el texto en negrita).
El contenido de dicho elemento es: Este texto es en negrita.
El fin del elemento HTML es con la etiqueta de cierre </b>.

Más información aquí

1- Introducción

¿Qué es HTML?

HTML (HyperText Markup Language) o "Lenguaje para Marcado de Hipertexto".

HTML es el lenguaje que te permite describir y dar forma a tús páginas Web.

Publica tus propias páginas con fotos, listas, tablas, etc.

Obtén información de los visitantes de tu sitio.

Diseña los formularios que te permitirán contactar tus futuros clientes.

Crea un sitio para vender tús productos

Incluye video clips, música, sonidos, y otras aplicaciones para tú página Web

¿Qué conocimientos previos debes poseer?

Para estudiar HTML no se requiere de conocimientos previos en programación.
Es muy simple aprenderlo ya que es un lenguaje de marcas.

Los archivos HTML

Los archivos HTML deben tener una extensión htm o html (ej. misitio.htm o misitio.html).

Para crear un archivo HTML solo hace falta un editor de texto.

Un archivo HTML está compuesto por etiquetas.Las etiquetas le dicen al navegador web como mostrar la página Web.

Empezar a hacer el sitio

Si estás usando Windows, abre el "Block de Notas".

Si usas Mac, abre "Simpletext".

Por ejemplo:

Código

<html>
<head>
<title>Mi primera página Web</title>
</head>

<body>
Hola a todos.
</body>
</html>

Resultado:

Hola a todos.

Guarda el archivo como "pagina1.html" (las extensiones ".htm" o ".html" tienen el mismo significado y nos indican que se trata de un archivo de página web HTML).
Haz doble click sobre el archivo creado y te llevará directamente a la página creada.

Explicación:

<html> --> Indica al navegador que abre un archivo HTML.
<head> --> Apertura de la cabecera del documento. Sección que no se muestra en la pantalla.
<title>Mi primera página Web</title> --> Título de la página.
</head> --> Cierre de la cabecera del documento.
<body> --> Apertura del cuerpo del documento. Esta sección aparece en la pantalla.
Hola a todos. --> Texto que va a ser mostrado por el navegador.
</body> --> Cierre del cuerpo del documento.
</html> --> Cierre del archivo HTML

HtmlporMiquel

viernes, 30 de enero de 2015