May 15th, 2007

Photoshop videotutorial: Save for web

by Sergio Ordonez at 6:30 am on Photoshop, videotutorials

Video Tutorial: guardar web Photoshop

Click on the imagen if you want to see the Photoshop videotutorial  to learn how to save for the web, the goal is saving with the best quality but the smaller size

I have use 2 characters like examples, the one Sosfactory designed for realvideosite (mascot with gradient and lot of colors) and the main character of relaunch of POG games, designed by Sosfactory for Funrise Toy Corp .

Which is the file format I should use for the web? ¿JPG o GIF?

This is the proccess:

  1. Save for web in Photoshop “ARCHIVE” menu
  2. Choice JPG with 60% (for web we really dont need more quality)
  3. We see how many kb´s have the image
  4. Then we choice GIF and we go down with the number of colors until it starts to looks bad. 
  5. See how many kb´s it is.
  6. Depending on the weight of the file we choice our file format.

If you really want to save size when designing for web, the best is using Pixel art, notice we use just a few colors, so the file is really light… here is 2 examples:

Pixelart

PIXELART saved as Gif 64 colors = 8.976 kb

Gráfico sin pixelart JPG

Standard image with JPG 60% quality=18.83kb

Ok, so you already have no excuses :)

 NOTE: the video textboxes are in spanish, this tutorial is not too complex so I think everybody will understand it. In the future I promise all the videos will be in english… sorry too much work doing 2 blogs (spanish and english) for just me.

Related Post:

  1. Advanced digital drawing (Photoshop Videotutorial)
  2. Extract comic lineart
  3. Vectorizing with Silhouette

No comments yet. »

    No comments yet.

    RSS Comment sindication. TrackBack URI

    Submit a comment

    XHTML allowed tags:<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <code> <em> <i> <strike> <strong>