2. PROGRAMAS DE DISEÑO
Para realizar diseños y estilos creativos para paginas Web, se
utilizan diferentes programas que permiten realizar dichos
diseños
InDesign
• Adobe
InDesign es
una aplicación
de maquetación
Dreamweaver
•Adobe Dreamweaver es
una aplicación destinada
a la construcción, diseño
y edición de sitios
y aplicaciones
Web basados en
estándares
Flash
• Adobe Flash
Professional es una
aplicación de creación y
manipulación de graficos
vectoriales con posibilidades
de manejo de código
mediante el lenguaje Action
Script en forma de estudio de
animación
Photoshop
• Adobe Photoshop es una
aplicación informática en
forma de taller de pintura y
fotografía que trabaja sobre
un "lienzo" y que está
destinado para la edición,
retoque fotográfico y pintura a
base de imágenes de mapa
de bits
3. Siempre se debe tomar en
cuenta que una pagina Web
no solo debe ser atractiva,
sino funcional
4. QUE ES PIXELPERFECT?
Pixel Perfect es una extensión para Firefox /
Firebug
Permite a los desarrolladores y diseñadores
web, superponer fácilmente una composición
web
Se realiza a través de la parte superior del
HTML desarrollado
De esta manera, el diseño de la pagina Web
impecable
5. COMO FUNCIONA?
Primero que se realiza es un boceto
aproximado en algún programa de
diseño gráfico y después plasmarlo
en el navegador de la manera más
aproximada posible.
6. COMO FUNCIONA? CONT…
Con Pixel Perfect se tiene la
posibilidad de importar el
boceto realizado,(en formato
PNG, JPG, GIF, etc.) y
superponerla sobre la página
web real que se esta creando
con una opacidad reducida.
7. COMO FUNCIONA? CONT…
El resultado es
parecido a calcar, ya
que sólo se tendrá
que seguir las guías
del boceto para dejar
la pagina web tal y
como se concibió en
un principio.
8. COMPONENTES
Añadir Superposición:
Permite que se agregue uno
o mas formatos gráficos al
diseño de pagina Web.
Opacidad: Se puede
cambiar la opacidad para
que la composición sea más
transparente o menos
transparente.
Posición: Los controles de
posición están destinados a
ser utilizados para un ajuste
fino.
9. EJEMPLO
Pagina Web a
aplicar pixel
perfect. En la
parte de abajo,
podemos
observar los
componentes del
plugin
10. EJEMPLOCONT…
Se añade una
imagen mediante la
opción de añadir
superposición .
Dependiendo de lo
que se desea, se
modifica la opacidad.
11. EJEMPLOCONT…
Al final, podemos
observar el resultado
de superponer
imágenes a una
pagina Web
mediante Pixel
Perfect