Google


gràfics per la web

Formats de gràfics per al web.
Programes de gràfics aconsellats.
Animacions i Flash.
Optimització de les imatges.
Ús d'imatges com a fons de pàgines i taules.

Elements de navegació: Mapes d'imatges i rollovers.

Programes per a la creació de gràfics per a la web.
Analitzam aquí els principals programes que s'empren per a la creació de gràfics especialment pensats per a la web. Per preparar les imatges per a pàgines web serveix qualsevol dels programes que comentam a la secció de Disseny gràfic, uns amb més prestacions, altres amb no tantes. Ara bé, cal dir que als darrers anys estan guanyant terreny una sèrie de solucions enfocades específicament a la preparació d'imatges per al web.

Destaquen Macromedia Fireworks (ja va per la tercera versió), Adobe Imagestyler i Adobe Imageready (aquest darrer ja no es ven per separat i vé inclòs amb Photoshop 5.5). Cal dir també que Corel Xara 2 és una molt potent eina per a la preparació d'imatges per al Web. Existeix una versió "menor" de Xara (anomenada Webster), encara més enfocada a la creació d'elements gràfics per al web.

Malgrat que els formats de gràfic que utilitzarem a les pàgines web són de mapes de bits, els avantatges de crear els gràfics per a una pàgina web amb un programa de dibuix vectorial són múltiples. Com que les imatges es poden escalar sense cap pèrdua de qualitat, mai hi ha problemes per refer el tamany d'una icona o d'un títol fet com a GIF. El text es manté editable sempre (si no l'hem convertit a corbes), de manera que podem retocar-lo un cop aplicats efectes. Aquests programes tenen també funcions avançades de maneig de formes geomètriques, adjustament dels elements, etc. que ens permeten crear les imatges amb gran precissió. Així, programes com Illustrator, Freehand, Corel Draw o Xara són magnífiques eines per a la preparació (i conservació!) de gràfics per al web.

La idea que hi ha darrera programes com Fireworks o ImageStyler és precisament crear les imatges amb un entorn de creació vectorial, que permeti tenir sempre disponible un original llest per fer noves variacions sense problemes de cap classe. Aquests programes són sens dubte la solució per als professionals del disseny gràfic aplicat al web, perquè les opcions que ofereixen abasten totes les necessitats que ens trobem a l'hora de crear els elements visuals d'una moderna pàgina web:

  Preparació de rollovers,
  Creació de mapes d'imatges,
  retallat d'imatges grans,
  Generació d'animacions de GIFs,
  transparències de GIFs,
  optimització de color i tamany de fitxers gràfics...

A aquestes pàgines donarem alguns consells referents a com dur a terme aquestes tasques, moltes d'elles rutinàries dins de la creació de gràfics per al web.

Fireworks destaca especialment en tasques com el retallat d'imatges grans en bocins més petits, per tal de facilitar la seva descàrrega a través d'internet. Simplement col.loquem unes línies guia i el programa retalla les imatges al llarg d'aquestes i genera una taula que les conté col.locades correctament. També destaca en la resta de funcions especials per a la creació de gifs o jpgs per al web. Fireworks incorpora tota una col.lecció d'efectes que es poden aplicar a imatges preelaborades o imatges que es crein des del mateix programa, amb les nombroses eines de dibuix de que disposa. Sempre maneja les formes com a objectes vectorials. Així, si canviem d'opinió respecte del disseny que hem fet, sempre podem tornar enrera sense problemes.

Imagestyler és un programa molt limitat a l'hora de crear imatges o retocar-les, i treballa bé només amb formes bàsiques o adaptant imatges ja llestes a un contorn determinat. Està pensat per a la creació d'elements gràfics com a botons, i el que té de més positiu és la possibilitat d'automatitzar diferents tasques d'aplicació d'aquests elements gràfics a conjunts sencers de pàgines web. Tret d'això, en comparació amb Fireworks, les seves mancances ho fan una elecció poc aconsellable.

Corel Xara 2 és un programa excepcionalment ben dissenyat. Encara que és increïblement petit, en comparació amb el que solen ésser els programes actuals -cap en tres disquets!- incorpora gairebé totes les funcions dels millors programes de dibuix vectorial, amb l'avantatge de tenir filtres d'exportació gif i jpg molt bons. Permet crear ràpida i simplement animacions i mapes d'imatge. Finalment, Xara Webster (que, a la versió 1, s'ofrereix gratis), és una utilitat senzilla, semblant a Imagestyler, i que incorpora algunes de les magnífiques eines de Xara (transparències de qualsevol tipus, animacions...) Tots els programes de Xara, inclòs Webster, tenen versions d'avaluació disponibles al web.

a dalt    Tornar a dalt


[ Vigital ] [ Manual de diseño digital, en castellano ] [ Contactar ]

idees i suggerències programes per al web Gràfics per al web CSS HTML

Pàgina inicial pàgina inicial