Html Basico en Español

HTML BÁSICO EN ESPAÑOL
PARTE I
Según estándares W3

Ileana Echandi W.
ileana@seoemporio.com

¿QUÉ ES HTML?
• HTML es un lenguaje para describir las páginas web.
• Las siglas HTML son por »Hyper Text Markup Language»
• HTML no es un lenguaje de programación en sí, es un lenguaje de marcado (incorpora
marcas que contienen información)
• HTML usa las etiquetas de marcado para descrbir las páginas web
• Los documentos HTML describen páginas web
• Los documentos HTML contienen etiquetas HTML y archivos de texto plano
• En resumen: Documento HTML = página web

ETIQUETAS HTML

• Las etiquetas de marcado HTML son usualmente llamadas etiquetas HTML (HTML Tags)
• Las etiquetas HTML son palabras escritas entre paréntesis angulares
<html>
• Normalmente vienen en pares : <html> </html>
• La primera etiqueta es “la etiqueta de comienzo”, la segunda es la “etiqueta de fin”
• En inglés son llamadas “start tag u opening tag” y “end tag o closing tag”
• No siempre vienen en pares. Ej. La etiqueta utilizada para crear una línea entre párrafo y
párrafo: <hr />. Se coloca el / después de las letras, para indicar que ahí comienza y
termina.

*No olvide colocar las etiquetas de cierre cuando sean pares.

ELEMENTOS Y ATRIBUTOS DE HTML
• Un elemento HTML es todo desde el comienzo de una etiqueta hasta la etiqueta de
cierre.
Ej. <a href="http://www.facebook.com">Facebook</a>
Todo esto un elemento

• Atributos
1. Estos proveen información adicional acerca del elemento
2. Siempre se especifican en la etiqueta de comienzo
3. Vienen en formato de nombre/valor…. nombre="valor"
Ej. <a href="http://www.facebook.com">Facebook</a>

*Procure escribir los elementos y atributos en minúscula. Los valores de los atributos van entre doble comilla
“….”

EJEMPLO

<html>  Describe la página web
<body>  Describe el contenido visible de la página

<h1>Encabezado principal va aquí</h1>

<p>Párrafo va aquí</p>

</body>  Aquí termina el contenido visible de la página
</html>  Aquí termina el documento HTML

*El propósito de un navegador de internet (Explorer, Firefox…) es leer los documentos HTML y desplegarlos como una
página web. Las etiquetas no son visibles, si desea verlas vaya a un sitio web y presione el botón derecho del mouse,
seleccione “ver código fuente”.

EMPIECE A CREAR SU PÁGINA WEB
Pasos sencillos para comenzar una página

1. Vaya a Accesorios y abra su Bloc de notas
2. Copie las siguientes etiquetas y péguelas en
el bloc:
<html>
<body>
<h1>escriba aquí el título que deseé</h1>
<p>escriba aquí el párrafo que quiera</p>
</body>
</html>

3. Guarde el archivo en su escritorio con el nombre que guste, pero al final escriba «. html»
4. Abajo donde dice «tipo» seleccione la opción de todos los archivos
5. En su escritorio debería de aparecerle el documento, el cual al hacerle clic abrirá como una página web.

FELICIDADES!
En este momento usted de seguro ha podido crear su primera prueba en la web. Ya cumplió
con los principios más básicos como lo son el encabezado y el párrafo. Por favor ponga
atención a las siguientes notas:
• Una página puede tener varios encabezados
<h1>Aquí va el encabezado principal de su sitio</h1>
<h2>Segundo encabezado</h2>
<h3>Tercer encabezado</h3>
…

• También puede escribir cuantos párrafos deseé, estos no van numerados. Tan sólo
escriba <p>párrafo</p> <p>Aquí su segundo párrafo</p>… Y así sucesivamente.

ETIQUETAS QUE DEBERÍA DE SABER
Para crear una página web, usted necesitará aprender a escribir y reconocer otras etiquetas.
A continuación le explicaré una por una las demás etiquetas básicas para la creación de un
documento HTML.

HTML HIPERVÍNCULO
<a href="url aquí">aquí va el texto que se despliega en vez del url</a>
Ej.
Código HTML: <a href="http://www.google.com/">Google</a>
Resultado visible en el sitio: Google
*Al igual que un hipervínculo en Word, estos pueden redireccionar a una página web, o a un sitio dentro del
mismo documento (en este caso dentro del mismo sitio web).

___________________________________________________________________________

Variantes
Abrir el link en una nueva página:
<a href="http://www.youtube.com" target="_blank">YouTube</a>

*Cada símbolo como /, debe de ser respeto tal y como se muestra en el primer ejemplo

IMÁGENES HTML
<img src=“flor.gif" alt=“rosa roja" width=“40" height=“45" />

etiqueta nombre de la ancho y altura de la imagen
imagen
atributo Texto que aparece en caso de que la imagen no se despliegue

Usar una imágen como link (puede usar una de su escritorio para efectos del ejercicio):
<a href="default.asp"><img src=“flor.gif" alt=“rosa roja" width=“40" height=“45" /></a>

Html Basico en Español

Recomendados

Recomendados

Más contenido relacionado

La actualidad más candente

La actualidad más candente (20)

Destacado

Destacado (20)

Similar a Html Basico en Español

Similar a Html Basico en Español (20)

Último

Último (20)

Html Basico en Español