PILARES DEL DISEÑO WEB

WEB Y MULTIMEDIA
UNIDAD II
PILARES DEL DISEÑO WEB
JOHANNA TORRES
4to CICLO
DISEÑO GRÁFICO Y MULTIMEDIA
OBJETIVO
Descubre algunos de los principios fundamentales pre
vios para la realización de una página web mediante
las tendencias y elementos que debe conocer todo
diseñador.

EL HEADER
El header (encabezado) es la parte superior de la página.
Generalmente está formado por una serie de elementos comunes: logo
de la empresa, nombre, una imagen o imágenes representativas y, en
algunos casos, datos de contacto como teléfono e email.
EL CONTENT
El content o también conocida como área de contenido
esdonde se presenta todos los contenidos de la página
web.
BASES DEL DISEÑO
WEB
La palabra diseño web está relacionado con una
parte de la página web, el front-end, determina la
apariencia y la percepción de un sitio web.
Comprende el diseño, la navegación, la gama de
colores,la estética y la experiencia del usuario.
EL FOOTER
El footer es la parte inferior de una estructura web en la que
generalmente se incluyen links de navegación, enlaces de
interés, copyright o botones a las redes sociales del sitio.

TENDENCIAS DEL DISEÑO WEB
CINEMAGRAPHS
Un Cinemagraph es una fotografía con un elemento móvil, grande o pequeño en proporción, con el resto de la imagen está
paralizada tal como una foto.
FULL SREAN VIDEOS
Esta técnica permite que el usuario de tu web se desplace horizontalmente en ella y los contenidos se vayan mostran
do de una forma animada.
DEGRADADOS CON VARIOS COLORES
Hace referencia a degradar con varios colores determinados fondos o elementos en un sitio web.
Al igual que las animaciones, no se recomienda sobrecargar los diseños con degradados, pero que al usarlos de
manera correcta, aportan un toque muy vistoso y creativo.
DISEÑO TIPOGRÁFICO
Las tipografías realizadas a mano le brindan al diseño web una personalidad única, por lo general este tipo de tipo_
grafía es usada para el diseño de logotipos y en zonas que se quieran realizar del sitio web, como cabeceras o titu
lares.
DISEÑOS MINIMALISTAS
Este tipo de diseños destacan por el predominio de fondos blancos o muy claros, un único color para las tipografías y
diseño con pocos elementos, pues se trata de emplear los elementos de diseño estrictamente necesarios para focali
zar en el objetivo que persigue el sitio web.

RESPONSIVE WEB DESING.
•El diseño web responsive o adaptativo es una técnica de diseño web que busca la correcta visualización de una
misma página en distintos dispositivos. Desde ordenadores de escritorio a tablets y móviles.
•Permite reducir el tiempo de desarrollo, evita los contenidos duplicados, y aumenta la viralidad de los contenidos
ya que permite compartirlos de una forma mucho más rápida y natural.
•Trata de redimensionar y colocar los elementos de la web de forma que se adapten al ancho de cada dispositivo
permitiendo una correcta visualización y una mejor experiencia de usuario.

SITEMAP DE UNA PÁGINA WEB O SITIO WEB
•El sitemap o mapa del sitio es un mapa de tu sitio web, en forma de
archivo el cual los webmasters pueden usar para nombrar individual_
mente las páginas de tu sitio web.
•Un mapa del sitio debe ser utilizado para decirles a los motores de
búsqueda, como Google y Bing, qué páginas de un sitio web que deben
pasar.
•El responsive design corresponde a una tendencia de creación de
páginas web que pueden ser visualizadas perfectamente en todo tipo
de dispositivos, desde ordenadores de escritorio hasta smartphones o
tablets.

BIBLIOGRAFÍA
http://www.amebacomunicacion.com/cual-es-la-diferencia-entre-diseno-web-y-desarrollo-web/
https://arpentechnologies.com/es/blog/diseno-y-programacion-web/bases-del-diseno-web/
http://www.superdweb.com.ar/preguntas-frecuentes/item/649-diseno-web-ique-es-el-header.html
https://www.40defiebre.com/que-es/footer/
https://3lentes.com/cinemagraph-que-es-y-como-se-hace/
https://madridnyc.es/tendencias-diseno-web-2018/
https://www.maxcf.es/tendencias-diseno-web-2018/
https://www.40defiebre.com/que-es/diseno-responsive/
http://www.maestrosdelweb.com/que-es-responsive-web-design/