Design conventions

58
Wesley Lindamood Project ARGO web designer FROM PUBLIC MEDIA AND BEYOND... DESIGN PATTERNS

Transcript of Design conventions

Page 1: Design conventions

Wesley Lindamood Project ARGO web designer

FROM PUBLIC MEDIA AND BEYOND...

DESIGN PATTERNS

Page 2: Design conventions

Contextual navigation

Content promotion

Content types

Aggregated content

Reader voice

Sponsorship and advertising

Brand management

DESIGN PATTERNS

Page 3: Design conventions

NAVIGATIONCONTEXTUAL

Page 4: Design conventions

kalwnews.org

Page 5: Design conventions

kqed.org/news

Page 6: Design conventions

huffingtonpost.com

Page 7: Design conventions

propublica.org

Page 8: Design conventions

theweek.com

Page 9: Design conventions

earth2tech.com

Page 10: Design conventions

reuters.com

Page 11: Design conventions

PROMOTIONCONTENT

Page 12: Design conventions

scpr.org

Page 13: Design conventions

kplu.org

Page 14: Design conventions

tpmcafe.talkingpointsmemo.com

Page 15: Design conventions

dcist.com

Page 16: Design conventions

mediaite.com

Page 17: Design conventions

cityfile.com

Page 18: Design conventions

ideo.com/news

Page 19: Design conventions

thebolditalic.com

Page 20: Design conventions
Page 21: Design conventions

thesixtyone.com

Page 22: Design conventions

CONTENT TYPESDISTINGUISHING

Page 23: Design conventions

wbur.org

Page 24: Design conventions

bobulate.com

Page 25: Design conventions

newyorker.tumblr.com

Page 26: Design conventions

newyorker.com/online/blogs/stevecoll

Page 27: Design conventions

blogs.wsj.com/health

Page 28: Design conventions

last.fm/charts/artist

Page 29: Design conventions

engadget.com

Page 30: Design conventions

mashable.com

Page 31: Design conventions

gigaom.com

Page 32: Design conventions

AGGREGATIONCONTENT

Page 33: Design conventions

topics.nytimes.com

Page 34: Design conventions

TheMoneyMeltdown.com

Page 35: Design conventions

kqed.org/news

Page 36: Design conventions

engadget.com

Page 37: Design conventions

one.org/us/issues

Page 38: Design conventions

READER VOICEHIGHLIGHTING

Page 39: Design conventions

opb.org/thinkoutloud/shows/faith-fissure

Page 40: Design conventions

kalwnews.org

Page 41: Design conventions

minnesota.publicradio.org/your_voice/discussions

Page 42: Design conventions

conversation.wamu.org

Page 43: Design conventions

facebook.com/people/Xpn-Philly-Local/1292941191

Page 44: Design conventions

businessinsider.com

Page 45: Design conventions

wearehunted.com

Page 46: Design conventions

dcist.com

Page 47: Design conventions

good.is

Page 48: Design conventions

propublica.org/feature/introducing-the-propublica-reporting-network-520

Page 49: Design conventions

ADVERTISINGSPONSORSHIP AND

Page 50: Design conventions

RECOMMENDED AD SIZESInteractive Advertising Bureau (IAB)

300x250 Medium Rectangle

88x31 Microbar

Source: http://www.iab.net/iab_products_and_industry_services/508676/508767/Ad_Unit

728x90 Leaderboard

Other sizes meeting IAB criteria:180x150 Rectangle

160x600 Wide Skyscraper

300x600 Half Page Ad

120x60 Button #2

Page 51: Design conventions

scpr.org

Page 52: Design conventions

xpn.org/yrock-on-xpn/

Page 53: Design conventions

npr.org

Page 54: Design conventions

valleywag.gawker.com

Page 55: Design conventions

BRANDSAND SUB BRANDS

MANAGING

Page 56: Design conventions

theweek.com

Page 57: Design conventions

cityfile.com

Page 58: Design conventions

bobulate.com