Scribd
Cargar
21 vistas2 páginas

Tipos de Imagen A Utilizar en El Diseño de Una Paguina Web

El documento describe técnicas para hacer que las páginas web se vean bien en diferentes dispositivos como ordenadores, tablets y teléfonos móviles. Esto incluye usar diseño responsive donde los elementos se adaptan al ancho del dispositivo y usar la misma imagen en varios tamaños para que el navegador elija la mejor opción. También recomienda usar imágenes vectoriales como SVG para logos e imágenes simples y JPG para fotografías.

Cargado por

Juan José Perez Sarabia
Derechos de autor
© © All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd
21 vistas2 páginas

Tipos de Imagen A Utilizar en El Diseño de Una Paguina Web

El documento describe técnicas para hacer que las páginas web se vean bien en diferentes dispositivos como ordenadores, tablets y teléfonos móviles. Esto incluye usar diseño responsive donde los elementos se adaptan al ancho del dispositivo y usar la misma imagen en varios tamaños para que el navegador elija la mejor opción. También recomienda usar imágenes vectoriales como SVG para logos e imágenes simples y JPG para fotografías.

Cargado por

Juan José Perez Sarabia
Derechos de autor
© © All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd
Está en la página 1/ 2

CBTis 69

TIPOS DE IMAGEN A UTILIZAR EN EL


DISEÑO DE UNA PÁGINA WEB

Materia: Gestiona Inf. A traves de plat. Digitales

Docente: Ing. Eusebio Bueno Martinez

Alumno: Juan José Perez Sarabia

Grupo y grado: 6°A


Página web Responsive

Diseño Responsive

Es una técnica de diseño web que busca


la correcta visualización de una misma
página en distintos dispositivos. Desde
Consiste en
ordenadores de escritorio a tablets y
móviles.

Redimensionar y colocar los elementos de la


web de forma que se adapten al ancho de
cada dispositivo permitiendo una correcta
Hacer imágenes responsive visualización y una mejor experiencia de
usuario. Se caracteriza porque los layouts
(contenidos) e imágenes son fluidos y se usa
código media-queries de CSS3.

Para eso se debe tener la misma imagen, pero en varios


tamaños y que el navegador eligiese cual presentar en
cada momento. Se usa el atributo srcset dentro del
elemento img que nos permite justo eso, tener varias
Tipos de imágenes
imágenes a distintas resoluciones, y el navegador, en
función del tamaño o la resolución, mostrará una u otra.

Mejor tipo de fichero para las imágenes Las imágenes vectoriales son las
ideales para los logos, fuentes de
iconos y sobre todo formas con
colores planos. El formato más común
para estos archivos es el .SVG de
Scalable Vector Graphics.

•JPG para las fotografías. Cuando una imagen tiene


muchos colores, es la mejor opción.
Las imágenes rasterizadas son las
• SVG cuando tengamos un logo o imágenes muy lineales ya conocidas por todos. Son las
y con colores sólidos (Sin gradientes). Si no podemos usar imágenes que podemos hacer con
SVG, podemos usar PNG o WebP una cámara de fotos. Al contrario que
las vectorizadas, si escalamos una
• PNG siempre mejor que GIF. Ofrece más colores y mejor imagen de un tamaño pequeño a otro
ratio de compresión. más grande, perderemos calidad y la
• Video para animaciones complejas. Mucho mejor que un veremos pixelada.
GIF, mejor calidad de imagen

También podría gustarte