Show Menu

Key Web Design Principle Checklist Cheat Sheet by

web     design     checklist     software     key

Introd­uction

Use this checklist to evaluate the online newspapers you encounter — or, more import­antly, to critique your own.

Layout and Design

Is the home page attrac­tive, inviting and well-o­rga­nized?
Can readers easily differ­entiate between promos, ads and live news?
Is there a clear hierarchy of news content on the home page?
In other words, is it instantly obvious which stories are most important?
Do the headlines and design of the top stories on the home page show creativity or flair (rather than being predic­tably pre-fo­rma­tted)?
Does the site’s design style match the person­alities of its readers?
Do pages use attrac­tive, approp­riate and consistent colors?
Does the site avoid unnece­ssary blinky­-fl­oat­y-glowy animated effects?
Does the text on most pages avoid becoming too wide and wordy?
Does the site use consistent styles for the basics: headlines, bylines, subheads, etc.?
Does the site use consistent styles for the extras: graphics, liftout quotes, sidebars, etc.?

User-F­rie­dliness

Does the home page download quickly?
Does the site offer a “Sunday Brunch­”-style menu of stories, visuals, reader forums and multimedia options (audio, video, animated graphics, etc.)?
Does the site provide services, stories and sidebars not available in the print newspaper?
Are users always a single click away from the home page or main section fronts?
Is a concise index constantly viewable, from any page in the site?
Does the flag appear atop every page, to remind users where they are?
Are all images necessary? Tightly cropped? Compressed into GIF or JPEG formats?
Does the site function succes­sfully with all images turned off in the browser?
If someone visits this site looking for a specific piece of inform­ation, will it be easy to find?
When reading the text of stories, do users find helpful links that expand­/ex­plain topics?
Can users search the newspa­per’s back issues? Are the archives reasonably complete?
Does the site provide helpful links to related resources outside the newspaper?
Is it easy to send e-mail feedback, news tips or letters to the editor?
Most import­antly: Will visitors tend to bookmark this site and visit it again?

Site Management

Does the site design feel current? (Has it been upgraded within the past year?)
Are all stories time-s­tamped (or, at the very least, dated)?
Are all stories and headlines well-e­dited?
Do all pages share a well-c­oor­dinated system of navigation controls, typography and color style throughout the site?
Are there annoying technical glitches (tempe­ram­ental graphics, expired links, pages “under constr­uct­ion”) that might frustrate users?
Does the site provide newsroom phone numbers and addresses, for those who need to
do more than send e-mail?
Are the public­ation name, Web address, date and copyright notice posted on every page (and do they appear on all printouts of stories)?
Does anything on this site violate someone else’s copyright?
 

Which Elements Need Redesign

Once you’ve identified your flaws and establ­ished your goals, you can pinpoint
specific items that need repair or replac­ement. As you compile your redesign
shopping list, decide what’s sacred (your flag?), what’s got to go (your ugly headline type?) and what’s optional (maybe a fancy index would be nice, but not
essent­ial).

To help you itemize the changes you need to make, try using this checklist:

Headlines and Text

The Flag: ** Must be unique and expres­sive, like a corporate logo. Should you try a modern, stylish typeface? Special graphics effects? Color?
Headlines : Want them bold and punchy? Or sleek and elegant? Want to try altern­ative forms (hammers, kickers) — or add topic labels?
Decks: Should complement the main headline’s typeface. Will you add them to every story? Want different styles for news and features?
Standing Heads: Choose one expres­sive, stylish type family for all page toppers, logos, sigs, etc. Want screens, reverses, other graphics effects?
Text: Must be comfor­table to read. What’s the ideal size and leading?
SPpecial Text: Want a sans-serif altern­ative for graphics, sidebars, briefs? Should be a font with versat­ility (strong boldface, italic, etc.).

Archit­ecture and Design

Page Grids: Should you try a new system of column widths and page formats? Will this work with ads — or just on open pages?
Page Headers: Where do you want them — at the top? Sideways? Indented? Can they incorp­orate graphic extras (factoids, calendars, etc.)?
Briefs: Should you regard them as fundam­ental building blocks and anchor them throughout the paper? Can you include art?
Special Features: Polls. Quotes. Stats. Calendars. Quizzes. Contests. Letters. Cartoons. Can you build these into standing page formats?
Rules & Boxes: They’re a key part of your overall look. Want them loud? Quiet? Decide on ideal line weights. Box styles. Screen densities.
Promos & Indeces: How prominent? How flexible? How much art can you add?
Ads: Can you keep ad stacks modular? Cleared from key pages?

Content and Organi­zation

Sectioning: Can you restru­cture the news into innovative topics and depart­ments? Can you create special themed pages or packages?
Sequencing: What’s the most intere­sting, effective flow of topics through the paper? Where can you pile ugly ad stacks to do the least damage?
Non-Text Options: Can you repackage inform­ation in a variety of forms – besides text and headlines? Can you anchor these altern­ative formats?
Interactivity: How user-f­riendly should you be? Where can you give readers more opport­unities to speak, partic­ipate, interact?
Liftout quotes
Column Logos: A graphic device that labels regularly appearing material by packaging the writer's name, the column's name and a small mug or drawing of the writer.
Review & Preview
Bylines: The reporter's name, usually at the beginning of a story.
Jump Lines
Jump Headlines: A special headline treatment reserved for stories continued from another page
Initials Caps: A large capital letter set at the beginning of a paragraph.
Cutlines: A line or block of type providing descri­ptive inform­ation about a photo
Cutlines for standalone photos:
Credit lines:
Editor's notes:
Maps & Charts:
Refers: A line or paragraph, often given graphic treatment, referring to a related story elsewhere in the paper.
Corrections:

Download the Key Web Design Principle Checklist Cheat Sheet

2 Pages
//media.cheatography.com/storage/thumb/davidpol_key-web-design-principle-checklist.750.jpg

PDF (recommended)

Alternative Downloads

Share This Cheat Sheet!

Like this cheat sheet? Check out our sponsors!

Readable.io is a collection of tools to make your writing better. More readable content means higher conversion rates and better reader engagement. Measure website and document readability, measure keyword density and more!

Click Here To Get Started!

 

Comments

No comments yet. Add yours below!

Add a Comment

Your Comment

Please enter your name.

    Please enter your email address

      Please enter your Comment.

          Related Cheat Sheets

          CSS2 Cheat Sheet
          JavaScript Cheat Sheet

          More Cheat Sheets by Davidpol

          Jewish Kings Cheat Sheet
          Signs Risk for Resistant Depression Cheat Sheet