Buenas prácticas con HTML 5
Enviado por polin9090 • 11 de Mayo de 2014 • Exámen • 819 Palabras (4 Páginas) • 170 Visitas
Buenas prácticas con HTML 5
<!DOCTYPE html>
<html> Ahora lo correcto es poner la etiqueta “lang” para describir el lenguaje de nuestra página, quedando así <html lang=”es”> la sigla “es” corresponde al idioma español.
<head >
Es necesario colocar aquí la etiqueta “meta” con el tipo de codificación para el lenguaje correspondiente, en este caso es así <meta charset="UTF-8">
<title> MI SEGUNDA APLICACION </title>
<link rel='stylesheet' href='ejercicio2.css' />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
Esta línea ya no va y se sustituye arriba como te declaré bien la etiqueta “meta”.
NOTA: Cuando declaramos los linkeos y los scripts del “head” es conveniente poner primero los elementos CSS, comenzando por el “normalize.css” que es el que nos normaliza que todos los elementos tengan la misma proporción de tamaño para los navegadores, posteriormente poner los CSS que le dan estilo a nuestro sitio y por ultimo será agregar los scripts de JavaScript o de jQuery que utilizará nuestra web app según sea el caso.
</head>
<body>
<div >
<header id="logo">
<img src="Ejercicio2/logo.png" alt="TUTO">
</header>
</div>
<!--inicio del menu -->
<div id="menu">
<nav>
<ul class="men" id="nav">
<li class="seleccionar"><a href="ejercicio2.html">Inicio</a></li>
<li><a href="#">Tutoriales</a></li>
<li><a href="#">Recursos</a></li>
<li><a href="#">Contacto</a></li>
</ul>
</nav>
</div>
• No se recomienda utilizar un “div” que contenga la etiqueta “header” si el navegador por si solo ya interpreta esa etiqueta como el elemento que irá en la parte superior de la página.
• Como buenas prácticas las etiquetas que denoten elementos de tipo “img” deberán ser incluidas dentro de etiquetas “figure” Ej.
<figure>
<img src="Imagen.jpg" alt="Imagen">
</figure>
• Recordar nuestro “Mockup”(Imagen llamada “Principal.jpg”) y visualizar que el menú esta dentro de nuestro <<header>>, por lo tanto la etiqueta “nav” deberá estar contenida en la etiqueta “header” y no afuera con otro “div”, ya que nos será más fácil manipular el menú por medio del CSS.
• No es practico nombrar un “id” que tenga el mismo nombre semántico que una etiqueta, como lo haces con el <<id=”nav”>> y la etiqueta “nav” mismas que puse en color rojo en el código de arriba.
<!-- espcio para las imagenes -->
<div class="contenido">
Recordar que la etiqueta “div” no ha muerto, pero no por ello debemos abusar de ella, ya que en el nuevo paradigma de html 5 existen nuevas etiquetas tales son el caso de “<section>” y “<article>”, pero te preguntaras, ¿Cuándo utilizar “section” y cuando “article”?
Bueno, muy fácil, “section” como su nombre lo dice (sección) lo estaremos utilizando cuando hagamos una o varias secciones dentro de nuestra página que hagan referencia a contenidos diferentes, y “article” será empleado principalmente cuando demos a denotar un articulo, como el uso de textos.
No obstante, las etiquetas antes mencionadas pueden incluir cualquier otra etiqueta ya sea una etiqueta de la misma semántica u otra diferente como un “figure” o “div”
Para
...