CURSO PRACTICO DE HTML
Antes de comenzar, es importante declarar el tipo de documento que vamos hacer, en este caso, vamos a darle <!DOCTYPE html>
Para saber mas de este importante documendo. http://htmlhelp.org/tools/validator/doctype.html
Esto permitirá que el navegador lee el documento html.
• HTML
Comenzemos. Todas las páginas web escriba en html su lenguaje de programación, siempre tendran la estructura y el comienzo de <html> .. </html> las 2 formas aceptable de que una página este escrita en html es html o tambien htm con su extención.
<html> Contenido de la página </html> || Tipo de documento escrito en la página.
Formación:
Código: <html>
....
</html>
• HEAD
El head se suele utilizar mucho al momento de agregarle un estilo a la página, por lo general se usa mucho en css, javascript, y etiquetas. Es la parte del titulo por encima de la página.
<head> Contenido head dentro de html </head> || Contenido que llevará los estilos y accesorios de la página.
Formación:
Código: <html>
<head>
.......
</head>
.........
</html>
=> LAS ETIQUETAS DENTRO DEL HEAD
=> ETIQUETA META.
Las etiquetas meta son para darle información a la página.
Esta etiqueta es muy util para los webmasters porque cumple la función de aparecer en los buscadores con sus respectivas palabras claves de rastreos.
<meta> Información || la informaciónes que le podemos agregar a la etiqueta es del autor y contenido.
Las informaciónes requeriras son, nombre del autor/creador + la descripción de la página + las palabras claves que se agregarán en los buscadores.
author || Nombre.
description || Descripción de la página.
keywords || Palabras claves.
Código: <meta name="author" content="Master Nemesis">
<meta name="description" content="Página de ayuda y tutoriales">
<meta name="keywords" content="Master nemesis master-nemesis">
En la palabras claves del contenido keywords puse master nemesis, ¿para que sirve poner textos cortos?
En mi caso, si en el buscador de google pones master nemesis seguramente aparecerá las páginas que añadidas de estas etiquetas <meta>
=> ETIQUETA TITLE.
La etiqueta titulo le podemos agregar un titulo a la página, este titulo que pondremos, se verá en la ventana del navegador.
<title> Titulo </title> || Titulo de la página.
Formación.
Código: <title>
Titulo
</title>
=> ETIQUETA LINK
En muchos casos, la etiqueta link permite agregar un documento link de un favicon o mediando una web movil para celulares.
Celulares moviles.
Código: <link rel="alternate" media="only screen and (max-width: 640px)" href="http://m.pagina.com/" >
Favicon.
Código: <link rel="shortcut icon" href="imagen.ico" type="image/vnd.microsoft.icon" />
• BODY.
Desde el fondo comenzará la estructura del diseño.
En body es el fondo, y en el fondo le podemos dar unos estilos de color, fuente de letras, etc..
en Html.
Código: <body background="Fondo.jpg">
en Css.
Código: body {código css}
En código css podemos agregar estos valores, font + color + etc..
Hay 2 modelos de diseño de estructura, estan las estructuras que se realizan con div y otras que son a base de tablas.
NOTA: DENTRO DEL BODY, YA COMENZARÁ EL ARMADO DEL DISEÑO DE LA PÁGINA!!
=> http://www.paginawebgratis.es/forum/viewtopic.php?t=71634
HTML ESTRUCTURA FINAL
La estructura final de una página html correcta.
Código: <!DOCTYPE html>
<html>
<head>
<meta>
<link>
<title>...</title>
</head>
<body>
....
<script>Javascript<script>
<style>css</style>
<div>Diseño en div</div>
<table>Diseño en tablas</table>
....
</body>
</html> ______________  |
