Si bien es sabido que en estos últimos años la palabra HTML5 es bastante famosa entre los diseñadores web y programadores, dado que HTML5 ofrece gran funcionalidad ala hora de hacer paginas web mas agradables ala vista en conjunto con CSS3, como podrán darse una idea, combinar este lenguaje de con otras tecnologías como los son CSS3, PHP, JAVASCRIPT, se pueden lograr paginas muy amistosas al usuario, aunque en la actualidad existen muchas herramientas para darle el toque que quieras y la funcionalidad deseada a tu web, por ejemplo PHPmailer una librería gratuita de php para enviar correos, en función a que te des cuenta cuando alguien se registre en tu sitio web o simplemente hacer E-mailing (envió de correo masivo para promocionar tu sitio), como podrán ver las posibilidades son ilimitadas y en lo personal como programador prefiero mejor hacer todo desde el código y no utilizar sitios web que se generan de forma rápida. como lo son wordpress y jomla por mencionar algunos, no digo que estos sean mala idea, pero en la experiencia que tengo, cuando una empresa quiere hacer su pagina web y promocionarse la mejor opción es hacer la pagina desde cero.
por eso la importancia de ir conociendo las bases de como funcionan las paginas web y que lenguajes se pueden utilizar para crear la pagina web acorde a tus necesidades. vamos a darle un vistazo a lo que es la estructura básica de una pagina echa en HTML5 como se muestra en la siguiente imagen.
en la imagen anterior se pueden observar lo que son las etiquetas básicas, para definir un documento HTML5 solo es necesario delarar al principio del documento con la etiqueta <!DOCTYPE html> como se muestra en el siguiente codigo:
ejemplo HTML 4 Transicional
Doctype en HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
|
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8" />
<title>Estructura basica de una pagina web en HTML5</title>
</head>
<body>
<header>
<nav>
<a href="inicio.html">Inicio</a>
<a href="nosotros.html">Nosotros</a>
<a href="opcion.html">Opcion</a>
<a href="opcion.html">Opcion</a>
</nav>
</header>
<aside>
<p>el contenido de aside es algo que no tiene gran relevancia ena pagina, como un submenu, buscador, formulario de contacto etc...</p>
</aside>
<section>
<p>un section es una manera de dividir la pagina por "secciones" de tal modo que podemos dividir el contenido de esta por temas</p>
<article>
<h1>El article es la parte mas importante del sitio</h1>
<p>Basicamente en el article pondremos lo mas importante de la pagina, la informacion jerarquicamente mas importante, un article puede tener header y footer, sin estropear el SEO.</p>
</article>
</section>
<footer>
<p>Derechos reservados</p>
<p>Contactenos en info@tucorreo.com</p>
</footer>
</body>
</html>
|
0 comentarios:
Publicar un comentario