dispatch.com design style guideaudio.dispatch.com/StyleBook0309.pdf9 March 2011 dispatch.com design style guide 2 Table of Contents I. Basic Design Elements 3 A. 12-Column Grid 4 B

dispatch.com design style guide9 March 2011 1

dispatch.comdesign style guide

updated: 03/09/11

{


TableofContents I.BasicDesignElements 3 A.12-ColumnGrid 4 B.ColorPalette 5 C.Typography 6,7 D.RulesandSpacing 8 E.Toolbar II.WrapElements 9 A.Pieces 10 B.Header 11,12 C.Dropdowns 13 D.Footer 14-18 E.RightRailsandComponents 19-21 F.LeftRailComponents III.LandingPages 22,23 A.PageHeaders 24-27 B.LeadStoryOptions 28 C.DownpageStoryOptions 29 D.ListOptions 30 E.StoryCarousel 31 F.ConnectBox IV.StoryPages 32-34 A.StoryPageOptions 35-38 B.StoryPageComponents 39 C.StoryPageSpacing


728 x 90px Leaderboard Ad

160 x 30px

Ad sizes used by Dispatch.com

Dispatch.com search bar ad

300 x 600pxHalf Page Ad

300 x 250pxMedium Rectangle Ad

(box)

160 x 600pxWide

Skyscraper(tower)

960 x 30pxDispatch.com pencil ad

960px

940px 6col. content area

780px 5col.

620px 4col.

460px 3col.

300px 2col.

140px 1col.

60px icon

20px paddingbetween columns

10pxoutsidepadding

10pxoutsidepadding

I.BasicDesignElementsA.12-ColumnGrid

PageGridMost Dispatch.com elements will fit within the 6-column grid, shown here in the blue lines.

Each column measures 140px wide with 10px padding on the left and right sides.

The content area on each page is 940px with 10px on each side.

Square icons and mugshots are typically 60px wide, to fit within the 12-column grid, shown in pink.

On the vast majority of pages, the Right Rail will take up the two right columns, consisting of 300px, and the Left Rail will take up the left-most column, measuring 140px. This leaves 460px for the Center Content.

To provide visual consistency and order, elements should adhere to the 6-column whenever possible, or at least to the 12-column grid.


I.BasicDesignElementsB.ColorPalette

News BlueHEX: #0787A1

RGB: 7, 135, 161

Sports RedHEX: #BD282E

RGB: 189, 40, 46

Opinion GreenHEX: #B4BB2E

RGB: 180, 187, 46

Life&Ent OrangeHEX: #D68C26

RGB: 214, 140, 38

Darkest GrayHEX: #333333

RGB: 51, 51, 51

BlackHEX: #000000

RGB: 0, 0, 0

Dark GrayHEX: #666666

RGB: 102, 102, 102

Light GrayHEX: #CCCCC

RGB: 204, 204, 204

Medium GrayHEX: #999999

RGB: 153, 153, 153

Lightest GrayHEX: #EEEEEE

RGB: 238, 238, 238

WhiteHEX: #FFFFFF

RGB: 255, 255, 255

For labels, breadcrumbs, arrow and disc bullets, bylines and email addresses within the News section. Also an accent color other pages.

For labels, breadcrumbs, arrow and disc bullets, bylines and email addresses within the Sports section.

For labels, breadcrumbs, arrow and disc bullets, bylines and email addresses within the Opinion section.

For labels, breadcrumbs, arrow and disc bullets, bylines and email addresses within the Life & Entertainment section.

For abstract and story text, headlines within lists, and text on classifieds and services dropdowns.

For story headlines, headlines that are accompanied by abstract text, section links at the bottom of lists, “updated” timestamps and contextual links within story text.

For labels and bullets that are not specific to a particular section, subheads, timestamps, story label heads, photo captions, notations, factbox text (any text that is set in Helvetica), section names within carousels, connect box links, and the Latest Headlines and Most Popular/E-mailed story headlines.

For the inactive option on tabs and the prev/next arrows on carousels.

For names of affiliates within labels atop lists, photo credits, arrow bullets separating breadcrumbs, landing page top links and the dotted border under links in the hover state.

For the hover text color on editoral dropdowns, the double rules separating sections and the single arrow after section names on landing pages.

For the text within editorial dropdowns.


I.BasicDesignElementsC.Typography

TypefacesDispatch.com uses three font families: Georgia, Helvetica and Tahoma.

Georgia: Primarily for text and headlines

Helvetica: Primarily for links and aside text

Tahoma: Primarily for section names and labels

BulletsDispatch.com uses two different kinds of bullets:

›› Double arrow bullets to go before headlines in lists and between sections in breadcrumbs, and are images created using:

2 guille single right marks

›› or

&rsaquo;&rsaquo;

Set in Zapf Dingbats, letter-spacing: -.1em, font-size: .8em; 1 space after bullet, color-coded by section

• Disc bullets for secondary lists, and are often paired with aside text and unordered list. They are images created using:

1 bullet

• or •

Set in Tahoma, 1 space after bullet, color-coded by section

ElementsBODyTExTStory Page Text: Georgia, normal, 14px, 140% line-spacing, #333Abstract Text: Georgia, normal, 12px, 140% line-spacing, #333

HEADLINESStory Page Headlines: Georgia, normal, 42px, 120% line-spacing, #000Landing Page Lead Headlines: Georgia, normal, 38px, 120% line-spacing, #000Landing Page Secondary Headlines: Georgia, normal, 24px, 120% line-spacing, #000List Headlines (with Abstracts): Georgia, normal, 18px, 120% line-spacing, #000List Headlines (without Abstracts): Georgia, normal, 16px, 120% line-spacing, #333, with color-coded double arrow bullet

SUBHEADSStory Page Subheads: Helvetica, bold, 18px, 120% line-spacing, #666Landing Page Lead Subheads: Helvetica, bold, 16px, 120% line-spacing, #666

CHAPTERHEADSStory Page Chapter Heads: Helvetica, bold, 14px, 120% line-spacing, #666

LABELSLanding Pages and Rails: Tahoma, bold, All Caps, 12px, 110% line-spacing, color-codedStory page Label Headlines: Tahoma, bold, All Caps, 12px, 110% line-spacing, #666 TIMESTAMPSStory Page Timestamp: Helvetica, normal, 12px, 110% line-spacing, #666List Timestamp: Helvetica, normal, 9px, all caps, 110% line-spacing, #666Update Timestamp: Tahoma, bold, 9px, all caps, 110% line-spacing, #000 LINKSContextual Links Within Text: Georgia, bold, inherited size and line-height, #000Links At Bottom of Lists: Helvetica, normal, 10px, All Caps, 120% line-spacing, #000On Hover: 1px #999 dotted rule below link (text, headlines, other links)

ASIDE,NONSTORyTExTStandard Aside, Other Features Text: Helvetica, normal, 12px, 140% line-spacing, #666Unordered Lists: Helvetica, normal, 12px, 140% line-spacing, #666, with disc bullet color-coded by sectionFactbox Headline: Tahoma, bold, 16px, 120% line-height, #666Notations (in aside and below story text): Georgia, italic, 14px, 140% line-spacing, #666


SPACEBETWEENELEMENTS

DividinglinesDispatch.com an image as a custom double rule to separate groups of content horizontally.

The above rule consists of two 1px solid #eee lines, separated by 3px of white space. The complete width is 5px.

There is 20px of white space above and 20px of white space below the rule.

VerticalspaceElements on Dispatch.com are separated vertically by 20px of white space, but no rule.

I.BasicDesignElementsD.RulesandSpacing

45px total space

20px space above5px deep

20px space below

300 x 250pxBox Ad

ADVERTISEMENT • PLACE AN AD

MOST POPULAR

1. Xyxyxxyxy xyxyx xxyxyxy xyxyx xyxyx xyxyx xyxy2. Xyxyxxyxy xyxyx xxyxyxy xyxyx xyxyx xyxyx xyxy3. Xyxyxxyxy xyxyx xxyxyxy xyxyx xyxyx xyxyx xyxy4. Xyxyxxyxy xyxyx xxyxyxy xyxyx xyxyx xyxyx xyxy5. Xyxyxxyxy xyxyx xxyxyxy xyxyx xyxyx xyxyx xyxy6. Xyxyxxyxy xyxyx xxyxyxy xyxyx xyxyx xyxyx xyxy7. Xyxyxxyxy xyxyx xxyxyxy xyxyx xyxyx xyxyx xyxy8. Xyxyxxyxy xyxyx xxyxyxy xyxyx xyxyx xyxyx xyxy9. Xyxyxxyxy xyxyx xxyxyxy xyxyx xyxyx xyxyx xyxy10. Xyxyxxyxy xyxyx xxyxyxy xyxyx xyxyx xyxyx xyxy

››LATEST HEADLINES

››TODAY’S PAPER

TOP STORY RSS FEED

160 x 600pxTower Ad



I.BasicDesignElementsD.RulesandSpacing

SPACEWITHINELEMENTS

HorizontalspaceItems within an element on Dispatch.com can be separated by anywhere from 5px to 20px of horizontal space.

Typically, the smaller, more-closely related components are closer together.

For example, the list of items within a factbox are separated by 5px of space, while a collection of headlines in a List are separated by 10px.

A large photo on a story page is separated from its related headline by 20px because of its size.

Color-coded spacing is shown at right.

DividinglinesWhen a rule is needed to separate items within one element, a single, horizontal, #eee line is used.

Examples include the rules above and below the byline/timestamp information on a story page and a rule separating the story from its related comment box.

Double rules are used within the left and right rails to separate elements, but components that move with the story itself (such as secondary photos, factboxes and related links) have no horizontal rules. 20px of space is used instead.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam vitae ipsum sed magna suscipit vehicula at vel felis.

Donec venenatis adipiscing diam, ut gravida tortor porta ac. Aliquam at nunc a nisi ultrices aliquam ut ac metus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris suscipit dapibus sollicitudin. Maecenas at neque lectus, cursus pretium ipsum. Nam et risus vel dui pellentesque fermentum.

Donec suscipit feugiat nunc, vitae interdum odio porta ac. Sed non dolor vitae dui mattis euismod in eget nisl. Vestibulum non blandit augue.

Nunc scelerisque, neque in dignissim aliquam, nunc mauris iaculis sapien, sit amet ornare tellus orci at ipsum. Cras non lorem quam, quis dictum ligula. Maecenas eget elit augue, et pellentesque augue. Quisque in nisl est. Sed purus justo, mollis non bibendum sit amet, egestas pharetra turpis. Nunc tempor tincidunt eros, eu blandit mi interdum eget.

[email protected]

Headline lorem ipsum defacto ipte latte frappacinno grandeDonec venenatis adipiscing diam, ut gravida tortor porta ac. Aliquam at nung a nisi ultrices aliquam ut ac metus

Home ›› News ›› Xyxyxyxyxy

By Gina Potthoff • The Columbus DispatchSunday, September 12, 2010 03:01 AM • 18 Comments • 13 Recommend

Type in your comments below | Read all 5 comments

Name (appears on your post)

Comments

Type the numbers you see in the image on the right:

Characters left: 4000

Please note by clicking on "Post Comment" you acknowledge that you have read the Terms of Service and the comment you are posting is in compliance with such terms. Be polite. Inappropriate posts may be removed by the moderator. Send us your feedback.

POST COMMENT

CREDITLINE XYXYXYXY

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam vitae ipsum sed magna suscipit vehicula at vel felis. Donec venenatis adipiscing diam, ut gravida tortor porta ac. Aliquam at nunc a nisi ultrices aliquam ut ac metus.

ELSEWHEREON THE WEB• Xyxyx xyxyx xyxyx xyxy

xy xx xyxyx • Xyxyx xyxyx xyxyx xyxy


xy xx xyxyx

ALSO IN [SECTION]

›› Xyxyxyxyx xyxy xyx xyxy xyxy xyx yxyxyxy xyxyxyxy

›› Xyxyxyxyx xyxy xyx xyxy xyxyxy

›› Xyxyxyxyx xyxy xyx xyxy xyxy xyxy xyxyxyxyxyx xyMORE SCIENCE & ENVIRONMENT

CREDITLINE XYXYXYXY

Lorem ipsum dolor sit amet, consectetur adipi-scing elit.

Factbox head yLorem ipsum dolor sit amet, consectetur adipi-scing elit. Nam vitae ipsum sed magna suscipit vehicula at vyl felis. • Xyxyx xyxyx xyxyx xyxy


xy xx xyxyx • Xyxyx xyxyx xyxyx xyxy xy xx xyxyx

15px

5px

20px

20px

20px

20px

20px20px

5px

10px

10px

10px

10px

10px

10px

5px

5px

5px

5px

NewCommentModule

TBD


Dispatch on Facebook Dispatch on Twitter E-Newsletters RSS Text Alerts Subscribe to The DispatchEdit • Log out My Favorites My Comments

Hello, NamyO.ReaderHere

RSS Text Alerts Subscribe to The DispatchSign up • Log in Log in with Facebook

REGISTER WITH DISPATCH.COM›

Dispatch on Facebook Dispatch on Twitter E-Newsletters RSS Text Alerts Subscribe to The DispatchEdit • Log out Your Favorites Your Comments

Hello, Name O.ReaderHere›

Dispatch on Facebook Dispatch on Twitter E-Newsletters RSS Text Alerts Subscribe to The DispatchSign up • Log in Log in with Facebook

REGISTER WITH DISPATCH.COM›

Dispatch on Facebook Dispatch on Twitter E-Newsletters

35px10px

7px

13px

20px 12px spacing

Loggedin,Toolbarvisible

Loggedin,Toolbarhidden

Loggedout,Toolbarvisible

Loggedout,Toolbarhidden

I.BasicDesignElementsE.Toolbar ToolbarStyleRules

• Fixed position at bottom of browser window• Icons are grayscale, 10px square, with 11px #666 Helvetica normal text• On hover, icons become color, text becomes #000• Show/Hide arrows point up when visible, down when hidden, black when hover• User Name and Register CTA are 12px Helvetica Bold, news blue


NEWS SPORTS OPINION

LIFE

ENTERTAINMENT

CLASSIFIEDS

SERVICES DISPATCH MEDIA GROUP


ONLINE COUPONS from TheBag.com

Show All (175) GO GO

Browse for coupons by category:

Or enter your ZIP code for savings in your area:

300 x 250pxBox Ad

FROM THE NEWS BLOGSXYXYXYYXYXYXYXYXyxyx xyxyx xyy xx xyxyx Xyxyxxyxy xyxyx xyxy yxyxyx xyxy xyxyxy yxyxy xxyxy xy xyxy xyxx yxy

XYXYXYYXYXYXYXYXyxyx xyxyx xyy xx xyxyx Xyxyxxyxy xyxyx xyxy yxyxyx xyxy xyxyxy yxyxy xxyxy xy xyxy xyxx yxyy

XYXYXYYXYXYXYXYXyxyx xyxyx xyy xx xyxyx Xyxyxxyxy xyxyx xyxy yxyxyx xyxy xyxyxy yxyxy xxyxy xy xyxy xyxx yxy

XYXYXYYXYXYXYXYXyxyx xyxyx xyy xx xyxyx Xyxyxxyxy xyxyx xyxy yxyxyx xyxy xyxyxy yxyxy xxyxy xy xyxy xyxx yxyy

MORE NEWS BLOGS

MOST POPULAR MOST COMMENTS1. Xyxyxxyxy xyxyx xxyxyxy xyxyx xyxyx xyxyx xyxy2. Xyxyxxyxy xyxyx xxyxyxy xyxyx xyxyx xyxyx xyxy3. Xyxyxxyxy xyxyx xxyxyxy xyxyx xyxyx xyxyx xyxy4. Xyxyxxyxy xyxyx xxyxyxy xyxyx xyxyx xyxyx xyxy5. Xyxyxxyxy xyxyx xxyxyxy xyxyx xyxyx xyxyx xyxy6. Xyxyxxyxy xyxyx xxyxyxy xyxyx xyxyx xyxyx xyxy7. Xyxyxxyxy xyxyx xxyxyxy xyxyx xyxyx xyxyx xyxy8. Xyxyxxyxy xyxyx xxyxyxy xyxyx xyxyx xyxyx xyxy9. Xyxyxxyxy xyxyx xxyxyxy xyxyx xyxyx xyxyx xyxy10. Xyxyxxyxy xyxyx xxyxyxy xyxyx xyxyx xyxyx xyxy

MORE POPULAR STORIES

TOP STORY RSS FEED

160 x 600pxTower Ad

The oil slick that coated the Gulf Coast waters for most of the summer appears to have mostly disappeared.

But two researchers say it's worth taking a deeper look and are working to create a computer program that can track the spill's long-term effects below the surface on fish migration and spawning.

"I hope people don't think that just because oil isn't leaking out of the well that it's over now," said Prosanta Chakrabarty, a fish researcher at Louisiana State University. "Wildlife is still really important. Each of those species is a page of biological history."

Janies is using the same computer application that he created to track infec-tious diseases. In the past few years, he has kept tabs on avian influenza and the H1N1 virus.

Right now, he and Chakrabarty have included points for fish and oil on a Google Earth map, but they're also inviting the public to upload their own data in the same way.

All they have to do is submit a spreadsheet to the website with the fish name, location name, coordinates, depth and the date it was collected.

Even if just one fish of a species is found in an area, it counts as a historic collection, Janies said.

Once data is uploaded to the Web application, the points are mapped in relation to the oil spill. The date, depth and institution that collected the species can be seen by clicking on a fish icon or the green image symbolizing where the oil slick has spread according to satellite images.

Each species currently has two maps: one with fish and oil distribution and one without the oil image.

[email protected]

Deep-sea threatComputer program tracks effects of Gulf Coast oil spill on fish species

Home ›› News ›› Science & Environment

By Gina Potthoff • The Columbus DispatchSunday, September 12, 2010 03:01 AM • 18 Comments • 13 Recommend

Type in your comments below | Read all 5 comments

Name (appears on your post)

Comments

Type the numbers you see in the image on the right:

Characters left: 4000

Please note by clicking on "Post Comment" you acknowledge that you have read the Terms of Service and the comment you are posting is in compliance with such terms. Be polite. Inappropriate posts may be removed by the moderator. Send us your feedback.

POST COMMENT

OHIO STATE UNIVERSITY

The Depthmap program shows where fish species live in relation to the oil that spilled in the Gulf Coast.

Xyxyxyxyxyxyxy

Xyxyxyxyxyxyxy

Xyxyxyxyxyxyxy

Xyxyxyxyxyxyxy

1 of 2 • Click image for slide show

ELSEWHEREON THE WEB

• Xyxyx xyxyx xyxyx xyxy xy xx xyxyx



ALSO IN SCIENCE & ENVIROMENT

›› Xyxyxyxyx xyxy xyx xyxy xyxy xyx yxyxyxy xyxyxyxy

›› Xyxyxyxyx xyxy xyx xyxy xyxyxy

›› Xyxyxyxyx xyxy xyx xyxy xyxy xyxy xyxyxyxyxyx xyMORE SCIENCE & ENVIRONMENT

SCIENCE & ENVIROMENT BLOG

Chocolate genome sequenced

They've done it! They've finally done it! Scientists

say they have determined the complete DNA sequence of the tree that produces cocoa beans. Chocolate. CHOCOLATE!

MORE SCIENCE & ENVIRONMENT BLOG

Testing the watersFind out which of the 20 Ohio State Park swim-ming areas at 16 lakes contain fecal coliform.

DATABASES

Dispatch.com Archive Web by

News Sports Opinion Classifieds Services Store ContactsLife & Entertainment

155 x 30px adSEARCH BARSPONSOR

Hot Links:

Search


56 xyxyxyxyx xyxyxyxy

HeaderHomepage version940px wide x. 260px deepInside page version940px wide x. 230px deep

FooterConsistent sitewide940px wide, bottom pad-ding to allow for browser toolbar

RightRail(8)Top-level specific300px wide x. variable depth• home• news• sports• opinion (video uses same)• life & entertainment• blogs• briefs (short stories that have short left and right rails)• misc. (today’s paper, photos, podcasts, latest headlines, more)

News(17)• News default• Business• Crime & Safety• Environment• Health & Medicine• Local• Offbeat• Religion• Schools• Science• Special Reports• US & World• Weather• Corrections• Ben Marrison Commentary• John Switzer Commentary

Sports(14)• Sports default• Other Colleges• MiLB: Clippers• NBA: Caveliers• MLB: Reds & Indians• NFL: Bengals & Browns• Golf• Auto Racing• High School Sports• Outdoors• Michael Arace Commentary• Bob Hunter Commentary• Rob Oller Commentary• Ray Stein’s Mailbox

Opinion(4)• Editorials• Letters to the Editor• Op-Ed Columnists• The Hot Issue

Life&Ent.(18)• Life & Ent. default• Contests• Fashion & Style• Home & Garden• Travel• Joe Blundo Commentary• Advice Columns• Random Thoughts Commentary• First Person Commentary• Books• Celebrities• Dining• Events• Movies• Music• Television• Theater• Video Games

II.WrapElementsA.Pieces

LeftRail(53)Story pages only; Second-level specific140px wide x. variable depth


II.WrapElementsB.Header

Homepageversion

Shallow,optionalforsubsites

Smallerversionforinsidepages


160 x 30px ad SEARCH BARSPONSOR

›› Hot Links: Xyxyxyxyxy • Xyxyxyxyxyx • Xyxyx xyxyxyx x • Xyxyx xyxyxyx x • Xyxyx xyxyxyx x • Xyxyx xyxyxyx x • Xyxyx xyxyxyx x • Xyxyx xyxyxyx x


Search


HOME • TODAY’S PAPER • VIDEO • PHOTOS • PODCASTS • ELECTRONIC EDITION • MOBILE • APPS Columbus, Ohio • Sept. 00, 2011 • 00 ̊Xyxyxyxyx xyxyxyxy

Columbus, Ohio • Xyxyxy. 00, 2010 • 00 ̊xyxyxyxyx xyxyxyxyNews Sports Opinion Classifieds Services Store ContactsLife & Entertainment



›› Hot Links: Xyxyxyxyxy • Xyxyxyxyxyx • Xyxyx xyxyxyx x • Xyxyx xyxyxyx x • Xyxyx xyxyxyx x • Xyxyx xyxyxyx x • Xyxyx xyxyxyx x • Xyxyx xyxyxyx x


HOME • TODAY’S PAPER • VIDEO • PHOTOS • PODCASTS • ELECTRONIC EDITION • MOBILE • APPS

Columbus, Ohio, Sept. 00, 201100 ̊Xyxyxyxyx xyxyxyxy

160 x 30px ad SEARCH BARSPONSOR


Search

Typographyrules

Above Nameplate Links (Helvetica, 10px, all caps, #666, with disc bullets separating them)

Place Date Weather Info (Helvetica, 11px, #666, with disc bullets separating them)

Tab Links (Tahoma, bold, 11px, #fff and #333)

Search Box Options (Helvetica, 11px, #666)

Search Bar Sponsor (Helvetica, all caps, 9px, #ccc)

Hot Links Leadin (Helvetica, bold, 12px, #000, with double arrow bullet)

Hot Links (Helvetica, 12px, #333, with disc bullets separating them)

Typographyrules

Place Date Weather Info (Helvetica, 11px, #999, with disc bullets separating items)

Tab Links (Tahoma, bold, 11.5px, color-coded by section, with #999 services)


II.WrapElementsC.Dropdowns

Dropdown:EditorialNews Sports Opinion Classifieds Services Store ContactsLife & Entertainment

NEWS TOPICS• Business• Crime & Safety• Government & Politics at DispatchPolitics.com• Environment• Local• Legal Notices• Lottery• Medicine & Health

• Obituaries• Offbeat• Religion• Schools• Science• Special Reports• US & World• Weather• Corrections

NEWS BLOGSBROWSE BY TOPIC

• News Blog Directory

COMMENTARY• Dispatch Editor Benjamin Marrison• John Switzer

– Select a Blog —

››Today’s top News stories


COLLEGE SPORTS• Ohio State Sports at BuckeyeXtra.com

• Other Colleges

HIGH SCHOOLS• High School Sports

PRO SPORTS• NHL: Blue Jackets at BlueJacgetsXtra.com

• MLS: Crew at CrewXtra.com

• MiLB: Clippers

SPORTS BLOGSBROWSE BY SPORT

• Sports Blog Directory

COMMENTARY• Michael Arace• Bob Hunter• Rob Oller

››Today’s top Sports stories


EDITORIALS• Today’s staff editorials• Archive of staff editorials

EDITORIAL CARTOONS• Recent Jeff Stahler cartoons and archive

LETTERS TO THE EDITOR• Today’s letters and web-only letters• 30-day archive• Submit your letter

OP-ED COLUMNS• Today’s columns• 30-day archive

THE HOT ISSUE

Xyxyx xyxy xyx xy xyxy xyx xy xyxyx yxyx xyx yxyx yxyx yxy xyxyx xyxy xxyxyx?

READ COMMENTS AND POST YOUR OWN

››Today’s top Opinion stories


LIFE BLOGSBROWSE BY TOPIC

• Life & Entertaiment Blog Directory

COMMENTARY• Joe Blundo• Advice Columns• Reader Columns

LIFE TOPICS• Fashion & Style• Food at DispatchKitchen.com

• Home & Garden• Horoscopes• Pets• Puzzles• Travel

ENTERTAINMENT• Books• Celebrities• Dining• Events• Movies• Music• Television• Theater• Video Games

UPCOMING EVENTSfrom ColumbusAlive.com

Today: Xxyx xyxy xyy xyxy xyxyxyxyxyFriday: Xyxyyx xyxyyx xyxy xyxy

››Today’s top Life & Entertainment stories

Not in dropdown:

Not in dropdown:The Mailbox

Instead of editorial and column feeds, just feed The Hot Issue question.

NOT IN DROPDOWNUSA WeekendStaff Columns

• MLB: Reds & Indians• NBA: Caveliers• NFL: Bengals & Browns• Golf• Auto racing

OTHER SPORTS• Outdoors

JOE BLUNDOOR

ROBIN DAVIS



DeepDropdownMenus

• A click on a top-nav tab sends a visitor directly to the top-level Landing Page.

• Hovering reveals the dropdown, with features a prominent link to the top landing page and a menu of sublevel topics, blog dropdowns and other features.

Stylerules

Color-coded backgrounds: News: #0787A1 Sports: #BD282E Opinion: #B4BB2E Life&Ent: #D68C26

Typographyrules

Tab (Tahoma, bold, 11.5px, #fff)

Landing Page Link (Tahoma, bold, 14px, #fff, with #fff double arrow bullet and icon link to RSS feed)

Label (Tahoma, bold, all caps, 12px, #fff)

Sublabel (Helvetica, all caps, 10px, #fff)

List Links (Helvetica, 12px, #fff, with #fff disc bullets)

Affiliate Site Names (Helvetica, 10px, #fff)

Bottom Links (Helvetica, all caps, 10px, #fff)

Hover (text becomes #eee)


II.WrapElementsC.Dropdowns

Dropdown:Services


READER REWARDS

Xyxyxy xyxy xyxy xyxy xyxy xyxyyx yxyxy yxyx xyxy xyxy xyxy yxy yxy

BROWSE OTHER CONTESTS

SUBMISSIONS• Obituaries• In Memoriams• Celebration Announcements (births, ceremonies, engagements, etc.)• Entertainment Events ColumbusAlive.com• Letters to the Editor

ADVERTISING• Dispatch Media Kit• Classified Advertising at OHGetIt.com

OTHER SERVICES• Local business listings at Columbus BizList• Coupons at TheBag.com• Dispatch Events• Newspapers in Education

SUBSCRIPTIONS• The Dispatch home delivery

SELECT A PACKAGE

• Electronic Edition

CUSTOMER SERVICE• 24/7 online customer service• Live chat• Service Hotline: 1-877-734-7728

Every day

2 OSU tickets


BUCKEYE PHOTOSIn a partnership with the Ohio State University, we offers photos of players and fans.

BROWSE BY GALLERY

DISPATCH PAGESRequest prints of a particular newspaper page or select one from our historic collection.

TOP-SELLING PAGES

XYXYXYX DEALXyxyx xyxy xyxy xyxy xyxy xyxy xyxy xyxy xyxy xyxy xyxy xyxy xyxy xyxy xyxy xyxy xyxy xyxy xyxy xyxy yxyx xyyxyx yxyxyx.

CAPITAL STYLESubscribe to Capital Style magazine and learn the latest in fashion, shopping and home decor.

DISPATCH PHOTOSDispatch photographs that appear in the newspaper can also look great on your wall.

BROWSE BY GALLERY

Photos of the Year Football V-E Day



BROWSE BY

Make

Model

BROWSE BY CATEGORY

Accounting/FinanceBROWSE BY COUNTY

Franklin County

Bid on and sell collectibles and more at your local auction site.

Great bargains at local businesses every day.

Let Central Ohio’s No. 1 job source help you.

›› Hiring? Post a job now

BROWSE BY CATEGORY

Antiques

›› Post your free ad›› Selling? Place an ad ›› Selling? Place an ad

Find the car, truck or SUV that’s right for you.

Search from more than 10,000 homes, condos, rentals and lots.

Search your free local classifieds from The Dispatch at ThisWeek.

NEWSROOM• To send news tips, use our News Tip Form or call 614-461-5200.• To contact a staff member, visit our Staff Directory.• For other inquiries, use our Newsroom Contact Form, or call 614-461-5200.

ADVERTISING• For ad rates and other info, visit our Dispatch Media Kit.• For online advertising, use our self-service ad tool or call 614-469-6196.• For all advertising contacts, visit our Staff Directory. • For other inquiries, use our Advertising Contact Form visit our Staff Directory or call XXX-XXX-XXXX.

SUBSCRIPTIONS• Subscribe to The Dispatch online or call 1-877-734-7728.

CUSTOMER SERVICE• Need help? Try our live chat or 24/7 online customer service.• For service, call 1-877-734-7728.• For billing, call 1-866-790-7748.• Contact someone from our Subscriptions Staff Directory.

››Need help? Visit our FAQ page or use our Contact Form.

DeepDropdownMenus

• A click on a top-nav tab sends a visitor directly to the top-level Landing Page

• Hovering reveals the dropdown, showing a menu of sublevel topics and sites, functional dropdowns and other features.

Stylerules

Color backgrounds: #DDD

Typographyrules

Tab (Tahoma, bold, 11.5px, #333)

Label (Tahoma, bold, all caps, 12px, #333)

Sublabel (Helvetica, all caps, 10px, #333)

List Links (Helvetica, 12px, #333, with #333 disc bullets)

Search/Dropdown Labels (Helvetica, 9px, all caps, #333)

Bottom Links (Helvetica, all caps, 10px, #333)

Highlighted Links (#0787A1 (news blue))

Hover (text becomes #000)


II.WrapElementsD.Footer

Site map • Place an Ad • About Our Ads • Privacy Policy • Contacts • Store • Careers

NEWSBusinessCrime & SafetyEducationEnvironmentGovernment & Politicsat DispatchPolitics.comLocalMedicine & HealthObituariesOffbeatReligionScienceUS & WorldWeather at 10tv.com

SPORTSOhio State Sportsat BuckeyeXtra.comOther CollegesNHL: Blue Jackets at BlueJacketsXtra.com)MLS: Crew at ColumbusCrew.comMILB: ClippersMLB: Reds & IndiansNBA: CavaliersNFL: Bengals & BrownsGolfSports CommentaryHigh School Sports

OPINIONEditorialsLetters to the EditorJeff Stahler CartoonsOp-Ed Columns

LIFE TOPICSContestsFashion & StyleFood at DispatchKitchen.comHome & GardenTravelAdvice ColumnsJoe Blundo Columns

ENTERTAINMENT TOPICSBooksDiningEventsMoviesMusicTheater

CLASSIFIEDSColumbusJobsColumbusRealEstateColumbusCarsOHGetIt

SERVICESCustomer ServiceReader RewardsPlace an AdSubmissions

READER OPTIONSHome DeliveryMobile EditionElectronic (PDF) EditionAppsText-Only EditionE-NewslettersRSS Feeds

DISPATCH MEDIA GROUPBROWSE AFFILIATED SITES

WBNS-10TV

© 2011 The Dispatch Printing Company, reproduction prohibited. All Rights Reserved.



Typographyrules

Top utility links (Helvetica, 12px, #000)

Top-level topic labels (Helvetica, bold, 10px, all caps in the color that corresponds to each section)

Subsection links (Helvetica, 12px, #333)

Subsites (Helvetica, 10px, #333)

Copyright notice (Helvetica, 10px, #666)

Rules above columns (3px, #eee, solid)

**AllowenoughbottompaddingsoToolbardoesn’tcoveranycontent**


II.WrapElementsE.RightRails

HOMEPAGE NEWS SPORTS OPINION+VIDEO LIFE&ENT

300 x 250pxBox Ad

FROM THE DISPATCH BLOGS

MEDICINE + HEALTHXyxyx xyxyx xyy xx xyxyxXyxyxxyxy xyxyx xyxy yxyxyx xyxy xyxyxy yxyxy xxyxy xy xyxy xyxxyyx xyxyx yxy

THE CITYXyxyx xyxyx xyy xx xyxyxXyxyxxyxy xyxyx xyxy yxyxyx xyxy xyxyxy yxyxy xxyxy xy xyxy xyxxyyx xyxyx yxy

THE E-TEAMXyxyx xyxyx xyy xx xyxyxXyxyxxyxy xyxyx xyxy yxyxyx xyxy xyxyxy yxyxy xxyxy xy xyxy xyxxyyx xyxyx yxy

PUCK-RAKERSXyxyx xyxyx xyy xx xyxyxXyxyxxyxy xyxyx xyxy yxyxyx xyxy xyxyxy yxyxy xxyxy xy xyxy xyxxyyx xyxyx yxyy

BLOGGING THE BUCKEYESXyxyx xyxyx xyy xx xyxyxXyxyxxyxy xyxyx xyxy yxyxyx xyxy xyxyxy yxyxy xxyxy xy xyxy xyxxyyx xyxyx yxy

THE MOVIE BLOGBUSTERXyxyx xyxyx xyy xx xyxyxXyxyxxyxy xyxyx xyxy yxyxyx xyxy xyxyxy yxyxy xxyxy xy xyxy xyxxyyx xyxyx yxy

AVERAGE JOEXyxyx xyxyx xyy xx xyxyxXyxyxxyxy xyxyx xyxy yxyxyx xyxy xyxyxy yxyxy xxyxy xy xyxy xyxxyyx xyxyx yxy

SPECIAL SECTIONS

ADVERTISING• Ohio State University Special Advertising Section• Dispatch HealthCares• Columbus Marketplace• Aspire: Education• Mature Lifestyles• Money Matters• Central Ohio Home & Garden magazine

EDITORIAL• Ohio Summer Fun Guide• Columbus Crew 2010 Season Preview





ONLINE AUCTIONS from BooCoo.com

BROWSE BY CATEGORY

Antiques GO

MORE BLOGS: NEWS • SPORTS • LIFE & ENTERTAINMENT

300 x 250pxBox Ad



MOST POPULAR | MOST E-MAILED

1. Ohio State football: Purdue payback now due

2. Gay slur chanted by students at Ohio high-school football game goes unpunished

3. Boyfriend who tried to force abortion charged with attempted murder

4. Rob Oller commentary: Turner stays grounded as expectations soar

5. Is privacy dead?

6. OSU notebook: Foot infection will sideline Bryant

7. Change in store for Dublin corner

8. Bid to force abortion leads to attempted-murder charge

9. Ohio juror announces she saw the crime herself

10. Editorial: Reckless?

›› LATEST HEADLINES • TODAY’S PAPER

TOP STORY RSS FEED

TODAY’S OFFERxx% off [description of Big Deal item] at [name of local business]

BUY NOW

BIG SAVINGS.NO HASSLES.

EVERY DAY.





300 x 250pxBox Ad


MOST POPULAR




TOP STORY RSS FEED

160 x 600pxTower Ad


NEWS VIDEO (MORE VIDEOS)

MOST RECENT | MOST VIEWED | TOP RATED

[Video headlinexyxyxy xyxyyxxyxyxyxyyxyx]




[Video headline xyxyxy xy xyxy][UPLOAD DATE] (00:00)

FROM THE NEWS BLOGS

››MORE NEWS BLOGS









300 x 250pxBox Ad


MOST POPULAR




TOP STORY RSS FEED

160 x 600pxTower Ad


SPORTS VIDEO (MORE VIDEOS)







FROM THE SPORTS BLOGS

››MORE SPORTS BLOGS





300 x 250pxBox Ad






MOST POPULAR




TOP STORY RSS FEED

160 x 600pxTower Ad















300 x 250pxBox Ad


MOST POPULAR




TOP STORY RSS FEED

160 x 600pxTower Ad


LIFE & ENTERTAINMENT VIDEO (MORE VIDEOS)







FROM THE LIFE & ENTERTAINMENT BLOGS

››MORE LIFE & ENTERTAINMENT BLOGS






BRIEFS

300 x 250pxBox Ad


MOST POPULAR




TOP STORY RSS FEED

160 x 600pxTower Ad


II.WrapElementsE.RightRails

MISC*

300 x 250pxBox Ad






MOST POPULAR




TOP STORY RSS FEED

160 x 600pxTower Ad











TODAY’S TOP VIDEO (MORE VIDEOS)







*Miscincludes:• Today’s Paper• Latest Headlines• Photos• Podcasts• Contacts• Services• Classifieds


II.WrapElementsE.RightRailComponents

ONLINE AUCTIONS from BooCoo.com

BROWSE BY CATEGORY

Antiques GO

MOST POPULAR MOST E-MAILED





5. Is privacy dead?






›› LATEST HEADLINES ›› TODAY’S PAPER

TOP STORY RSS FEED

MOST POPULAR MOST E-MAILED





5. Is privacy dead?






›› LATEST HEADLINES ›› TODAY’S PAPER

TOP STORY RSS FEED

MostPopularList

• Toggles to show Dispatch.com’s Most E-Mailed Stories

• Appears in Right Rail of every page

• Flexible width depending on ad size (300px or 120px wide)

FacebookBox

• Promotes Facebook Fans of The Columbus Dispatch (not fans of individual sections/pages)

• Appears in Right Rail of homepage and blog pages

TheBigDealPromoBox

• Uses a feed to promote each day’s “Big Deal”

• Appears in Right Rail of homepage only

BooCooAuctionsPromoBox

• Promotes BooCoo Auctions, per contract

• Appears in Right Rail of homepage only

TheBagCouponsPromoBox

• Promotes coupons from The Bag

• Appears in Right Rail of all pages


Show All (175)



TODAY’S OFFERxx% off [description of Big Deal item] at [name of local business]

BIG SAVINGS.NO HASSLES.

EVERY DAY.

Typographyrules

Label: Active (Tahoma, bold, 12px, #666)

Label: Inactive (Tahoma, bold, 12px, #ccc)

Label: Affiliate Name (Tahoma, bold, 12px, #999)

Headlines (Georgia, 14px, #666)

Numbers (Tahoma, bold, 14px, #000)

Bottom links (Helvetica, all caps, 10px, #000, with #666 double arrow bullets or RSS logo)

Search description (Helvetica, all caps, 9px, #333)












FROM THE LIFE & ENTERTAINMENT BLOGS

››MORE LIFE & ENTERTAINMENT BLOGS





FROM THE NEWS BLOGS

››MORE NEWS BLOGS





FROM THE SPORTS BLOGS

››MORE SPORTS BLOGS





BlogPromos

• Promotes blogs specific to Top-Level section (if applicable)

• Appears in Right Rail of every page but Blog and Blog Index pages

Blog feeds for News, Sports and Life section Right Rails:

Blog feeds for Homepage, Opinion, Video and Misc Right Rails:

Typographyrules

Label (Tahoma, bold, 12pxNews: #0787A1; Sports: #BD282E; Life&Ent: #D68C26, All Blogs: #666)

Blog topic (Helvetica, bold, all caps, 10px, color-coded by section in All Blogs and #666 in blogs sorted by topic)

Headlines (Georgia, 14px, #000)

Abstract text (Georgia, 12px, #333)

Bottom links (Helvetica, 10px, #000 all caps with color-coded double arrow bullets)

Hover state (bottom border: 1px, #999, dotted)



SPECIAL SECTIONS

ADVERTISING• Ohio State University Special Advertising Section• Dispatch HealthCares• Columbus Marketplace• Aspire: Education• Mature Lifestyles• Money Matters• Central Ohio Home & Garden magazine

EDITORIAL• Ohio Summer Fun Guide• Columbus Crew 2010 Season Preview

›› MORE SPECIAL SECTIONS

LIFE & ENTERTAINMENT VIDEO ›› MORE VIDEOS


[Video headxyxyxy xyxyyxxyxyxyxyyxyx]




••••• ••••• ••••• •••••


››

NEWS VIDEO ›› MORE VIDEOS






••••• ••••• ••••• •••••


››

TODAY’S TOP VIDEO ›› MORE VIDEOS






••••• ••••• ••••• •••••


››

SPORTS VIDEO ›› MORE VIDEOS






••••• ••••• ••••• •••••


››

VideoPlayers

• Promotes and plays video, using different channels to match up with top-level section (if applicable)

• Appears in Right Rail for every page, except Homepage, Opinion and Video

SpecialSectionsPromo

• Promotes advertising and editorial special sections

• Appears in Right Rail of Homepage only

• Content added manually, with a Shows most recent video and toggles to show most viewed and top rated.This player appears within the Center Content of the Homepage, and within the Right Rail of the Blogs and Misc pages.

Appear on News, Sports and Life Right Rails. Show videos from corresponding channels.

Typographyrules

Label (Tahoma, bold, all caps, #666, 12px)

Link in Label (Helvetica, all caps, #000, 10px)

Sublabel (Helvetica, all caps, #333, 10px)

List (Helvetica, #333, 12px, with #666 disc bullets)

Typographyrules

Video Headline (Georgia, bold, #fff, 14px)

Video Data (Helvetica, bold, #fff, all caps, 9px)

Sublabels: Active (Helvetica, bold, #666, all caps, 10px)

Sublabels: Inactive (Helvetica, bold, #ccc, all caps, 10px)

Carousel headlines (Helvetica, #333, 10px)

Status

TBD


OtherStoriesinSection

• provides list of stories from the specific sub-section topic

BlogFeed

• RSS feed provides headline and abstract from most recent blog entry

• Appears in Left Rail of stories that have a corresponding blog

• Includes blog logo

AffiliateFeed

• Promotes headlines from Dispatch.com affiliates (10tv, ONN, ThisWeek, Capital Style, Alive!) when they share story’s topic

• List or RSS feed

• Includes logo variation

II.WrapElementsF.LeftRailComponents

MORE STORIES from [affiliate.com]

›› Xyxyx xyxy xyxy xyxyyxyxy xyxy xyxy

xyxy xyxyxyyxyxy xyxy xyxy xyxyyxyx

›› Xyxyx xyxyx xyxyx xyxy xy xx xyxyx xyxy xyxyxy xyxyx

›› Xyxyx xyxyx xyxyx xyxy xy xx xyxyx



[TOPIC] BLOG

Xyxyxy xyxy xyx xyx xyxy xyxy xyxy

Xyxyx xyxy xyx xyxy xyx xyxy xyx yxyx yxyx xyx yxyx

yxyxy xyxy xyxy xyxy xyxy xyxy xyxy xyxy xyxy xyxy xyxy xyx yxyx yxyxyxyx yxyx xyxy xyyxyxyxyxy.

›› READ ENTIRE BLOG

MORE [NAME OF TOPIC] HEADLINES





›› Xyxyx xyxyx xyxyx xyxy xy xx xyxyxMORE [NAME OF SECTION]

Typographyrules

Label (Tahoma, bold, all caps, 12px, 100% line-height, with appropriate color-coding)

Label: Affiliate Name (12px #999 Tahoma bold)

Headline without Abstract (Georgia, #333, 16px, 120% line-height, with double arrow bullet in appropriate color)

Headline with Abstract (Georgia, #000, 18px, 120% line-height, without double arrow bullet in appropriate color)

Abstract (Georgia, #333, 12px, 140% line-height)

Bottom Link (Helvetica, #000, 10px, 100% line-height, all caps (if with abstract, add double arrow bullet))

PodcastPromo

• Promotes a podcast that shares the same topic as the story

• A 140px-wide player with headline and abstract

• A link to the Podcast

[TOPIC] PODCAST

[Headline for related podcast]Xyxyx xyxy xyx xyxy xyx xyxy xyx yxyx yxyx xyx yxyx yxyxy xyxy xyxy xyxy xyxy xyxy xyxy xyxy xy.

›› MORE PODCASTS

00:00


OtherFeaturesPromo

• A list of links promoting related pages, blogs, databases, stat pages or other features that don’t warrant their own standalone promos.

• Text is hard-coded

• Uses disc bullets and Graphic Text

E-NewsletterPromo

• Promotes E-mail Newsletters that share same topic as the story

• Text is hard-coded with E-Newsletter logo

DatabasePromo

• Promotes databases that are related to the story’s topic

• Text is hard-coded with possible art element

BizListRelatedSearchBox

• Promotes BizList by offering search of local businesses that share story’s topic (Travel, Home & Garden)

Use Columbus BizList to find a [related business topic] near you.

[RELATED TOPIC] SEARCH

ENTER KEYWORD

ENTER ZIP CODE

[TOPIC] DATABASE

[Headline for related database]Xyxyx xyxy xyx xyxy xyx xyxy xyx yxyx yxyx xyx yxyx yxyxy xyxy xyxy xyxy xyxy xyxy xyxy xyxy xyxy xyxy xyxy xyx yxyx yxyxyxyx yxyx xyxy xyyxyxyxyxy.

›› MORE DATABASES

GET E-MAIL UPDATES

Newsletter headline xyxyxyx

Xyxyx xyxy xyx xyxy xyx xyxy xyx yxyx yxyx xyx yxyx

yxyxy xyxy xyxy xyxy xyxy xyxy xyxy xyxy xyxy xyxy xyxy xyx yxyx yxyxyxyx yxyx xyxy xyyxyxyxyxy.

OTHER [TOPIC]FEATURES

• Link to another page• Link to a less-prominent blog or database• Link to sports stats, etc.• Xyxyx xyxy xyxyxyxy• Xyxyxyxyxyxyxy xyxyx


Typographyrules


Headline with Abstract (Georgia, #000, 18px, 120% line-height, without double arrow bullet in appropriate color)

Abstract (Georgia, #333, 12px, 140% line-height)

Bottom Link (Helvetica, #000, 10px, 100% line-height, all caps (if with abstract, add double arrow bullet)

Other Features unordered list (Helvetica, #666, 140% line-height, with single bullet in appropriate color)

Buttons are images



The Dispatch Electronic EditionYou can read The Colum-bus Dispatch on your computer and it looks just like our print newspaper!

• It’s all searchable.

• You’ll see all the news and advertisements.

• You get the comics.

Dispatch.com and the Electronic Edition are free to print subscribers of The Columbus Dispatch newspaper and as part of a $7.95/month web-only subscription.

Subscribe to The Dispatch and save!• Every day: Save 25% off the retail price

• Thursday–Sunday: Save 20% off the retail price

• Sunday: An average of more than $200 in cou-pons each week!

Already a subscriber? Enroll in EZPay and get a free gift! Enroll now

The Dispatch for your iPadYou can read The Colum-bus Dispatch on your iPad and it looks just like our print newspaper!

• Xyxyxyx xyxyxyxyx



Dispatch.com and the Xyxyxyxyxyx are free to print subscribers of The Columbus Dispatch newspaper and as part of a $7.95/month web-only subscription.

NewspaperSubscriptionPromo

• Encourages readers to subscribe to print edition of The Columbus Dispatch

• Includes link to EZPay

• Text is hard-coded with

APStoryFeed

• Promotes Associated Press stories that are on the same topic as the story

• Uses AP feed

ElectronicEditionSubscriptionPromo

• Encourages readers to subscribe to Electronic Edition

• Text is hard-coded with imagery

AppPromo

• Encourages readers to Download Dispatch.com apps

• Text is hard-coded with imagery

[TOPIC] HEADLINES FROM AP






Typographyrules

Promo Headline (Georgia, normal, #0787a1 (news blue), 18px, 120% line-height)

Intro Text (Georgia, #333, 12px, 140% line-height)

Details Text (Helvetica, #666, 12px, 140% line-height)

Buttons are images

Typographyrules


Affiliate Name (#999)

Headlines (Georgia, normal, #333, 16px, 120% line-height, with double arrow bullet in appropriate color)


III.LandingPagesA.PageHeaders





300 x 250pxBox Ad

MOST POPULAR


TODAY’S PAPER

TOP STORY RSS FEED

160 x 600pxTower Ad


[Video headline xyxyxy xy xyxy]





Walking the walkCentral Ohio schoolkids 'hoof it' as part of effort to promote safe routes, fitnessTHURSDAY, OCTOBER 7, 2010 02:54 AM

Ten minutes after sunrise yesterday, Kate Stone was jumping up and down over the experience that lay ahead. For the first time in her 7-year-old life, she was walking to school instead of riding the bus. 'It's going to be fun,' she said during a jumping break. 'It gets you more exercise, and you get to see more sights and friends.'Her 5-year-old brother, Ben, also had high hopes for what he would encounter on the way to Evening Street Elementary School in Worthington.

››MORE SCHOOL NEWS

SCHOOLS CRIME & SAFETY

››Man kills himself during hostage standoff

››DUI crackdown set for holiday weekend

››Trucker guilty in abuse of corpse

››CVS robber gets 29 years for drug theftsMORE CRIME & SAFETY

News BusinessCrime & SafetyDispatchPolitics.com

Health & MedicineLocalObituaries

SchoolsUS & World7-Day Story Archive›




Hot Links:

Search



300 x 250pxBox Ad





MOST POPULAR


TODAY’S PAPER

TOP STORY RSS FEED

160 x 600pxTower Ad









M SPORTS

DISPATCH EDITORIALS

Editorial: For Ohio HouseThree incumbents, one newcomer would serve central Ohioans wellAs noted in the legislative endorsements Tuesday in this space, this year's race for the Ohio House of Representatives features some strong candidates and incumbents from Columbus and its suburbs who, working together, could make for a very effective central Ohio delegation:

Editorial: Changing courseDropping union-only requirement should cut costs of schools projectThe delay is unfortunate, but the public still will benefit from the Ohio School Facili-ties Commission's decision to skip the project-labor agreement when it seeks new bids for rebuilding the state schools for the deaf and the blind in Columbus.

››DISPATCH ENDORSEMENTS ››MORE EDITORIALS

Opinion EditorialsStahler Cartoons

Letters to the EditorOp-Ed Columns

The Hot Issue7-Day Story Archive›

CONNECT WITHOPINION

LETTERS TO THE EDITOR

• Today's letters

• 30-day archive

• Web-only letters

Get our RSS feed

Follow us on Twitter

Connect on Facebook

Send us an e-mail

Get our RSS feed


Connect on Facebook

Send us an e-mail




Hot Links:

Search







300 x 250pxBox Ad

MOST POPULAR


TODAY’S PAPER

TOP STORY RSS FEED

160 x 600pxTower Ad



FROM THE SPORTS BLOGSXYXYXYYXYXYXYXYXyxyx xyxyx xyy xx xyxyx Xyxyxxyxy xyxyx xyxy yxyxyx xyxy xyxyxy yxyxy xxyxy xy xyxy xyxx yxy




MLB: REDS & INDIANS

Phillies 4, Reds 0: Halladay ho-hum about his gemTHURSDAY, OCTOBER 7, 2010 02:54 AM

PHILADELPHIA - Nearly an hour after pitching the game of his life for the second time this season, Roy Halladay walked through the Philadelphia Phillies clubhouse. No one spoke to him as he made his way to his locker in the corner.

A sheet of white paper was taped up there, the first few paragraphs of a breaking news story someone printed out. "Phillies' Roy Halladay throws playoff no-hitter," the headline said.

››MORE MLB: REDS & INDIANS STORIES

Sports ›

OTHER TOPSTORIES

››Rob Oller commentary: Forget past or future, Clarett rooted in present

››New day for OSU hockey

››Crew: Defensive mis-steps costly in Open Cup

Get our RSS feed


Connect on Facebook

Send us an e-mail

Get our RSS feed


Connect on Facebook

Send us an e-mail

CONNECT WITHSPORTS




Hot Links:

Search







300 x 250pxBox Ad

MOST POPULAR


TODAY’S PAPER

TOP STORY RSS FEED

160 x 600pxTower Ad



FROM THE LIFE & ENTERTAINMENT BLOGSFROM THE LIFE & ENTERTAINMENT BLOGSXYXYXYYXYXYXYXYXyxyx xyxyx xyy xx xyxyx Xyxyxxyxy xyxyx xyxy yxyxyx xyxy xyxyxy yxyxy xxyxy xy xyxy xyxx yxy




Life&EntertainmentJoe Blundo Commentary • Events • Horoscopes • Puzzles ››Contests • 7-Day Story Archive

THEATER

››Theater Review | ‘Last Smoker in America’: Cartoon-ish musical has many fine featuresTHURSDAY, OCTOBER 7, 2010 02:54 AM

››Goal-centered senior juggles responsibilities with flairTHURSDAY, OCTOBER 7, 2010 02:54 AM

››New seasons raise curtains on trio of celebrationsTHURSDAY, OCTOBER 7, 2010 02:54 AM

EVENTS


Hot Links:


Xyxyxyxyx xyxyxyxy

160 x 30px ad

20px

15px15px

Top-LevelLandingPages

Typographyrules

Top-Level Section Name (Tahoma, bold, 55px, #000)

Section Header Links (Helvetica, 12px, #999)

Arrow Separator (55px, #eee)


III.LandingPagesA.PageHeaders





300 x 250pxBox Ad

MOST POPULAR


TODAY’S PAPER

TOP STORY RSS FEED

160 x 600pxTower Ad







Science&EnvironmentHome ›› News

Get our RSS feed


Connect on Facebook

Send us an e-mail

CONNECT WITHSCIENCE

FOULED BY FARMSA three-day investigative series VIEW STORY INDEX

DispatchScience




Hot Links:

Search



300 x 250pxBox Ad





MOST POPULAR


TODAY’S PAPER

TOP STORY RSS FEED

160 x 600pxTower Ad









M SPORTS

TODAY’S LETTERS

Mandel cast bad light on RepublicansAs a Republican, I have never been more ashamed of an elected official than I was when I recently viewed a TV advertisement by state Rep. Josh Mandel, who is running for state treasurer (“Controversial Mandel attack ad now off air,” Dispatch article, Saturday).

Track bad for Franklinton revitalizationAt a Franklin County Consortium for Good Government candidate forum, I was surprised to hear Franklin County Commissioner Marilyn Brown make an inaccurate statement.

U.S. wastes money intended for needyI agree with Harry Bartow regarding obligations, especially as Christians, to help the sick and the needy (letter, Sept. 30). I simply disagree on how this is accomplished.

Candidates should take polygraph testDuring this political season when we are being inundated with political ads on televi-sion and in the mail, I have a suggestion to help us see through the smoke and mirrors of these ads.

Strickland has failed to bring jobs to OhioWe respond to the Wednesday Dispatch article “Clean energy, good jobs,” and the plan for solar energy promoted by Gov. Ted Strickland. We found this astounding, because it will not employ Ohioans but, rather, two Spanish companies.

Runners would enjoy support at marathonThe Columbus marathon and half-marathon will be Sunday, starting at 7:30 a.m. at Broad and Third streets. I invite area people to come Downtown to watch the more than 14,000 people run the streets of Columbus and several suburbs.

››VIEW 30-DAY ARCHIVE OF LETTERS

Letters to the Editor

LETTERS POLICY

The Dispatch welcomes letters to the editor from readers. Typed letters of 200 words or fewer are preferred; all might be edited. Each letter must include name, home address and daytime phone number.

Dispatch.com also posts letters that don’t make it to print in The Dispatch.

MAIL

Letters to the EditorThe Dispatch34 S. 3rd St.Columbus, OH 43215

E-MAIL

[email protected](No attachments, please)

FAX614-461-8793

EDITORIAL PAGE EDITOR

Glenn Sheller (614-461-5072)

ALSO IN OPINION

• Editorials

• Stahler Cartoons

• Op-Ed Columns

Home ›› Opinion

CONNECT

Get our RSS feed


Connect on Facebook

Send us an e-mail




Hot Links:

Search







300 x 250pxBox Ad

MOST POPULAR


TODAY’S PAPER

TOP STORY RSS FEED

160 x 600pxTower Ad



FROM THE SPORTS BLOGSXYXYXYYXYXYXYXYXyxyx xyxyx xyy xx xyxyx Xyxyxxyxy xyxyx xyxy yxyxyx xyxy xyxyxy yxyxy xxyxy xy xyxy xyxx yxy




NFL: Bengals&BrownsHome ›› Sports

AROUND THE NFL

• NFL Scoreboard• Standings• League Leaders

NFL HEADLINES

›› NFL notebook: Three fined; sus-pensions up nextWEDNESDAY, OCTOBER 20, 2010

›› NFL notebook: Collins comes off bench to spark TitansTUESDAY, OCTOBER 19, 2010

›› NFL: Headhunt-ers may lose play-ing time and payTUESDAY, OCTOBER 19, 2010

›› Sports wireTUESDAY, OCTOBER 19, 2010

›› NFL roundupMONDAY, OCTOBER 18, 2010

›› NFL: How former Buckeyes faredMONDAY, OCTOBER 18, 2010

›› Branch quickly catches on in return to PatriotsMONDAY, OCTOBER 18, 2010

›› Roethlisberger returns, but is his rehab complete?SUNDAY, OCTOBER 17, 2010

›› Today's TV gamesSUNDAY, OCTOBER 17, 2010

›› NFL standingsSUNDAY, OCTOBER 17, 2010

›› Sports wireSATURDAY, OCTOBER 16, 2010

Get our RSS feed


Connect on Facebook

Send us an e-mail

Get our RSS feed


Connect on Facebook

Send us an e-mail

CONNECT WITHSPORTS

MICHAEL ARACE COMMENTARY




Hot Links:

Search







300 x 250pxBox Ad

MOST POPULAR


TODAY’S PAPER

TOP STORY RSS FEED

160 x 600pxTower Ad



FROM THE LIFE & ENTERTAINMENT BLOGSXYXYXYYXYXYXYXYXyxyx xyxyx xyy xx xyxyx Xyxyxxyxy xyxyx xyxy yxyxyx xyxy xyxyxy yxyxy xxyxy xy xyxy xyxx yxy




MOVIE REVIEWS & TRAILERS ››MORE VIDEOS

Reel Talk Review: Going the DistanceAUG. 24, 2010 (04:01)


Trailer: Xyxyx Xyxyx xyxyxyxyxxyxyxyx


Reel Talk: Xyxyx Xyxyx xyxyxyxyxxyxyxyx


••••• ••••• ••••• •••••

Reel Talk: Xyxyx Xyxyx xyxyxyxyxxyxyxyx


••••• •••••

Showtimes at ColumbusAlive.com 7-Day index of Life & Entertainment stories›




Hot Links:

Search



MoviesHome ››Life & Entertainment

20px

15px

10px

15px

Secondary-LevelLandingPages

Typographyrules

Secondary-Level Section Breadcrumbs (Tahoma, bold, 14px, in color based on top level, with 12px #ccc double arrow bullets)

Secondary-Level Section Name (Tahoma, bold, 40px, #000)

Section Header Links (Helvetica, 12px, #999)

Arrow Separator (40px, #eee)


III.LandingPagesB.LeadStoryOptions

LEADSTORyVARIATIONSLARGEHORIzONTALPHOTO

TypographyrulesforLeadStoryPackages

Photo (Image has no border, could link to a larger version via lightbox or to the Dispatch Photo Store, where it can be purchased)

Photo Credit (Helvetica, all caps, 8px, #999)

Photo Caption (Helvetica, 12px, #666)

Photo Caption Link (Helvetica, all caps, 10px, #000, could link to Dispatch Photo Store, or to a Slideshow)

Headline (Georgia, 38px, #000, links to story page)

Subhead (Helvetica, bold, 16px, #666)

Timestamp (Helvetica, all caps, 9px, #666)

Update (Tahoma, bold, all caps, 9px, #000)

Abstract (Georgia, 12px, #333)

Bottom links (Helvetica, all caps, 10px, #000, with appropriate icons that will be color-coded by top-level section)

Label (Tahoma, bold, 12px, in topic color)

list headline (Georgia, 16px, #333)



Hover state (bottom border: 1px, #999, dotted)

Headline lorem ipsum dolor sit ayet consgctetur elitgSubhead ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit omnis iste natus error sit voluptatemUPDATED 3:25 PM FRIDAY, NOVEMBER 26, 2010 02:54 AM

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia.

WATCH THE VIDEO • SEE MORE PHOTOS • LISTEN TO THE AUDIO

[NAME OF PHOTOGRAPHER] | DISPATCH

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore tatom rem aperiam eaque. BUY THIS PHOTO

MORE [TOPIC] HEADLINES

››Headline lorem ipsum dolor sit amet ut perspiciatis unde errorFRIDAY, NOVEMBER 26, 2010 02:54 AM






7-DAY ARCHIVE OF [TOPIC] STORIES

5px

15px

10px

10px15px

20px

10px15px



LEADSTORyVARIATIONSMUGSHOT

LEADSTORyVARIATIONSLARGEVERTICALPHOTO

Headline lorem ipsum dolor sit ayet consgctetur elitgUPDATED 3:25 PM FRIDAY, NOVEMBER 26, 2010 02:54 AM


WATCH THE VIDEO










Headline lorem ipsum dolor sit ayet consgctetur elitgSubhead ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit omnis iste natus error sit voluptatem

UPDATED 3:25 PM FRIDAY, NOVEMBER 26, 2010 02:54 AM










Lorem ipsum dolor sit


LEADSTORyVARIATIONSSMALLVERTICAL/MAP

LEADSTORyVARIATIONSSMALLHORIzONTALPHOTO











Headline lorem ipsum dolor sit ayet consgctetur elitgUPDATED 3:25 PM FRIDAY, NOVEMBER 26, 2010 02:54 AM

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia.

WATCH THE VIDEO






















LEADSTORyVARIATIONSNOART


III.LandingPagesC.DownpageStories

SecondaryStoriesonLandingPages• Because they are promoting so much content, the Top-Level Landing Page (News, Sports, Opinion, Life&Entertainment) give greater prominence to select stories downpage. Here are some options:

Lorem ipsum defacto lunecy blah togra baffo yoFRIDAY, SEPTEMBER 3, 2010 3:14 AM

WASHINGTON - Rep. Tim Ryan hails from the blue-collar, Democratic stronghold of the Mahoning Valley, but the Niles Democrat is a good example why President Barack Obama might fail to persuade Congress to go along with not extending tax cuts for the most-affluent Americans.

››Lorem ipsum defacto lunecy blagoyo





MORE [SUBLEVEL TOPIC]

[SUBLEVEL TOPIC]

CREDITLINE XYXYXYXY


WASHINGTON - Rep. Tim Ryan hails from the blue-collar, Democratic stronghold of the Mahoning Valley, but the Niles Democrat is a good example why President Barack Obama might fail to persuade Congress to go along with not extending tax cuts for the most-affluent Americans.







[SUBLEVEL TOPIC]


WASHINGTON - Rep. Tim Ryan hails from the blue-collar, Democratic stronghold of the Mahoning Valley, but the Niles Democrat is a good example why President Barack Obama might fail to

persuade Congress to go along with not extending tax cuts for the most-affluent Americans.







[SUBLEVEL TOPIC]

10px

10px

10px

5px10px

10px

10px

10px

10px

15px

15px

15px

15px

15px

15px

SECONDARySTORyVARIATIONSNOART HORIzONTALPHOTO

WITHMUGSHOT TypographyrulesforSecondaryStoryPackages

Secondary Headline (Georgia, 24px, #000)

Subhead (Helvetica, 16px, #666)



Abstract (Georgia, 12px, #333)

Bottom links (Helvetica, all caps, 10px, #000)

Photo Credit (Helvetica, all caps, 8px, #999)

Photo Caption: No caption for Secondary Story Packages


III.LandingPagesD.ListOptions

Listvariations

Typographyrules

HEADLINES WITH ABSTRACT:


Headline (Georgia, 18px, #000)




Abstract (Georgia, 12px, 140% line-height, #333)

Bottom link (Helvetica, all caps, 10px, #000, with double arrow bullet in top-level section color)

Hover state (bottom border: 1px #999 dotted)

Typographyrules

HEADLINES WITHOUT ABSTRACT:





Bottom link (Helvetica, all caps, 10px, #000, without double arrow bullet)

Hover state (bottom border: 1px #999 dotted)

• Label color matches top-level topic (News, Sports, Opinion, Life&Ent), which also serves as a link to the sub-level topic landing page

• Headline and any art will link to story page

TOPIC LOREM

Headline lorem ipsum dolor sit aymetSubhead orem ipsum dolor sit amet, con-sectetur adipiscing elitUPDATED 3:15 A.M. XYXYXYXYXYYXY XX, XXXX

Abstract lorem ipsum dolor sit amet, consecte-tur adipiscing elit. Pha-sellus interdum ullamcor-per volutpat. Proin sit amet risus a velit faucibus venenatis eget quis sem. Vestibulum in dolor non quam faucibus eleifend blandit ut mi.

›› LINK LOREM IPSUM

TOPIC LOREM

››Headline lorem ipsum dolor sit amyetUPDATED 3:15 A.M. XYXYXYXYXYYXY XX, XXXX



LINK LOREM IPSUM

TOPIC LOREM

››Headline lorem ipsum dolor sit amet


››Headline lorem ipsum dolor sit ametLINK LOREM IPSUM

TOPIC LOREM

Headline lorem ipsum dolor sit agymetUPDATED 3:15 A.M. XYXYXYXYXYYXY XX, XXXX

Abstract lorem ipsum dolor sit amet, con-sectetur

adipiscing elit. Phasellus interdum ullamcorper volutpat. Proin sit amet risus a velit faucibus venenatis eget quis sem. Vestibulum in dolor non quam faucibus eleifend blandit ut mi.


TOPIC LOREM

Headline lorem ipsum dolor sit aymetAbstract lorem ipsum dolor sit amet, consecte-tur adipiscing elit. Pha-sellus interdum ullamcor-per volutpat. Proin sit amet risus a velit faucibus venenatis eget quis sem. Vestibulum in dolor non quam faucibus eleifend blandit ut mi.


TOPIC LOREM

Headline lorem ipsum dolor sit aymetSubhead orem ipsum dolor sit amet, con-sectetur adipiscing elitUPDATED 3:15 A.M. XYXYXYXYXYYXY XX, XXXX

Abstract lorem ipsum dolor sit amet, consecte-tur adipiscing elit. Pha-sellus interdum ullamcor-per volutpat. Proin sit amet risus a velit faucibus venenatis eget quis sem. Vestibulum in dolor non quam faucibus eleifend blandit ut mi.


TOPIC LOREM




LINK LOREM IPSUM

TOPIC LOREM



››Headline lorem ipsum dolor sit ametLINK LOREM IPSUM

TOPIC LOREM

Headline lorem ipsum dolor sit agymetUPDATED 3:15 A.M. XYXYXYXYXYYXY XX, XXXX

Abstract lorem ipsum dolor sit amet, con-sectetur

adipiscing elit. Phasellus interdum ullamcorper volutpat. Proin sit amet risus a velit faucibus venenatis eget quis sem. Vestibulum in dolor non quam faucibus eleifend blandit ut mi.


TOPIC LOREM

Headline lorem ipsum dolor sit aymetAbstract lorem ipsum dolor sit amet, consecte-tur adipiscing elit. Pha-sellus interdum ullamcor-per volutpat. Proin sit amet risus a velit faucibus venenatis eget quis sem. Vestibulum in dolor non quam faucibus eleifend blandit ut mi.


Headline

Subhead

Timestamp

Abstract

(1) (2) (4)(3) (5)

Headline

Timestamp

Abstract

Headline

Timestamp

HeadlineHeadline

Abstract

10px

5px

10px

15px

15px

20px

15px


III.LandingPagesE.CarouselsStoryCarousel

• Promotes stories with a longer shelf life, such as weekly Life & Entertainment sections and Special Reports

• Text is hand-coded with consistently sized art

EventCarousel

• Promotes featured events from Columbus Alive’s calendar

• Text is from a feed

• Carousel scrolls horizontally using jQuery

LIFE & ENTERTAINMENT ›› MORE STORIES

[Section Name]Xyxyxy xyxyxy xyxyx xyxy xyxy xyxyx xyxyxy xyxyxy xyxyxyx xyx xyxy xyxyxxy xyxyxy xyxyx xyxyx xxyxy








›› NEXTPREV

SPECIAL REPORTS ›› MORE STORIES

[Series Name]Xyxyxy xyxyxy xyxyx xyxy xyxy xyxyx xyxyxy xyxyxy xyxyxyx xyx xyxy xyxyxxy xyxyxy xyxyx xyxyx xxyxy




›› NEXTPREV

Typographyrules

Label (Tahoma, bold, all caps, 12px, color based on top-level section)

More stories link (Helvetica, all caps, 10px, #000, with #000 double arrow bullet)

Prev/Next (Helvetica, bold, all caps, 10px, #CCC, with 16px #CCC single arrow directions and line)

Series/Section name (Tahoma, bold, 14px, #666)

Description (Helvetica, 12px, #333)

Typographyrules

Label (Tahoma, bold, all caps, 12px, life orange)

Affiliate Name (#999, upper and lower case)

Date label (Helvetica, bold, all caps, 12px, #000)

Event name (Tahoma, bold, 14px, #666)

Location (Helvetica, normal, 12px, #000)

Description (Helvetica, 12px, #666)

More events link (Helvetica, all caps, 10px, #000)

Prev/Next (Helvetica, bold, all caps, 10px, #CCC, with 16px #CCC single arrow directions and line)

10px

10px

HELVETICA BOLD 10PX

Tahoma B #666 14#000 Event Location: #666 Helvetica 12px description of event goes right here goes right ...

XXXDAY

Ray Charles TributeLincoln Theatre: Black History Month celebration featuring performances by Roger Hines, Stan ...

XXXDAY

Clash of the TitansSkully’s Music Diner: Beat competition between Supanatra, A.U. B Banga, and others.

FEATURED EVENTS from ColumbusAlive.com

MORE EVENTS AT COLUMBUSALIVE.COM | SUBMIT YOUR EVENTS

›› NEXTPREV15px

15px

10px

5px


CONNECT WITH USCONNECT WITH US

FacebookTwitterE-NewslettersRSS FeedsMobile Text Alerts

CONNECT WITH USCONNECT WITH USFacebookTwitterE-NewslettersRSS FeedsMobile Text Alerts

ALSO CONNECT WITH[SECTION TOPIC]ALSO CONNECT WITH[SECTION TOPIC]



Follow [Section Topic] on Twitter



Twitter feedgoes here

Facebook Like Boxgoes here


10px

10px

20px

20px

20px

3px space

3px space1px #eee line

12px icon}

MosthaveDispatchlinksonly:

Ifsubtopichasfacebookandtwitter,facebookonly,ortwitteronly:

III.LandingPagesF.ConnectBox

ConnectBox• Appear at the top of the left rail on Top and Sub-topic Landing pages only.• If a Sub-topic landing page has its own Facebook and/or Twitter accounts, then they will be listed below the traditional Connect Box, with a Facebook Like Box or Twitter Feed.

Typographyrules• Label color matches top-level topic (News, Sports, Opinion, Life&Ent)• Text is 12px Helvetica normal #666, becoming #000 on hover• “Also Connect With” label is 10px Helvetica bold all caps #666

CONNECT WITH USCONNECT WITH US

FacebookTwitterE-NewslettersRSS FeedsMobile Text Alerts





Follow [Section Topic] on Twitter



Twitter feedgoes here



10px

10px

20px

20px

20px

3px space

3px space1px #eee line

12px icon}


IV.StoryPagesA.StoryPageOptions

NOIMAGES LARGEHORIzONTALIMAGE

620px wide image



LARGEVERTICALIMAGE SqUAREIMAGE

300px wide image

460px wide image


VIDEOPLAyERSMALLIMAGE

Note:AlloftheseStoryOptionsmighthavetheoptionofamulti-pagelayoutforespeciallylengthystories


620px wide video player

140px wide image


Home ››News ›› [2ndLevel] ›› [3rdLevel]

Home ››Sports ›› [2ndLevel] ›› [3rdLevel]

Home ››Opinion ›› [2ndLevel] ›› [3rdLevel]

Home ››Life & Entertainment ›› [2ndLevel] ›› [3rdLevel]

By Name O. ReporterThe Columbus Dispatch • Xyxyxday, Month XX, XXXX 00:00 AM

Comments: XX Recommend: XX Share: XX Tweet: XX

By Name O. ReporterThe Columbus Dispatch • Xyxyxday, Month XX, XXXX 00:00 AMUPDATED: Xyxyxday, Month XX, XXXX 00:00 AM


By Name O. ReporterAssociated Press • Xyxyxday, Month XX, XXXX 00:00 AM


The Columbus Dispatch • Xyxyxday, Month XX, XXXX 00:00 AM


By Name O. Reporter and Name O. Reporter2The Columbus Dispatch • Xyxyxday, Month XX, XXXX 00:00 AM


By Name O. Reporter, Name O. Reporter2 and Name O. Reporter2The Columbus Dispatch • Xyxyxday, Month XX, XXXX 00:00 AM


IV.StoryPagesB.StoryPageComponents

Breadcrumbs

• Shows readers where a story falls within the site’s hierarchy

• Links readers to the story’s parent subsection and top-level section landing pages

Byline/Timestamp/CommentandRecommendCounter

• Identify’s story’s author and affiliation, with name serving as link to e-mail (later: to author page). Also serves as a timestamp with possible update stamp. And a counter for comments, Facebook recommendations, Facebook shares and Tweets.

STANDARD

NON-DISPATCH (no name link)

NO BYLINE (just affiliation)

MULTIPLE DISPATCH BYLINES

MULTIPLE BYLINES (mixed affiliations)

UPDATED TIMESTAMP

Typographyrules

Links (Helvetica, normal, 11px, color based on top-level section)

Levels separated by 9px, #CCC double arrows

NOTE: Story Page breadcrumbs have a different style than Subsection Landing Page breadcrumbs, which are more prominent (see page 21)

Typographyrules

Byline (Georgia, Bold, 14px, #666)

Byline Name Link (same, with color based on top-level section)

Affiliate Name (Georgia, Italic, 14px #666)

Timestamp (Helvetica, 12px, #666)

Affiliate and Timestamp separated by #666 round bullet

Comment/Facebook/Twitter Counters (Helvetica, Normal, 12px, #666)

Comment/Facebook/Twitter Counters on hover (#000)

Updated label (12px Tahoma, Bold, Allcaps, #000)

10px5px

10px5px

15px icon5px

20px

1px #eee line above and below components

15px



Infobox

• Gives reader supplemental information about the story topic

Notations

• Serves as an Editor’s Note for readers, setting up a series, explaining a related policy, or offering a brief columnist bio

• Notations can also appear below the text of a story, with the author’s email address.

RelatedLinks

• Gives reader links to more content on the story topic

• Could be links to related stories on Dispatch.com, its affiliated or links to outside sites

Typographyrules

Infobox Headline (Tahoma, bold, 14px, #666)

Infobox Text (Helvetica, Normal, 12px, #666)

Infobox Sourceline (Helvetica, Normal, 8px, #666)

Disc Bullets for lists, in color of top-level category.

Typographyrules

Label (Tahoma, bold, allcaps, 12px, in color of top-level category)

Link Text (Helvetica, Normal, 12px, #666)

Disc Bullets for lists, in color of top-level category.

Typographyrules

Label (Tahoma, bold, allcaps, 12px, in color of top-level category)

Notation Text (Georgia, italic, 12px, #666, 140% letter-spacing)

Typographyrules

Notation Text (Georgia, italic, 14px, #666, 140% letter-spacing)

Email Address (Georgia, bold, 14px, color-coded by section)

RELATED LINKS• Xyxyx xyxyx xyxyx xyxy



xy xx xyxyx

Infobox head xyxLorem ipsum dolor sit amet, consectetur adipi-scing elit. Nam vitae ipsum sed magna suscipit vehicula at vyl felis. • Xyxyx xyxyx xyxyx xyxy


xy xx xyxyx • Xyxyx xyxyx xyxyx xyxy xy xx xyxyxSource: Xyxyxyxy xyxyx

XYXYXY XYYXYXNotation goes right here orem ipsum dolor sit amet, consectetur adipi-scing elit. Nam vitae ipsum sed magna suscipit vehicula.

LETTERS POLICYThe Dispatch welcomes letters to the editor from readers. Typed letters of 200 words or fewer are preferred; all might be edited. Each letter must include name, home address and daytime phone number.Dispatch.com also posts letters that don’t make it to print in The Dispatch.

FIRST PERSONFirst Person is a weekly forum for personal mus-ings and reflections from readers.To submit your own First Person for publication.

42 px headline lorem ipsum facto ipte latte frappacinno grande18px subhead denatis adipiscing diam, ut gravida tortor porta aliquam at nung a nisi ultrices aliquam ut ac metus

LABEL HEADLINE GOES HERE

CREDITLINE XYXYXYXY


LINKS XYXYXYXYXYX• Xyxyx xyxyx xyxyx xyxy



xy xx xyxyx

LEFT-RAIL BEGINS • Xyxyx xyxyx xyxyx xyxy



xy xx xyxyx




Secondary Image caption ipsum dolor sit amet, consectetur adipiscing elit.

Factbox head xyxLorem ipsum dolor sit amet, consectetur adipi-scing elit. Nam vitae ipsum sed magna suscipit vehicula at vyl felis. • Xyxyx xyxyx xyxyx xyxy



NOTATION XYYXYXNotation goes right here orem ipsum dolor sit amet, consectetur adipi-scing elit. Nam vitae ipsum sed magna suscipit vehicula.




xy xx xyxyx




xy xx xyxyx






42 px headline lorem ipsum facto ipte latte frappacinno grande





xy xx xyxyx




xy xx xyxyx






20px10px 10px 10px

20px10px

20px

10px

20px

20px

20px

10px

5px

20px10px

5px

20px

20px20px

5px5px





Chapter head goes here





Nunc scelerisque, neque in dignissim aliquam, nunc mauris iaculis sapien, sit amet ornare tellus orci at ipsum. Cras non lorem quam, quis dictum ligula. Maecenas eget elit augue, et pellentesque augue. Quisque in nisl est. Sed purus justo, mollis non bibendum sit amet, egestas pharetra turpis.


Trailer in nisl est. Sed purus justo, mollis non bibendum sit amet, egestas pharetra turpis. Nunc tempor tincidunt eros, eu blandit mi interdum eget.

[email protected]

By Reporter NameThe Columbus Dispatch • Xyxday, Month 00, 2011 03:01 AM

Commenting module TBD

Comments: 35 Recommend: 16 Share: 6345 Tweet: 706

RecommendE-mail Story

Share OptionsPrint Story

Share on FacebookShare on Twitter

Add to Favorites













[email protected]







Add to Favorites













[email protected]







Add to Favorites

INANASIDE ATTHEBOTTOMOFSTORyTExT




CREDITLINE XYXYXYXY





xy xx xyxyx




xy xx xyxyx












xy xx xyxyx




xy xx xyxyx











xy xx xyxyx




xy xx xyxyx






20px10px 10px 10px

20px10px

20px

10px

20px

20px

20px

10px

5px

20px10px

5px

20px

20px20px

5px5px













[email protected]







Add to Favorites













[email protected]







Add to Favorites













[email protected]







Add to Favorites



CREDITLINE XYXYXYXY





xy xx xyxyx




xy xx xyxyx












xy xx xyxyx




xy xx xyxyx











xy xx xyxyx




xy xx xyxyx






20px10px 10px 10px

20px10px

20px

10px

20px

20px

20px

10px

5px

20px10px

5px

20px

20px20px

5px5px













[email protected]







Add to Favorites













[email protected]







Add to Favorites













[email protected]







Add to Favorites


Label,Headline,SubheadandChapterHead

TypographyrulesforStoryPageHeadlineElements

Label (Tahoma, bold, all caps, 14px, #666)



Chapter Head (Helvetica, bold, 14px, #000)

20px

20px

20px



StoryTools

• Tools at the bottom of stories that allow users to print, email, recommend, share and mark as favorites.




Add to Favorites

20px

20px

10px

10px

12pxicons

15px spacing

5px

Stylerules

• 1px #eee horizontal rules above and below

• Icons are 12px

• Text is 12px Helvetica normal #666, with hover state of #000




CREDITLINE XYXYXYXY





xy xx xyxyx




xy xx xyxyx












xy xx xyxyx




xy xx xyxyx











xy xx xyxyx




xy xx xyxyx






20px10px 10px 10px

20px10px

20px

10px

20px

20px

20px

10px

5px

20px10px

5px

20px

20px20px

5px5px













[email protected]







Add to Favorites













[email protected]







Add to Favorites













[email protected]







Add to Favorites

IV.StoryPagesC.StoryPageSpacing

20px

20px

20px

Documents

dispatch.com design style guideaudio.dispatch.com/StyleBook0309.pdf9 March 2011 dispatch.com design style guide 2 Table of Contents I. Basic Design Elements 3 A. 12-Column Grid 4 B