TUTORIAL MAYDIS HTML. HOLA MUNDO
14
CURSO DE HTML MAYDIS www.maydis.es https://www.facebook.com/maydisweb @maydisweb HOLA MUNDO
-
Upload
silvya-arroyo -
Category
Education
-
view
172 -
download
4
description
Primer Tutorial Maydis de HTML.
Transcript of TUTORIAL MAYDIS HTML. HOLA MUNDO
CURSO DE HTML
MAYDIS
www.maydis.es
https://www.facebook.com/maydisweb
@maydisweb
HOLA MUNDO
INTRODUCCION
• ¿Qué significa HTML?– HyperText Markup Language («lenguaje de
marcas de hipertexto»).– HTML es un texto escrito con una sintaxis
particular que el navegador es capaz de leer y aplicar
HERRAMIENTAS
• Es el lenguaje que se utiliza para hacer las paginas web
• Las paginas web se pueden hacer a través de 2 herramientas:
– Programas como Adobe Dreamweaber– Editores de texto como Notepad ++: Lo vamos
a utilizar en este tutorial.
ELEMENTOS DEL LENGUAJE
• El lenguaje HTML consta de etiquetas como <img>, atributos como <id> y elementos anteriores como <center>.
• En los siguientes tutoriales las iremos explicando hasta lograr nuestra pagina web.
EMPEZAMOS
• Para crear una pagina web es muy sencillo.
• Solo hay que tener en cuenta que:– La pagina web consta de 2 partes:
• <head>• <body>
<!DOCTYPE>
• Nada mas abrir nuestro editor de texto, lo primero que vamos a poner es lo siguiente:
– <!DOCTYPE html>– ¿Qué significa esto?
• Con esto le estamos indicando a nuestro navegador que interprete el lenguaje HTML, para que nosotros podamos visualizar correctamente nuestra futura pagina web.
<HTML>
• A continuación empezamos poniendo la etiqueta <html>, que indica el comienzo de nuestra pagina web.
• No debemos olvidar en cerrar esta etiqueta de esta forma </html>
• Todo lo que haya dentro de estas etiquetas sera nuestra pagina web.
<HEAD>
• A continuación dentro de <html> ponemos la etiqueta <head>, que significa cabeza.
• Todo lo que ponemos dentro de esta etiqueta es invisible para los usuarios que ven nuestra pagina web, pero no para nuestro código fuente.
• No se nos tiene que olvidar el cerrar la etiqueta </head>
<HEAD>
• Dentro de esta etiqueta pondremos los siguientes elementos:– <title></title>: Este es el texto que sale en la
pestaña de nuestro navegador– Metadatos: Estos datos solo son necesarios
para hacer estrategias SEO
<BODY>
• Significa cuerpo.
• Aquí pondremos todo lo que es visible en nuestra pagina web.
• No se debe olvidar el cerrarla: </body>
HOLA MUNDO
• Para que el texto “Hola Mundo” se vea en nuestra pagina web, vamos a utilizar la etiqueta de parrafo: <p>
• Esta etiqueta le dice al navegador que escriba la frase que pongamos dentro de esta etiqueta.
• No hay que olvidarse de cerrarla: </p>
• Mira el ejemplo:
NUESTRO CODIGO FUENTEAsí quedaría todo nuestro código fuente escrito en nuestro editor de texto
AHORA GUARDA ESE CODIGO FUENTE CON EL SIGUIENTE PROCEDIMIENTO:Pinchamos en Lenguaje y seleccionamos H, y a continuación HTMLGuardamos el documento en: Archivo-Guardar Como, y le pones el nombre quierasUna vez guardado, ejecutas en el ordenador el documento guardado y mira el resultadoYa tienes tu primera pagina web!!!Sencillo no…!!!
No olvides mirar el siguiente tutorial: Como poner una imagen
HASTA LA PROXIMA!!
www.maydis.es
