[6] Como crear tu pagina web HTML5/CSS3 desde cero - El pie de página
Publicaciones relacionadas:
- [1] Como crear tu pagina web HTML5/CSS3 desde cero - La estructuración
- [2] Como crear tu pagina web HTML5/CSS3 desde cero - La cabecera
- [3] Como crear tu pagina web HTML5/CSS3 desde cero - El menú
- [4] Como crear tu pagina web HTML5/CSS3 desde cero - El contenido
- [5] Como crear tu pagina web HTML5/CSS3 desde cero - La barra lateral
Ya estamos casi finalizando la serie de tutoriales sobre como crear tu propia pagina web HTML5 y CSS3 de una manera muy sencilla, y llegamos al sexto y penúltimo tutorial; el pie de pagina, ultimo pero elemento no menos importante, pues puede ser muy útil si usas tu creatividad, el pie de pagina de una sitio web no debe ir muy recargado, solo debe contener información complementaria de dicho sitio, el usuario que visita un portal sabe que para obtener información sobre tu sitio como derechos de autor, incluso redes sociales o quien administra la pagina, se dirige hasta el pie de pagina sin rodeos, es por esto; que debemos mantener el estándar y no salirnos de los parámetros pues puede ser bastante incomodo para quien visualiza.
Añade el siguiente código entre las etiquetas <footer>...</footer> de tu pagina web
<a href="#">Friki Bloggeo</a> © Copyright 2014. Diseño y edición por <a href="#">Anthony Medina</a>
Y se debe visualizar de este modo
Simple, sencillo y al grano, no muestra mas que un mensaje de derechos de autor, y creador, autor del blog o pagina web, sin embargo, no tiene que ser asi, muchas personas le agregan el logotipo, quizás, secciones del menu que no pueden mostrar el menu principal, enlaces a redes sociales, todo eso queda a gusto de cada quien.
Añade los siguientes estilos CSS
body footer a {
text-decoration:none;
color:#CCC;
transition:all ease-out .2s;
}
body footer a:hover {
text-decoration:underline;
color:#EEE;
}
Y debe quedar de este modo
Un cambio sencillo, nada especial. Como comenté en el tutorial anterior, en el próximo y ultimo tutorial estaré dejando un link de descarga de un archivo comprimido que contendrá el código fuente de esta pagina que hemos estado haciendo y ademas, los recursos usados como las imágenes.
Siguiente parte: Extras y mejoras
Enlaces para compartir en tu blog o pagina web.
muy buena explicacion
ResponderEliminarsaludos
dante
https://www.palbin.com/es/aff/dantewebs.html