Post on 06-Jul-2015
Pagina web con Doctype Primero abrimos NOTEPAD ++
Estando en el notepad++ colocamos en el encabezado <! DOCTYPE>
Debemos seguir con la estructura de HTML explicaremos para que sirven algunos
codigos del lenguaje HTML como lo son:
HEAD:es el titulo de la pestaña en el navegador
BODY: es el div agrupa una serie de elementos que van a ser cambiados por el
maqueteador CSS
P: para poner el texto en la imagen
HEADER: Esta es una etiqueta de HTML
NAV:empleamos un menu para navegar empleando el tag nav
UL: Es un lista no ordenada en el menu
ASIDE:este es para los bloques de la izquierda a la derecha se emplea el tag aside
FOOTER:Este se utiliza para crear el pie de pagina
Empleando los tags anteriores la pagina nos queda de esta manera
<!DOCTYPE
>
<html>
<!----RECUERDE QUE ESTE ES EL TAG PARA COMENTATRIOS----
>
<HEAD>
<!----es el titulo de la pestaña que va a salir en el navegador--->
<title>pagina en html</title>
</HEAD>
<body>
<!--el div agrupa una serie de elememtos que van a ser cambiados por el
maqueteadorcss --->
<div div="todo">
<header>
<h1>ESTRUCTURA DE UNA PAGINA EN HTML 5</h1>
<p>aqui aprendemos a realizar una esctructura para paginas </p>
<!--colocamos un menu para poder navegar empleando el tagnav --->
<nav>
<ul>
<!--lista no ordenada de nuestro menu--->
<li><a href="">INICIO </a></li>
<li><a href="">CONSOLA </a></li>
<li><a href="">INFORMATICA </a></li>
<li><a href="">TELEFONIA </a></li>
</ul>
</nav>
<!--PARA LOS BLOQUES TANTO DE LA DERECHA COMO LA
IZQUIERDA SE EMPLEA EL TAG ASIDE--->
<aside id="izquierda">
<p>este es un parrafo que colocaremos en la parte izquierda de nuestra
web</p>
</aside>
<aside id="DERECHA">
<p>este es un parrafo que colocaremos en la parte derecha de nuestra
web</p>
</aside>
<!---los tiutlos principales se ubican con un tagllamdosection--->
<section>
<article>
<h1>ARTICULO UNO</h1>
<p>este es un parrafo que pertenece al articulo uno</p>
</article>
<article>
<h1>ARTICULO DOS</h1>
<p>este es un parrafo que pertenece al articulo dos</p>
</article>
<article>
<h1>ARTICULO TRES</h1>
<p>este es un parrafo que pertenece al articulo tres</p>
</article>
<article>
<h1>ARTICULO CUATRO</h1>
<p>este es un parrafo que pertenece al articulo cuatro</p>
</article>
</section>
<!---EL PIE DE PAGINA SE ESCRIBE CON EL TAG FOOTER----->
<footer>
<p>aqui colocaremos nuestro pie de pagina</p>
</footer>
</header>
</div>
</body>
</html>
Al ejecutar el anterior codigo la pagina queda de esta manera