Your SlideShare is downloading. ×
  • Like
The Difference Between Print and Web Design
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Now you can save presentations on your phone or tablet

Available for both IPhone and Android

Text the download link to your phone

Standard text messaging rates apply

The Difference Between Print and Web Design

  • 941 views
Published

Slide deck from presentation delivered to Webuquerque on Feb. 3, 2010.

Slide deck from presentation delivered to Webuquerque on Feb. 3, 2010.

Published in Design , Business
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
    Be the first to like this
No Downloads

Views

Total Views
941
On SlideShare
0
From Embeds
0
Number of Embeds
1

Actions

Shares
Downloads
15
Comments
0
Likes
0

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. ber/glass The difference between print and web design
  • 2. WHY ME? I’ve been doing both for a while now.
  • 3. WHERE WE’RE HEADED Adobe Tools Color Resolution Typography Format Interactivity
  • 4. A MAJOR THEME exibility vs. consistency
  • 5. ADOBE TOOLS
  • 6. USE THE RIGHT APP! WEB: PRINT: • Dreamweaver • InDesign • Flash • Illustrator • Photoshop • Photoshop • Fireworks • Illustrator*
  • 7. COLOR
  • 8. ADDITIVE & SUBTRACTIVE
  • 9. COLOR MODELS Web: Print: Print: rgb cmyk pms
  • 10. DIFFERENT GAMUTS Visible spectrum (sorta) RGB CMYK
  • 11. COLOR CONSISTENCY • Print color should be consistent across all viewings (only variation is ambient light) • Web color varies significantly due to monitor contrast, brightness, black level, gamma, etc.
  • 12. RESOLUTION
  • 13. WHAT IS RESOLUTION? • Means different things in different contexts (display resolution vs. image resolution) • Resolution is measured in dpi • Screens are typically 72dpi (or thereabouts) why print has a higher dpi • Print is generally 300dpi
  • 14. RAMIFICATIONS • An image on a website that’s three inches wide on your monitor may look jagged when printed any larger than about 3/4 of an inch wide (multiplier is 4.17 or .072). • You can cheat, but not much.
  • 15. RESOLUTION & TYPE Low resolution hurts typographic detail
  • 16. TYPOGRAPHY Or, why print designers hate the web
  • 17. MILLIONS OF FONTS • Many fonts are designed for a particular medium. • Considerations include resolution, ink bleed, size, and letter width.
  • 18. WEB IS LIMITED • Type in HTML is limited to what the user has installed on his/her computer • Computers don’t come with much • Font is typically specified in cascading order via CSS
  • 19. THE WEB IS INCONSISTENT The same font might appear differently.
  • 20. BaseNineSCB (36pt) Sphinx of black quartz, judge my vow. BaseNineSCBI (36pt) Sphinx of black quartz, judge my vow. BaseNineSCI (36pt) Sphinx of black quartz, judge my vow. BaseNineSmallCaps (36pt) Sphinx of black quartz, judge my vow. Bell Gothic Black (36pt) Sphinx of black quartz, judge my vow. Bergell Plain (36pt) Sphinx of black quartz, judge my vow. Concept-One (36pt) Sphinx of black quartz, judge my vow. Cuomotype (36pt) Sphinx of black quartz, judge my vow. PRINT CAN DeadHistoryBold (36pt) Sphinx of black quartz, judge my vow. DeadHistoryRoman (36pt) Sphinx of black quartz, judge my vow. DeconStruct-Bold (36pt) Sphinx of black quartz, judge my vow. DO IT ALL DeconStruct-Medium (36pt) Sphinx of black quartz, judge my vow. Dynamoe (36pt) Sphinx of black quartz, judge my vow. Seriously, anything goes Flexure (36pt) Sphinx of black quartz, judge my vow. IndustrialSchizophrenic (36pt) Sphinx of black quartz, judge my vow. Marydale (36pt) Sphinx of black quartz, judge my vow. Marydale-Bold (36pt) Sphinx of black quartz, judge my vow. Napkin (36pt) Sphinx of black quartz, judge my vow. NotCaslonOne (36pt) Sphinx of black quartz, judge my vow. NotCaslonTwo (36pt) Sphinx of black quartz, judge my vow. Osprey (36pt) Sphinx of black quartz, judge my vow. Proletarian (36pt) Sphinx of black quartz, judge my vow. SuburbanBold (36pt) Sphinx of black quartz, judge my vow. SuburbanLight (36pt) Sphinx of black quartz, judge my vow. Swifty (36pt) Sphinxofblackquartz,judgemyvow. WordyDivaBeta (36pt) Sphinx of black quartz, judge my vow.
  • 21. SERIF vs. SANS-SERIF Some argue sans is more readable. Verdict: Hung jury
  • 22. FORMAT
  • 23. PRINT FORMATS Infinite variety Some common conventions (letter, trifold, business card) Consistent for all users/viewers
  • 24. WEB FORMATS Constrained by monitor width May be different for every user
  • 25. THE “FOLD” • In print, it has a specific location • On the web, it could be anywhere • Significant variation across computers • People do scroll
  • 26. OTHER CONSIDERATIONS WEB: PRINT: • Fixed/fluid • Paper stock • Centered/left • Distribution • Connection • Page count
  • 27. INTERACTIVITY
  • 28. PRINT IS... linear/sequential: everyone starts at the beginning immutable: once printed, it doesn’t change uniform: same piece is seen by entire audience
  • 29. THE WEB IS... nonlinear: not everyone starts in same place or goes in same sequence dynamic: revisions can/will be made after launch customizable: different users may see different content
  • 30. CONVENTIONS WEB: PRINT: • Iconography • Size/format • Element • Folds/turns locations • Innovation • Help usability encouraged
  • 31. TECHNICAL STUFF Web and print have own sets of highly technical challenges
  • 32. Q&A
  • 33. CONNECT Ben Byrne ben@byrnecreative.com facebook.com/drywall AIM: drywallbmb @drywall