1

Additional Topics:Splash, Flash and Web

Usability

INFO 654 – Spring 2007

2

Sources and Credits for this Material

Used examples from Son of Web Pages That Suck (2002) by Vincent Flanders

3

Objectives

In this session, we will address: A little more on splash pages (as a

prelude to Flash) What is Flash?

Good and bad usability features

4

Splash Pages and Usability They can look great and help

convey image and style, but they sometimes violate a cardinal rule of usable web design: Don’t do anything that gets in the

way of the user. Splash pages sometimes get in the

way because they are an extra layer between your visitor and your site.

5

Vincent Flanders:Parody of Really Bad Splash http://www.webpagesthatsuck.com/wpts

1/ Shows many bad design elements Too many people thought he was

serious in that this splash page was Flanders’ idea of what a well-designed page should look like.

For a good laugh, try the “Click Here” animation.

6

Splash Pages and Accountability

Logically, music and art sites are perfect places to use splash pages:

http://www.scarymovie.com There’s no way to judge whether this

site affected traffic to the movie.

7

Good Splash Pages To screen initial viewers

http://www.europa.eu.int

8

Not Everyone Agrees “But we’re trying to establish a

brand, and our splash page is our branding mechanism.”

9

Cut Your Losses with Splash Pages

Make Splash file under 40KB in size, if possible. Include descriptive text Use descriptive <TITLE> tag Use descriptive text and keywords in <META>

tags.

10

Macromedia Flash When Flash animations play, many

Web surfers never notice that their browser is actually loading a foreign application.

The Flash plug-in allows browsers to run Flash programs that range from the sublime to the ridiculous.

11

Flash – What It Is Original Macromedia description:

“Macromedia Flash is the key to designing and delivering low-bandwidth animations, presentations, and Web sites. It offers scripting capabilities and server-side connectivity for creating engaging applications, Web interfaces, and training courses. Once you’ve created your content, 98.3% of the online audience will be able to view it with the Macromedia Flash Player.”

http://www.macromedia.com/software/flash/

12

Vector-based Web Authoring

Mathematical concept of vectors serves as a basis for computer graphics. Vector is a formula that describes a path: Start at a given point, and proceed in a specified

direction for a specified distance. Any computer image to display or print can be

built from these path instructions. Advantages: permits smaller file size, faster

download, and image scalability without loss of quality

Raster-based (bitmapped) image formats, such as GIF and JPEG, contain information about individual pixels.

13

Why Flash is Bad Search engines can’t index flash-based

content Bandwidth – Flash files can be huge Many corporate intranets and military

groups won’t give their users access to Flash Playback speed varies Flash is an invitation to use Mystery Meat

Navigation Accessibility concerns and others

14

Why Flash is Good What you see on the screen is pretty much

what you get Solves positioning problems Flash player is included with newer

browsers Vector graphics are easier and faster to

work with than bitmaps Web-based resources

http://www.swishzone.com

15

Flash and Usability: Bad http://www.dack.com/web/flashVhtml/ http://news.cnet.com/news/0-1005-200-57

72284.html http://www.webword.com/flashusability.ht

ml http://www.clickz.com/tech/lead_edge/arti

cle.php/838701 http://www.useit.com/alertbox/

20001029.html

16

Equal Time:Flash and Usability: Good Or bad?:

http://www.webpagesthatsuck.com/main.html

Good?: http://webmasterbase.com/article/374

Good (but touted on Macromedia’s own site): http://www.vw.com HTML-based

‘configurator’ versus http://www.vwasia.com Flash-based ‘visualizer’.

17

Equal Time:Flash and Usability: Good

Also touted on Macromedia’s site: http://www.onemanseye.com http://TheyRule.net

18

Flash Works Best For . . . Animations, cartoons, and games Visual explanations, like how to put

together a cabinet or how a revolutionary new product works http://www.segway.com

Sites that involve user interaction along with animation Forms for users to fill out

Situations where there is no accountability for how well or poorly the site performs

19

Types of Sites Made for Flash Band Fashion Multimedia Movie Web Design Firms Brochureware sites – sites that are

created to look pretty but not to sell anything.