28 jan 2010 jour3340 website design&elements

21
Website Design: What Makes a Good News Website JOUR 3340 – Online Journalism January 28, 2010

Upload: neil-foote

Post on 19-May-2015

582 views

Category:

Education


1 download

DESCRIPTION

UNT Professor Neil Foote's course notes.

TRANSCRIPT

Page 1: 28 Jan 2010   Jour3340   Website Design&Elements

Website Design:What Makes a Good News Website

JOUR 3340 – Online JournalismJanuary 28, 2010

Page 2: 28 Jan 2010   Jour3340   Website Design&Elements

Today’s Class

Elements of Design Next Tuesday’s assignment

Blog Post #1 Based on today’s lecture on websites, go to

AssignmentEditor.com to find a local newspaper or television website (outside of North Texas). How does this news website meet the criteria? For additional information, read the following links.

Page 3: 28 Jan 2010   Jour3340   Website Design&Elements

Elements of News Website Headline Summary Main story Breaking news

briefs Links to related

stories Time lines Short bios on key

sources

Photos/graphics Audio Still and/or video

slide shows Polls Games Discussion forums Email link to

reporter Database

Page 4: 28 Jan 2010   Jour3340   Website Design&Elements

The Home Page

Web 1.0:Navigationon the Left

Page 5: 28 Jan 2010   Jour3340   Website Design&Elements

The Home Page cont.

Web 2.0:Navigationat Top

Large

Colorful

Photo

Ad

Space

Page 6: 28 Jan 2010   Jour3340   Website Design&Elements

The Home Page cont.

Web 2.0:Navigationat Top

Headlines,

Blurbs, Links Reader

EngagementInteractive Packages – Slide Shows

Page 7: 28 Jan 2010   Jour3340   Website Design&Elements

Best Newspaper Websites

© 2008 Compiled by The Bivings Group, a communications consulting firm

Page 8: 28 Jan 2010   Jour3340   Website Design&Elements

© 2008 Compiled by The Bivings Group, a communications consulting firm

Page 9: 28 Jan 2010   Jour3340   Website Design&Elements

© 2008 Compiled by The Bivings Group, a communications consulting firm

Page 10: 28 Jan 2010   Jour3340   Website Design&Elements

© 2008 Compiled by The Bivings Group, a communications consulting firm

Page 11: 28 Jan 2010   Jour3340   Website Design&Elements

Elements of Basic DesignTraditional v. Web

Traditional Modular Balance Fonts Headlines,

subheads, bylines Lead story, off

lead, display feature

Charts/boxes Hi-res images

Digital Media Balance Simple, clean Colorful Headlines Photos with captions Interactive graphics Animation, flash Low res, fewer pixels

Page 12: 28 Jan 2010   Jour3340   Website Design&Elements

The Home Page Hooking your

audience immediately

Who is your reader? Your viewer?

Why will they/would they come to your website?

What’s the ‘so what’ of your website?

Choosing the right images

Removing distractions

Understand the limits of design ‘Above the fold’ &

‘below the fold’

Page 13: 28 Jan 2010   Jour3340   Website Design&Elements

Web DesignYesterday & Today

Yesterday QuarkXpress,

Adobe Pagemaker HTML code

Hyper Text Markup Languague

FTP: File Transfer Protocol

Today Dreamweaver Adobe EnDesign Flash, Shockwave WYSIWYG (What You

See Is What You Get ) Content Management Systems

Page 14: 28 Jan 2010   Jour3340   Website Design&Elements

Basic Elements of Design

Balance: No obscured elements Big elements shouldn’t obscure small ones Dark elements should not obscure light ones

(e.g. black background, orange font)

Contrast & Focus Using white space wisely

http://www.statesman.com/?r=t http://www.cleveland.com/

Web Journalism, James Glen Stovall, ‘Design on the Web’, Chapter Ten

Page 15: 28 Jan 2010   Jour3340   Website Design&Elements

Basic Elements of Design Readability

See and read stories on the website No more than two clicks from HomePage

Simplicity Avoid lots of complicated graphics, animation

Consistency Throughout website, particularly on article pages

Variety Be creative, but not obtrusive

Purpose: Always ask: What’s the purpose of this website?

Web Journalism, James Glen Stovall, ‘Design on the Web’, Chapter Ten

Page 16: 28 Jan 2010   Jour3340   Website Design&Elements

“You have to say, How do I take the same basic information and tell the story in a way that works on a Webpage? You have to take the information and turn it on its head – actually, you have to turn the method of storytelling on its head – then tell the story taking advantage of the new technology. You can’t approach it in the same way if you want o be effective.” Retha Hill, Director, New Media Innovation Lab Walter Cronkite School of Journalism Formerly VP Content, BET & executive producer,

WashingtonPost.com

Page 17: 28 Jan 2010   Jour3340   Website Design&Elements

Balancing Editorial & Revenue Editorial

News: Local, Regional, National, Int’l

Sports Business Lifestyle Opinion/Editorials

Revenue Classifieds Banners Advertorials Paid links Sponsored

content

Page 18: 28 Jan 2010   Jour3340   Website Design&Elements

Organizing the New Website Cont.

Within each story Byline Reporter’s email address Audio, video links Slideshow: photo and/or video Related links Comments section

Web Journalism, James Glen Stovall, ‘Design on the Web’, Chapter Ten

Page 19: 28 Jan 2010   Jour3340   Website Design&Elements

Organizing the New Website Cont.

Within each section front Consistency is key

Controlled by content management system, in many cases

Links to other sections Links to related articles

Web Journalism, James Glen Stovall, ‘Design on the Web’, Chapter Ten

Page 20: 28 Jan 2010   Jour3340   Website Design&Elements

Format of your Analysis

Website Analysis Grid

Website Name:

Website URL:

Content

Interactivity

Design

Functionality

Advertising

Page 21: 28 Jan 2010   Jour3340   Website Design&Elements

Analyzing a Website

Content: What’s featured on homepage? Local? National? News? Features?

Interactivity: What’s being used? Links? Slide shows? Video? Comments? Blogs?

Design/Navigation: Is it hard or difficult to find content on site?

Functionality: Is the useful? Informative? immediate

Advertising: How is it integrated? Is it distracting? Banners? Type?