• Website Home
  • About
  • Services
  • Portfolio
    • Recent
    • Archives
  • Shop
    • Catalog
    • Order

ASK Design Blog

Designer | Artist | Teacher

  •  
    • Blog Home
    • Web Design
    • Graphic Design
    • Art
      • Licensed Art
    • Links
    • Calendar
    • Contact
      • Privacy Policy
      • Cookie Policy

    Image File Formats: print vs. web

    May 23, 2011 by ProfK 6 Comments

    There are 2 basic categories of file formats for images, and they relate to end-use: print and web. The key differences between print and web images are resolution measurement and color mode. Within the 2 categories are 2 core types of images: raster and vector. Raster images, otherwise known as continuous tone or photographs, are composed of tiny squares (pixels) which lose resolution when scaled up in size. Vector images are composed of connected lines and curves, which are “resolution-independent” and can be scaled up or down without losing quality; these object-oriented, mathematically-defined images are best used for logos, type, and illustrations.

    Print images
    Characteristics
    • high resolution — 300 ppi (pixels per inch) or higher
    • CMYK color mode — also called 4-color process. The 4 colors of CMYK (Cyan, Magenta, Yellow, Black) can be mixed to achieve a full range of color. There is some variance in the colors produced with cmyk mixing.
    • Spot color — a premixed, standard ink selected from a numbered list provided by the ink vendor, which is most commonly the Pantone Matching System (PMS) in the U.S. and Toyo Ink in Europe. Since the spot color is premixed, it uses only 1 plate (vs. 4 plates for a cmyk mix of a similar color) and does not change from page to page during the print run.
    Common file formats (all without compression)
    • TIFF — (Tag Interleave File Format) — This is THE best file format for high-quality, continuous-tone photography intended for print. It can be used on both Mac and PC platforms. LZW compression is an option (lossless), but BE SURE TO DE-SELECT the LZW and re-save the file when importing it into a document being prepared for print. TIFFs with LZW compression can corrupt Quark and InDesign files.
    • EPS (Encapsulated PostScript) — Can be used for both raster and vector images, and was considered excellent in its heyday. But, not always readable on PCs, EPS is being phased out and replaced by PDF.
    • PDF (Portable Document Format) — The excellent, new, open standard format is readable on virtually all platforms. It preserves all of the file information beautifully.
    • PSD (Photoshop Document) — The working source file for raster images in Photoshop.
    • AI (Adobe Illustrator) — The working source file for vector images in Illustrator.
    Web images
    Characteristics
    • low resolution — 72 ppi (pixels per inch)
    • RGB color mode — (Red, Green, Blue) also called “additive” primary colors because when added together they produce white light. In HTML coding, hexadecimal notations (HEX) are used to define combinations of Red, Green, and Blue color values (RGB). More than 16 million colors can be achieved by mixing RGB.
    Common file formats (all with built-in compression)
    • JPEG (Joint Photographics Expert Group) — Offers different levels of lossy compression, which means you lose and cannot retrieve data when compressing. Best used for continuous tone images.
    • GIF (Graphics Interchange Format) — Supports transparency and animation. Best used for graphics.
    • PNG (Portable Network Graphic) — Supports transparency and has much better color quality than GIF.
    • SVG (Scalable Vector Graphic) — A vector format for high-quality web graphics.

    There are lots of great resources for information on the web, and sometimes it’s hard to sort through all of it. Hopefully, this article clarified the basics of image formats. If you have any questions, please leave a comment and I’ll be happy to help.

    Related Posts

    How to Create and Edit WordPress Galleries

    How to Resize an Image in WordPress

    How to Resize an Image in Photoshop

    How to Scan within Photoshop CS6, CS5, CS4

    Effective Resolution: Key Factor of Image Scaling

    Filed Under: Graphic Design, Software Tips, Web Design Tagged With: cmyk, eps, file formats, gif, image files, jpeg, pdf, png, print files, psd, raster, rgb, svg, tiff, vector, web files

    Reader Interactions

    Comments

    1. cheap prom dresses says

      August 25, 2011 at 3:33 pm

      I like this post very much, thank you very much.

    2. marble deck says

      December 7, 2019 at 8:45 am

      Wonderful article, I learned a lot of new things, thanks for sharing this information.

    3. Stanton says

      April 20, 2020 at 7:56 am

      An outstanding share! I have just forwarded this onto
      a co-worker who has been doing a little research on this.

      And he actually bought me dinner because I stumbled upon it for him…
      lol. So allow me to reword this…. Thank YOU for the meal!!

      But yeah, thanks for spending some time to discuss
      this matter here on your website.

    4. Madalina Ciocan says

      July 13, 2021 at 6:01 pm

      Hello Anne!
      I recently came across your blog and just wanted to extend my gratitude for the work you put into it.

      I’m trying to brush up on my graphic design to help with my web development projects, and your blog post has been the most helpful resource I found for learning about formatting images.

      Thank you 🙂

    5. Megan says

      November 23, 2021 at 6:20 pm

      Thank you for sharing this. It’s very detailed, easy-to-understand, and well written. I’m just starting out in working on my BA in design, and this was super helpful. I appreciate how you organized this.

    6. ProfK says

      November 24, 2021 at 5:55 pm

      Hi Megan, Great to hear this feedback! I’m so glad it was helpful. Thank you for taking the time to tell me.

    Leave a Reply

    Your email address will not be published. Required fields are marked *

    This site uses Akismet to reduce spam. Learn how your comment data is processed.

    Primary Sidebar

    Affiliate Disclosure

    This website contains affiliate links, which means I may get a small commission (at no cost to you) if you use these links to make a purchase.

    Subscribe to Mailing List

    Sign up to get periodic updates on Anne's design and art adventures, and receive useful info. via her blog.
    * = required field

    We never share our email list with anyone.

    Looking for Something on this Site?

    Search the Web

    New Book Published!

    Kornegger book: Inside the Rainbow

    Art and design for book cover and interior

    Inside the Rainbow: Soul Connection in Nature, by Peggy Kornegger

    BUY THE BOOK!

    Peggy and I have completed our 3rd book together! This one is about soul connection in nature. Peggy is the writer, I'm the designer and artist. I think it's pretty darn special and hope you agree 🙂. Printed book and eBook are both available on Amazon.

     
    kornegger loseyourmind front cover
    Several of my paintings are in this book (including the cover)
    BUY THE BOOK!
     
    Check out my blog post about designing books: Self-Publishing Adventures

    Amazon Affiliate

    As an Amazon Associate I earn from qualifying purchases.

    Photo, Video & Design Software

    Affiliate Partners

    We receive compensation when you purchase a service or product via the links on this blog.

    Web Hosting

    StudioPress
     
    Bluehost Website Hosting

    Testimonials

    I received the notecards on Friday and it was on my to do list today to email you my deep appreciation for them. They are amazing and I am so glad to have them to share. I am sure I will order more in the future. You are such a gifted artist and I thank you for sharing in a way others can use the art.

    — Shari Spokes

    Your new pastel "Lettuce Lake” is really beautiful. Very, very nice.

    — Tony from Belmont, MA

    My dear sweet sister. I can’t tell you how much I love your pictures. I so much wanted something and was so sorry that I couldn’t pick something out at your sale. On the other hand, I so much wanted something that you had chosen for me. Its been on my mind and suddenly, your beautiful pictures arrived. They are beyond beautiful and I cried when I saw them. Sending you love and my bestness.

    — Marti from Reno, NV

    Copyright

    © 2000-2023 Anne S. Katzeff. All rights reserved. Unless noted, all artwork and text are copyrighted by the artist. Images may not be reproduced, manipulated, or used in any way without Anne’s written permission.

    Categories

    Graphic Design

    • AIGA
    • Design Is History
    • Janice Moore
    • Mass. Contractors

    Web Design

    • 978 Grid System
    • A List Apart
    • Adobe Color Tools (formerly Kuler)
    • AWWWards
    • Smashing Magazine
    • underthesite
    • www schools

    Tech-Computer

    • Adobe TV
    • Orramac
    • Teknoziz

    Comments

    In an effort to reduce spam, comments are restricted. Please email Anne if you have a comment or question that you are unable to post. Thanks for understanding.


    Archives

    Typography

    • 1001fonts
    • Adobe Type
    • Adobe Web Type
    • Bitstream
    • Dafont.com
    • Emigre
    • Font converter (free)
    • Font Spring
    • Font Squirrel
    • Google Fonts
    • I Love Typography
    • identifont
    • Typeinspire
    • Typewolf
    • Typoretum

    Photography

    • Creative Commons

    Footer

    Subscribe to Mailing List

    Sign up to get periodic updates on Anne's design and art adventures, and receive useful info. via her blog.
    * = required field

    We never share our email list with anyone.

    Contact

    Website
    Email

    Subscribe to RSS Feed

  •  ASK Design Blog
  • Connect and Share

  •  
  • Legal

    Privacy Policy
    Cookie Policy

    Copyright © 2023 · Optimal Theme · Built on the WordPress Genesis Framework· Customization and design by ASK Design