Brakebuddy.com Homepage

Size: px
Start display at page:

Download "Brakebuddy.com Homepage"

Transcription

1 UI Insight, Inc. Steven Chalmers, President (303) Heuristic Evaluation and Proposed Redesign for Brakebuddy.com Homepage 23 August 2002 Steven Chalmers

2 Table of Contents 1. Original homepage design Proposed homepage design Page weight Page title Photo weight Photo content Animated GIFs address Fluid design Copyright Homepage focus Homepage text Superfluous elements Tiny fonts Search Homepage link Breadcrumb trail Navigation design Last saved: 23-Oct-2002 Page 2 of 16

3 1. Original homepage design Last saved: 23-Oct-2002 Page 3 of 16

4 2. Proposed homepage design Last saved: 23-Oct-2002 Page 4 of 16

5 3. Page weight This page is 57,499 bytes, which means at 56k it takes 16.4 seconds to open. The maximum page weight should be about 40K bytes to make the download time 10 seconds. Designing Web Usability 42 Response Times The basic advice regarding response times has been about the same for many years [Miller 1968; Card e~ al. 1991]: One tenth of a second (0.1) is about the limit for having the user feel that the system is reacting instantaneously, meaning that no special feedback is necessary except to display the result. This would be the response time limit for any applets that allow users to move, zoom, or otherwise manipulate screen elements in real time. One second (1.0) is about the limit for the user s flow of thought to remain uninterrupted, even though the user will notice the delay. Normally, no special feedback is necessary during delays of more than 0.1 but less than 1.0 second, but the user does lose the feeling of operating directly on the data. Getting a new page within a second means that the user appeared at the page without undue delay. Ten seconds (10.0) is about the limit for keeping the user s attention focused on the dialogue. For longer delays, users will want to perform other tasks while waiting for the computer to finish. Getting a new page within 10 seconds, while annoying, at least means that the user can stay focused on navigating the site. Suggested changes: Reduce the page weight to less than 40Kbytes by: Reduce the dimensions and file size of the pictures. See point 5. Remove as many unnecessary elements on the page as possible. Last saved: 23-Oct-2002 Page 5 of 16

6 4. Page title The page title is used for both bookmarking and in the title of the browser window. It should always start with the company name. This will aid the user when searching for the saved link. As it is, the link begins with auxiliary. Homepage Usability 25 Begin the window title with the information-carrying word-usually the company name. Users scan rather than read, text on screens, so if you don t catch them with the first word, you risk losing their attention. If you start the window title with anything but the most important work, the company name gets lost in bookmark lists and search results. Change the <TITLE> to: BRAKEbuddy Auxiliary braking system for towed vehicles 5. Photo weight The two photos in page are slightly larger than needed in terms of quality. Using Photoshop I was able to reduce them from 24 and 19 Kbytes to 16 and 13 Kbytes. Reduce the depth of the photos as much as possible to reduce the file size. Last saved: 23-Oct-2002 Page 6 of 16

7 6. Links removed 5 links were removed from the homepage: 1) Standard Ordering This should be moved to the Ordering page. Giving the customer two choices too early can be confusing. Better to deal with the differences on the Ordering page 2) BRAKEbuddy FAQ I believe this is more appropriate on the Brakebuddy details page. 3) Letters I believe this is more appropriate on the Brakebuddy details page. 4) Weight Limits This should be a part of or accessed from the FAQ page and should be referenced from the product pages where appropriate. 5) Links to Related Sites This is of questionable value especially since there is only one link. If there is a specific reason to show a link to an RV insurance company then the link title should reflect it. Last saved: 23-Oct-2002 Page 7 of 16

8 7. Photo content Too little of the photo containing the Brakebuddy is concentrating on the important subject matter and the insert photo of the Brakebuddy is hard to see. Useit.com Here's a list of ten additional design elements that will increase the usability of virtually all sites: 7. Use relevance-enhanced image reduction when preparing small photos and images: instead of simply resizing the original image to a tiny and unreadable thumbnail, zoom in on the most relevant detail and use a combination of cropping and resizing. Consider the before and after versions of the photo: Before After The example after picture focuses on the two most important elements of the picture: 1) The Brakebuddy, 2) A towed vehicle. Some variation of the example after picture should replace the existing picture. Last saved: 23-Oct-2002 Page 8 of 16

9 8. Animated GIFs The animated GIF of the RV pulling a vehicle is distracting, of low quality, and offers little value. Homepage Usability 22 Don t use animation for the sole purpose of drawing attention to an item on the homepage Animation rarely has a place on the homepage because it distracts from other elements. Animation requires a user s attention and should be shown by itself, whereas homepages have multiple elements requiring attention. For example, animation could be very helpful to show how to do a procedure that is easier seen than described, like swaddling a baby, but it wouldn t be appropriate so show it on a homepage, where it would draw attention from all other elements on the page. Remove the animated GIF. 9. address The address stop@brakebuddy.com is too cute. It should be more professional sounding. Web Pages that Suck 13 People want to do business with people they believe to be professional. Homepage Usability 14 Don t use clever phrases and marketing lingo that make people work too hard to figure out what you re saying. For example, the Dream, Plan, & Go category on Travelocity might sound catchy to a marketing person, but it s not as straightforward as Vacation Planning. Every time you make users ponder the meaning behind vague and cutesy phrases, you risk alienating or losing them altogether. Users quickly lose patience when they must click on a link just to figure out what it means. This isn t to say that homepage text should be bland, but it must be informative and should be unambiguous. Use info@brakebuddy.com. Last saved: 23-Oct-2002 Page 9 of 16

10 10. Fluid design The homepage has a fixed width which means it does not flow to match the browser window width. Compare this with which is a fluid design Redesign the page to use percentages for the table sizes instead of pixels. Last saved: 23-Oct-2002 Page 10 of 16

11 11. Homepage focus The homepage for the Brakebuddy should feature the product itself most prominently. Instead, the viewer is shown some unhappy old fart and his frustrated wife. This is too negative an image to feature on the most important pixels of your web site. The following image is the Brakebuddy homepage at a resolution of 1024 x 768. Homepage Usability Preface Homepages are the most valuable real estate in the world. Millions of dollars are funneled through a space that s not even a square foot in size. Feature a picture of the Brakebuddy in the top 400 pixels of the page so that even viewers with a resolution of 640 x 480 will see it. Last saved: 23-Oct-2002 Page 11 of 16

12 12. Copyright It is possible that the copyright does not need to include the years. Copyright.html This website is Copyright by Jakob Nielsen. All Rights Reserved. Proposed change: Use: This website is Copyright by Master Concepts. All Rights Reserved. Last saved: 23-Oct-2002 Page 12 of 16

13 13. Homepage text The green text, while being an odd choice of colors, is perfectly written for the web. Short, concise and of particular interest to the viewer. UseIt.com Alertbox Articles Be Succinct! (Writing for the Web) The three main guidelines for writing for the Web are: Be succinct: write no more than 50% of the text you would have used in a hardcopy publication Write for scannability: don't require users to read long continuous blocks of text Use hypertext to split up long information into multiple pages Keep the green text content and rewrite the body text for improved readability and scannability. One possibility: Brakebuddy Revolutionary auxiliary braking system for your towed vehicle. Designed for busy people like you who enjoy their RVs. Installed in a few short minutes in almost any towed vehicle. Don't bother with time consuming hydraulic and electric braking connections when you could be on the road, relaxed with peace of mind, confident in your new auxiliary braking system. It's so simple ANYONE can install it! Last saved: 23-Oct-2002 Page 13 of 16

14 14. Superfluous elements Very few prospective buyers of a Brakebuddy care that the site is Powered by anything. They just care that they can get information about the Brakebuddy. Designing Web Usability 22 A general principle for all user interface design is to go through all of your design elements and remove them at a time. If the design works as well without a certain design element, kill it. Simplicity always wins over complexity especially on the Web where every three bytes saved is a millisecond less download time. Remove these graphics: 15. Tiny fonts Considering the age of the audience for the Brakebuddy site is quite likely older that 30, the site should never use tiny fonts. NN/g User Experience Conference Designing for the Future: Senior Citizens Ensure that text size is al least 12 points by default. One thing I don t like about computers is they make the type too small on the screen a 70+ woman in our study. Don t use fonts this small: Last saved: 23-Oct-2002 Page 14 of 16

15 16. Search Many users are search oriented. Adding a search feature is simple and the search function has become an expected element of a web site. Designing Web Usability 224 My usability studies show that slightly more than half all users are search-dominant, about a fifth of the users are link-dominant, and the rest exhibit mixed behavior. Consider adding a Search function, especially Google since it is already available. 17. Homepage link The homepage should not link to itself, nor should any page link to itself. Useit.com Here's a list of ten additional design elements that will increase the usability of virtually all sites: 1. Place your name and logo on every page and make the logo a link to the home page (except on the home page itself, where the logo should not be a link: never have a link that points right back to the current page). Code the page to have the link inactive on the homepage. 18. Breadcrumb trail A breadcrumb trail can be very useful for helping the visitor orient themselves in the website. Implement a breadcrumb trail for user orientation and quick access to the homepage. BRAKEbuddy > Press Room > Print Ads Last saved: 23-Oct-2002 Page 15 of 16

16 19. Navigation design The navigation design is hard to read and cluttered with the superfluous horizontal white lines. The link colors deviate from the standard and don t indicate which links have been visited. Designing Web Usability 62 Most web browsers use two different colors to display links: Links to pages that the user has not seen before are typically displayed in blue, whereas links to pages that the user did see earlier are displayed in purple or red. It is critical for web usability to retain this color coding in your link colors. Although it is unnecessary to use exactly the same shade of blue as the browser default, unvisited links must unmistakably be blue and visited links must unmistakably be reddish or purple. When non-standard link colors are used, users lose the ability to clearly see which parts of the site they have already visited and which parts remain to be explored. The user s sense of structure and location in the site is significantly weakened, and navigational usability suffers as a result. Some users will waste time selecting the same option repeatedly; other users will give up prematurely, thinking they have explored all options when in fact they have not; and some users will not be able to get back to a section they read and found useful because it is not differentiated in the list. Use the standard link colors. Last saved: 23-Oct-2002 Page 16 of 16

Overview. Importance of Design. Lost in hyperspace. Site Organisation. Designing Structure. Lecture 14 Web Usability

Overview. Importance of Design. Lost in hyperspace. Site Organisation. Designing Structure. Lecture 14 Web Usability Overview Lecture 14 Web Usability Boriana Koleva Room: C54 Email: bnk@cs.nott.ac.uk Website design Information structure Navigation Webpage design Text Graphics Audio Video Aesthetics Usability Importance

More information

Reviewing and Evaluating your Website

Reviewing and Evaluating your Website Reviewing and Evaluating your Website Introduction In the following review, I will be evaluating the website that I have produced for my client. I will make sure I have made the website appropriate for

More information

Response Times: The 3 Important Limits

Response Times: The 3 Important Limits Jakob Nielsen s Alertbox: January 1, 1993 Response Times: The 3 Important Limits Summary: There are 3 main time limits (which are determined by human perceptual abilities) to keep in mind when optimizing

More information

2/1/2016. Discuss website usability essentials Explain principles of design Critique a website in terms of usability and design

2/1/2016. Discuss website usability essentials Explain principles of design Critique a website in terms of usability and design Due Tuesday, Feb. 9 upload to Blackboard Locate five HTML (not Flash) websites you believe exhibit good web design, usability and accessibility principles. Each website s critique is worth 10 points (50

More information

Skill Area 323: Design and Develop Website. Multimedia and Web Design (MWD)

Skill Area 323: Design and Develop Website. Multimedia and Web Design (MWD) Skill Area 323: Design and Develop Website Multimedia and Web Design (MWD) 323.1 Design and Plan a Web site (7 hrs) 323.1.1 Web Authoring Tool 323.1.2 List and Use various features to make a Website 323.1.3

More information

EFFECTIVE WEB CONTENT

EFFECTIVE WEB CONTENT EFFECTIVE WEB CONTENT A computer monitor is different in many ways from printed material. The type can be difficult to read because it is displayed differently depending on the computer screen, operating

More information

Web Design and Usability. What is usability? CSE 190 M (Web Programming) Spring 2007 University of Washington

Web Design and Usability. What is usability? CSE 190 M (Web Programming) Spring 2007 University of Washington Page 1 Web Design and Usability CSE 190 M (Web Programming) Spring 2007 University of Washington References: J. Nielsen's Designing Web Usability (2) What is usability? usability: the effectiveness with

More information

Hershey Park. By: Alicia Danenhower. English 3880 Section 10. Deborah Welsh.

Hershey Park. By: Alicia Danenhower. English 3880 Section 10. Deborah Welsh. Hershey Park http://www.themeparkpage.com/images/hershey-web/dsc00263000.jpg By: Alicia Danenhower English 3880 Section 10 Deborah Welsh 11/8/2011 Hershey Park 1 Introduction This report analyzes the ways

More information

Human-Computer Interaction IS4300

Human-Computer Interaction IS4300 Human-Computer Interaction IS4300 1 Designing for the Web Stone Ch 17 + J. Lazar et al, HCI Handbook 1 Today Stone Chapter J. Lazar et al, HCI Handbook Testing tools & surveys Nielsen s Top 10 Mistakes

More information

Writing for the web. Updated Writing for the web 1

Writing for the web. Updated Writing for the web 1 Writing for the web Updated 2013 Writing for the web 1 Table of contents 1 Introduction 3 1.1 Scannability 3 1.2 Why users scan 3 1.3 F-shaped pattern for reading web content 3 1.4 Implications of the

More information

USER RESEARCH Website portfolio prototype

USER RESEARCH Website portfolio prototype USER RESEARCH Website portfolio prototype Researcher & Author: Álvaro Ibargüen Villa UX, UI & Visual Designer Tel. E-mail Online +34 695 42 17 92 alvaroiv1@gmail.com aivweb.es INTRODUCTION 2 OBJECTIVES

More information

Dazzle the Web with Dynamic Dreamweaver, Part II

Dazzle the Web with Dynamic Dreamweaver, Part II Dazzle the Web with Dynamic Dreamweaver, Part II In the second Dreamweaver workshop we will learn the following skills: 1. Adding hyperlinks to our home page 2. Adding images to our home page 3. Creating

More information

UNSW Global Website Branding Guidelines. Website Brand Guidelines

UNSW Global Website Branding Guidelines. Website Brand Guidelines Website Brand Guidelines I Contents 1 Introduction... 1 2 Website Structure... 1 2.1 Page structure overview... 1 2.2 Home page structure... 1 2.3 Secondary page structure... 4 3 Page elements... 6 3.1

More information

Jakob Nielsen s Heuristics (

Jakob Nielsen s Heuristics ( Jakob Nielsen s Heuristics (http://www.useit.com/papers/heuristic/heuristic_list.html) What is heuristic evaluation: Heuristic evaluation is done as a systematic inspection of a user interface design for

More information

User-Centered Website Development: A Human- Computer Interaction Approach

User-Centered Website Development: A Human- Computer Interaction Approach User-Centered Website Development: A Human- Computer Interaction Approach Daniel D. McCracken City College of New York Rosalee J. Wolfe DePaul University With a foreword by: Jared M. Spool, Founding Principal,

More information

Introduction CHAPTER1. Strongly Recommend: Guidelines that, if not followed, could result in an unusable application.

Introduction CHAPTER1. Strongly Recommend: Guidelines that, if not followed, could result in an unusable application. sg-midp20.book Page 1 Wednesday, May 14, 2003 1:27 PM CHAPTER1 Introduction MOBILE Information Device Profile (MIDP) defines the Java application environment for mobile information devices (MIDs), such

More information

Page design and working with frames

Page design and working with frames L E S S O N 2 Page design and working with frames Lesson objectives Suggested teaching time To a learn about designing web pages and creating framesets in your web, you will: 35-45 minutes a b c Discuss

More information

6. How many employees will you need? You must have at least 3. What specific positions will these employees hold?

6. How many employees will you need? You must have at least 3. What specific positions will these employees hold? Assignment 1: Business Proposal (24 pts.) Write a business proposal in unbound report format. It must be a minimum of one page. It must contain all of the information listed below. Every item needs a detailed

More information

Hyacinth Macaws for Seniors Survey Report

Hyacinth Macaws for Seniors Survey Report Hyacinth Macaws for Seniors Survey Report http://stevenmoskowitz24.com/hyacinth_macaw/ Steven Moskowitz IM30930 Usability Testing Spring, 2015 March 24, 2015 TABLE OF CONTENTS Introduction...1 Executive

More information

Mensch-Maschine-Interaktion 2. HCI and the Web. Prof. Dr. Andreas Butz, Prof. Dr. Michael Rohs

Mensch-Maschine-Interaktion 2. HCI and the Web. Prof. Dr. Andreas Butz, Prof. Dr. Michael Rohs Mensch-Maschine-Interaktion 2 HCI and the Web Prof. Dr. Andreas Butz, Prof. Dr. Michael Rohs 1 1 HCI and the Web 1.1 HCI A Quick Reminder 1.2 Web Technology A Brief Overview 1.3 Web Usability: How Do We

More information

Getting Started ~ Student Web Design Basics Dreamweaver CS 5.5

Getting Started ~ Student Web Design Basics Dreamweaver CS 5.5 Outline *Viewing Note... 1 Myweb Important Setup Steps... 1 Before you begin... 1 Setting up your local folder... 1 Editing Pages... 4 Planning... 5 Layout... 5 Elements of Design Tips for Success!...

More information

Fast Company Homepage This ad is very distracting and grabs the viewer attention more than the logo and navigation. It could cause the user to overloo

Fast Company Homepage This ad is very distracting and grabs the viewer attention more than the logo and navigation. It could cause the user to overloo Competitive Review Fast Company Homepage Doing well: It has a bold and modern feel that appeals to the internet audience. Doing poorly: The layout is confusing as to which elements match up and it's unclear

More information

User Interfaces Assignment 3: Heuristic Re-Design of Craigslist (English) Completed by Group 5 November 10, 2015 Phase 1: Analysis of Usability Issues Homepage Error 1: Overall the page is overwhelming

More information

GUIDELINES FOR WEB SITE DESIGN CHAPTER 10

GUIDELINES FOR WEB SITE DESIGN CHAPTER 10 GUIDELINES FOR WEB SITE DESIGN CHAPTER 10 What makes a Web site good? Who defines good? From whose perspective is it good the site visitor or the sponsoring organization? The following questions and tips

More information

Heuristic Evaluation: OneView CRM current application

Heuristic Evaluation: OneView CRM current application Evaluation: OneView CRM current application Angela Edwards 22nd August 2016 Executive Summary This report contains the results of a heuristic evaluation undertaken on the OneView CRM application for Lloyds

More information

Interactive Transparent Display. Analyst/Designer. K Robert Clark 1/5/16 Digital Studio Practice

Interactive Transparent Display. Analyst/Designer. K Robert Clark 1/5/16 Digital Studio Practice Interactive Transparent Display Analyst/Designer K1454389 Robert Clark 1/5/16 Digital Studio Practice CONTENTS Introduction & Background... 2 Current Situation... 2 Design Aims... 2 Design Overview...

More information

What is SEO? How to improve search engines ranking (SEO)? Keywords Domain name Page URL address

What is SEO? How to improve search engines ranking (SEO)? Keywords Domain name Page URL address What is SEO? How to improve search engines ranking (SEO)? Keywords Domain name Page URL address Title and description tags Web page title tag Page description Principal title page (h1) Alternative texts

More information

Cognitive Walkthrough Evaluation Yale University School of Art

Cognitive Walkthrough Evaluation Yale University School of Art www.campusconnections.us Cognitive Walkthrough Evaluation Yale University School of Art Allison Hall LIS 644 - Usability Theory & Practice Pratt SILS 1 Executive Summary Yale University is one of the most

More information

NetObjects Fusion 10 Build Great Sites.

NetObjects Fusion 10 Build Great Sites. NetObjects Fusion 10 Build Great Sites. Why is Fusion the website builder of choice for novices and professionals alike? The answer is simple: Fusion 10 makes it easy for anyone to create and publish a

More information

DIRECTV Message Board

DIRECTV Message Board DIRECTV Message Board DIRECTV Message Board is an exciting new product for commercial customers. It is being shown at DIRECTV Revolution 2012 for the first time, but the Solid Signal team were lucky enough

More information

Heuristic Evaluation. An Analysis of The Toronto Public Library Website. By: Chris Dacol

Heuristic Evaluation. An Analysis of The Toronto Public Library Website. By: Chris Dacol Heuristic Evaluation An Analysis of The Toronto Public Library Website By: Chris Dacol Global High-level Evaluation After evaluating the Toronto Public Library desktop website I have identified several

More information

Process. Interface Design Introduction. Purpose and Goals of your Website. Module 2. Introduction

Process. Interface Design Introduction. Purpose and Goals of your Website. Module 2. Introduction Module 2 Introduction Before one can start building a website, the person must have a clear understanding of the mission, goals, and objectives of the site. Important questions to ask are why are you making

More information

Web Site Design Principles

Web Site Design Principles Web Site Design Principles Objectives: Understand the Web design environment Design for multiple screen resolutions Craft the look and feel of the site Create a unified site design Design for the user

More information

UNIVERSITY HOUSING COMMU- NICATION GUIDE TO DESIGN

UNIVERSITY HOUSING COMMU- NICATION GUIDE TO DESIGN UNIVERSITY HOUSING COMMU- NICATION GUIDE TO DESIGN INTRODUCTION Hello and welcome to the University Housing Communication Guide to Design! In this book, you will find various guides to help you enhance

More information

UNT 2: Elements of Design

UNT 2: Elements of Design You need to keep in mind that when you are creating your website it should: suit your target audience have a good quality color blending image support friendly fonts The basic principles you need to follow

More information

If these steps are not followed precisely as demonstrated in this tutorial, you will not be able to publish your site!

If these steps are not followed precisely as demonstrated in this tutorial, you will not be able to publish your site! Outline *Viewing Note... 1 Myweb Important Setup Steps... 1 Before you begin... 1 Site Setup this must be done correctly in order to publish your files to the server... 2 Authentication Message... 4 Remove

More information

SCHULICH MEDICINE & DENTISTRY Website Updates August 30, Administrative Web Editor Guide v6

SCHULICH MEDICINE & DENTISTRY Website Updates August 30, Administrative Web Editor Guide v6 SCHULICH MEDICINE & DENTISTRY Website Updates August 30, 2012 Administrative Web Editor Guide v6 Table of Contents Chapter 1 Web Anatomy... 1 1.1 What You Need To Know First... 1 1.2 Anatomy of a Home

More information

Prepared by: Marysol Ortega & Diana Arvayo

Prepared by: Marysol Ortega & Diana Arvayo UX Clinic Heuristic Evaluation Case Study: SoundBetter.com Prepared by: Marysol Ortega & Diana Arvayo UX Clinic Heuristic Evaluation The UX clinic is an initiative made for sharing our design expertise

More information

Library Website Migration and Chat Functionality/Aesthetics Study February 2013

Library Website Migration and Chat Functionality/Aesthetics Study February 2013 Library Website Migration and Chat Functionality/Aesthetics Study February 2013 Summary of Study and Results Georgia State University is in the process of migrating its website from RedDot to WordPress

More information

Image Optimisation. Image Dimensions...1 Image File Formats...2 Adding Images...5 Thumbnails...13 Summary...15

Image Optimisation. Image Dimensions...1 Image File Formats...2 Adding Images...5 Thumbnails...13 Summary...15 Table of Contents Image Optimisation Image Dimensions...1 Image File Formats...2 Adding Images...5 Thumbnails...13 Summary...15 Introduction Images are placed on a website to enhance its appearance. However,

More information

CSE 403. UI Requirements & Design. Material in part from Marty Stepp and Valentine Razmov, past 403 classes.

CSE 403. UI Requirements & Design. Material in part from Marty Stepp and Valentine Razmov, past 403 classes. CSE 403 UI Requirements & Design Material in part from Marty Stepp and Valentine Razmov, past 403 classes. Admin stuff Grade database should be working See the Admin section on the class wiki: o You should

More information

What are the elements of website design?

What are the elements of website design? Contents What is a website?...1 Why does design matter?...1 What are the elements of website design?...1 What guidelines can help direct the design?...2 What physical objects are most similar to a web

More information

Content Design. Jason Withrow

Content Design. Jason Withrow Content Design Overview Reading Online Writing for the Web Guidelines Presenting Text Content Graphical Text Text Links PDF Documents Printer-Friendly Format Reading Online 1. Reading from computer screens

More information

Digital Signage Content Creation Guidelines

Digital Signage Content Creation Guidelines A NEW era of Digital Advertising 2017 Digital Signage Content Creation Guidelines DIGITAL BILLBOARD CONTENTS GUIDELINES & TIPS Introdution 01 Intro Maximize the Potential Text, graphics and backgrounds

More information

VIDEO 1: WHY IS THE USER EXPERIENCE CRITICAL TO CONTEXTUAL MARKETING?

VIDEO 1: WHY IS THE USER EXPERIENCE CRITICAL TO CONTEXTUAL MARKETING? VIDEO 1: WHY IS THE USER EXPERIENCE CRITICAL TO CONTEXTUAL MARKETING? Hello again! I m Angela with HubSpot Academy. In this class, you re going to learn about the user experience. Why is the user experience

More information

Web Development & Design Foundations with HTML5

Web Development & Design Foundations with HTML5 1 Web Development & Design Foundations with HTML5 CHAPTER 5 WEB DESIGN Copyright Terry Felke-Morris 2 Learning Outcomes In this chapter, you will learn how to... Describe the most common types of website

More information

Lecture 6. Design (3) CENG 412-Human Factors in Engineering May

Lecture 6. Design (3) CENG 412-Human Factors in Engineering May Lecture 6. Design (3) CENG 412-Human Factors in Engineering May 28 2009 1 Outline Prototyping techniques: - Paper prototype - Computer prototype - Wizard of Oz Reading: Wickens pp. 50-57 Marc Rettig: Prototyping

More information

Planning Website CS 4640 Programming Languages for Web Applications

Planning Website CS 4640 Programming Languages for Web Applications Planning Website CS 4640 Programming Languages for Web Applications [Steve Krug, Don t make me think, Chapter 2] [Jakob Nielsen and Hoa Loranger, Prioritizing Web Usability, Chapter 2] [Sean McManus, Web

More information

Network Concepts Web Marketing Basics NCI Web Development

Network Concepts Web Marketing Basics NCI Web Development Web Marketing Basics NCI Web Development www.nciwd.com www.ncihosting.com Corporate Office 326 N. Main Street Souderton, PA 18964 Phone 215-723-3495 Service & Training Center 1250 Bethlehem Pike Ste E

More information

Fundamentals of Web Design

Fundamentals of Web Design Fundamentals of Web Design Purpose of Web Design Inform/Educate Persuade Influences on Web Design Technology Used by Both Target Audience and Designer Nature of the Content Economy (Budget, Time, and Scale

More information

Usability Audit: Findings + Recommendations: Introduction:

Usability Audit: Findings + Recommendations: Introduction: Usability Audit: Findings + Recommendations: Introduction: This report contains observations and recommendations on the site of X: www.x.com. NOTE: This analysis is based on Usability guidelines that come

More information

4. You should provide direct links to the areas of your site that you feel are most in demand.

4. You should provide direct links to the areas of your site that you feel are most in demand. Chapter 2: Web Site Design Principles TRUE/FALSE 1. Almost every Web site has at least one flaw. T PTS: 1 REF: 49 2. Not only should you plan for a deliberate look and feel for your Web site, but you must

More information

Download Free Pictures & Wallpaper from the Internet

Download Free Pictures & Wallpaper from the Internet Download Free Pictures & Wallpaper from the Internet D 600 / 1 Millions of Free Graphics and Images at Your Fingertips! Discover How To Get Your Hands on Them Almost any type of document you create can

More information

Font size. Tabl:e 2-4 Font Size Examples. Chapter 2.. Page Layout and Design 47. (font si ze="3"> (fo nt s ize="+l"> (font size="-l">

Font size. Tabl:e 2-4 Font Size Examples. Chapter 2.. Page Layout and Design 47. (font si ze=3> (fo nt s ize=+l> (font size=-l> Chapter 2.. Page Layout and Design 47 There are some limitations to using fonts. Although there are many fonts to choose from, for users to view those fonts, they have to be registered on the user's system.

More information

Working with Images and Multimedia

Working with Images and Multimedia CHAPTER Working with Images and Multimedia You can make your web page more interesting by adding multimedia elements. You can download the files featured in this chapter from www.digitalfamily.com/tyv.

More information

Edexcel CiDA Course Overview

Edexcel CiDA Course Overview Edexcel CiDA Course Overview Level 2 Certificate in Digital Applications: Graded A*-C 2 units Coursework & examination Assessment objectives: Applying creative processes to design digital products Selecting

More information

Working with WebNode

Working with WebNode Workshop 28 th February 2008 Page 1 http://blog.larkin.net.au/ What is WebNode? Working with WebNode WebNode is an online tool that allows you to create functional and elegant web sites. The interesting

More information

Template Tidbits. Q How do I get the places I can enter copy to show up? (Highlight Fields Bar)

Template Tidbits. Q How do I get the places I can enter copy to show up? (Highlight Fields Bar) Template Tidbits This document is not intended to replace the individual guidance documents that accompany each template. Instead, it is a general document that addresses questions frequently asked by

More information

SOCIAL MEDIA IMAGE & VIDEO SIZES 2019

SOCIAL MEDIA IMAGE & VIDEO SIZES 2019 SOCIAL MEDIA IMAGE & VIDEO SIZES 2019 Profile Image: 180 x 180 px Cover Photo: 820 x 312 px - Must be at least 180 x 180 pixels. - Photo will appear on page as 170 x 170 pixels. - Photo thumbnail will

More information

8/19/2018. Web Development & Design Foundations with HTML5. Learning Objectives. Overall Design Is Related to the Site Purpose. Website Organization

8/19/2018. Web Development & Design Foundations with HTML5. Learning Objectives. Overall Design Is Related to the Site Purpose. Website Organization Web Development & Design Foundations with HTML5 Ninth Edition Chapter 5 Web Design Slides in this presentation contain hyperlinks. JAWS users should be able to get a list of links by using INSERT+F7 Learning

More information

ABCs of Direct Mail. Tips for More Effective Marketing Publications

ABCs of Direct Mail. Tips for More Effective Marketing Publications ABCs of Direct Mail Tips for More Effective Marketing Publications ABCs of Direct Mail 2 Introduction Direct mail is a growing business and everyone is eager and excited to jump on board. The problem is

More information

Systems Analysis and Design in a Changing World, Fourth Edition

Systems Analysis and Design in a Changing World, Fourth Edition Systems Analysis and Design in a Changing World, Fourth Edition Learning Objectives Describe the difference between user interfaces and system interfaces Explain why the user interface is the system to

More information

There are four (4) skills every Drupal editor needs to master:

There are four (4) skills every Drupal editor needs to master: There are four (4) skills every Drupal editor needs to master: 1. Create a New Page / Edit an existing page. This entails adding text and formatting the content properly. 2. Adding an image to a page.

More information

University of Manitoba Web Standards Guidelines

University of Manitoba Web Standards Guidelines University of Manitoba Web Standards Guidelines The web is a powerful communications tool. The experience visitors have when they come to our site can either positively or negatively impact their associations

More information

Strong signs your website needs a professional redesign

Strong signs your website needs a professional redesign Strong signs your website needs a professional redesign Think - when was the last time that your business website was updated? Better yet, when was the last time you looked at your website? When the Internet

More information

1. You re boring your audience

1. You re boring your audience 1. You re boring your audience OK, so you ve convinced your users to visit your landing page. Or even better they ve signed up for your mailing list. That s great! Now that you have their attention, the

More information

Exemplar for Internal Achievement Standard. Technology Level 1

Exemplar for Internal Achievement Standard. Technology Level 1 Exemplar for Internal Achievement Standard Technology Level 1 This exemplar supports assessment against: Achievement Standard 91046 (B) Use design ideas to produce a conceptual design for an outcome to

More information

Federal Plain Language Guidelines

Federal Plain Language Guidelines Federal Plain Language Guidelines March 2011 Revision 1, May 2011 Table of Contents Introduction... i Revision 1 Changes... ii Table of Contents... iii I. Think about your audience... 1 a. Identify and

More information

Interactive Tourist Map

Interactive Tourist Map Adobe Edge Animate Tutorial Mouse Events Interactive Tourist Map Lesson 1 Set up your project This lesson aims to teach you how to: Import images Set up the stage Place and size images Draw shapes Make

More information

Frequently Asked Questions about Text and Graphics

Frequently Asked Questions about Text and Graphics 1 Frequently Asked Questions about Text and Graphics 1. What is a font? A font is a set of printable or displayable text characters that are in a specific style and size. The type design for a set of fonts

More information

WHITE PAPER. Attract shoppers in less than 10 seconds or lose them.

WHITE PAPER. Attract shoppers in less than 10 seconds or lose them. WHITE PAPER Attract shoppers in less than 10 seconds or lose them. OVERVIEW Executive Summary 3 Content 3 Design 5 Conclusion 8 2 Executive Summary You have less than 10 seconds to grab a shopper s attention

More information

facebook a guide to social networking for massage therapists

facebook a guide to social networking for massage therapists facebook a guide to social networking for massage therapists table of contents 2 3 5 6 7 9 10 13 15 get the facts first the importance of social media, facebook and the difference between different facebook

More information

Due on: May 12, Team Members: Arpan Bhattacharya. Collin Breslin. Thkeya Smith. INFO (Spring 2013): Human-Computer Interaction

Due on: May 12, Team Members: Arpan Bhattacharya. Collin Breslin. Thkeya Smith. INFO (Spring 2013): Human-Computer Interaction Week 6 Assignment: Heuristic Evaluation of Due on: May 12 2013 Team Members: Arpan Bhattacharya Collin Breslin Thkeya Smith INFO 608-902 (Spring 2013): Human-Computer Interaction Group 1 HE Process Overview

More information

Workshop with ROCKWOOL editors. Helle Jensen, Senior ux consultant

Workshop with ROCKWOOL editors. Helle Jensen, Senior ux consultant Workshop with ROCKWOOL editors Helle Jensen, Senior ux consultant Agenda 1. Intro to UX and customer journeys 2. Intro to web content 3. Intro to blocks in EpiServer 4. Content guidelines 5. Exercise:

More information

Long term Planning 2015/2016 ICT - CiDA Year 9

Long term Planning 2015/2016 ICT - CiDA Year 9 Term Weeks Unit No. & Project Topic Aut1 1&2 (U1) Website Analysis & target audience 3&4 (U1) Website Theme 1 Assessment Objective(s) Knowledge & Skills Literacy, numeracy and SMSC AO4 evaluating the fitness

More information

CREATING A STYLE GUIDE FOR YOUR ORGANISATION

CREATING A STYLE GUIDE FOR YOUR ORGANISATION CIPR SKILLS GUIDE CREATING A STYLE GUIDE FOR YOUR ORGANISATION #CIPR @CIPR_UK WHY HAVE A STYLE GUIDE? Sloppy writing, jargon, long sentences and incomprehensible waffle ironically communicates one thing

More information

Instructions for Presenting & Preparing PowerPoint Presentations

Instructions for Presenting & Preparing PowerPoint Presentations Instructions for Presenting & Preparing PowerPoint Presentations Every speaker must visit the Speaker Ready Room to upload and/or check his or her presentation at least 24 hours prior to the start of the

More information

On the Web sun.com/aboutsun/comm_invest STAROFFICE 8 DRAW

On the Web sun.com/aboutsun/comm_invest STAROFFICE 8 DRAW STAROFFICE 8 DRAW Graphics They say a picture is worth a thousand words. Pictures are often used along with our words for good reason. They help communicate our thoughts. They give extra information that

More information

13 TIPS TO IMPROVE YOUR WEB SITE

13 TIPS TO IMPROVE YOUR WEB SITE 13 TIPS TO IMPROVE YOUR WEB SITE Ellen Freedman, CLM 2017 I recently published an article entitled Get Mr. Spock Off Your Web Site! and the response from readers was wonderful. I have since gotten requests

More information

SOCIAL MEDIA IMAGE & VIDEO SIZES 2018

SOCIAL MEDIA IMAGE & VIDEO SIZES 2018 SOCIAL MEDIA IMAGE & VIDEO SIZES 2018 Profile Image: 180 x 180 px Cover Photo: 820 x 310 px - Must be at least 180 x 180 pixels. - Photo will Appears/will appear on page as 160 x 160 pixels. - Photo thumbnail

More information

Knowing how to use white space can be an effective tool in your design arsenal.

Knowing how to use white space can be an effective tool in your design arsenal. Knowing how to use white space can be an effective tool in your design arsenal. Let s start by addressing the elephant in the room white space (also known as negative space) isn t actually white. Don t

More information

Developing a Home Page

Developing a Home Page FrontPage Developing a Home Page Opening Front Page Select Start on the bottom menu and then Programs, Microsoft Office, and Microsoft FrontPage. When FrontPage opens you will see a menu and toolbars similar

More information

CHAPTER 3 WEB DESIGN BASICS KEY CONCEPTS

CHAPTER 3 WEB DESIGN BASICS KEY CONCEPTS BASICS OF WEB DESIGN CHAPTER 3 WEB DESIGN BASICS KEY CONCEPTS 1 LEARNING OUTCOMES Describe the most common types of website organization Describe principles of visual design Design for your target audience

More information

Preview from Notesale.co.uk Page 2 of 61

Preview from Notesale.co.uk Page 2 of 61 Modify a table Applying styles to tables; banding rows and columns; inserting total rows; removing styles from tables Filter and sort a table Filtering records; sorting data on multiple columns; changing

More information

OCR Interfaces for Visually Impaired

OCR Interfaces for Visually Impaired OCR Interfaces for Visually Impaired TOPIC ASSIGNMENT 2 Author: Sachin FERNANDES Graduate 8 Undergraduate Team 2 TOPIC PROPOSAL Instructor: Dr. Robert PASTEL March 4, 2016 LIST OF FIGURES LIST OF FIGURES

More information

DRAWING VECTOR VS PIXEL SHAPES IN PHOTOSHOP CS6

DRAWING VECTOR VS PIXEL SHAPES IN PHOTOSHOP CS6 DRAWING VECTOR VS PIXEL SHAPES IN PHOTOSHOP CS6 In this first tutorial in our series on drawing and working with shapes in Photoshop CS6, we ll take a quick look at the important difference between the

More information

Appendix A Design. User-Friendly Web Pages

Appendix A Design. User-Friendly Web Pages Appendix A Design User-Friendly Web Pages 2 How to Do Everything with FrontPage 2002 If you have surfed the Web for any significant period of time, you know that there are plenty of Web sites out there

More information

M150 -B / Unit 12. By Wawi. A good user interface design enables the user to effectively interact with the system and perform his tasks.

M150 -B / Unit 12. By Wawi. A good user interface design enables the user to effectively interact with the system and perform his tasks. A good user interface design enables the user to effectively interact with the system and perform his tasks. (True) HCI: (Human-Computer Interaction) is the study of how humans interact with computers

More information

Conrad Freeman Unit 6

Conrad Freeman Unit 6 Graphics Assessment. First graphical product: The first product is a picture of the website for Doritos. This product is probably designed for teenagers and adults, and is not for younger audiences (probably

More information

The Surface Plane. Sensory Design

The Surface Plane. Sensory Design The Surface Plane Sensory Design The Surface Plane At the top of the five-plane model, we turn our attention to those aspects of the product our users will notice first: the sensory design. Here, content,

More information

BETTER LOOKING S

BETTER LOOKING  S BETTER LOOKING EMAILS First impressions matter. So if you want a positive response to your email campaign you need to make a positive first impression. Here are some simple design strategies to help you

More information

THE 18 POINT CHECKLIST TO BUILDING THE PERFECT LANDING PAGE

THE 18 POINT CHECKLIST TO BUILDING THE PERFECT LANDING PAGE THE 18 POINT CHECKLIST TO BUILDING THE PERFECT LANDING PAGE The 18 point checklist to building the Perfect landing page Landing pages come in all shapes and sizes. They re your metaphorical shop front

More information

Web design and development ACS Chapter 5. Working with Text

Web design and development ACS Chapter 5. Working with Text Web design and development ACS-1809 Chapter 5 Working with Text 1/25/2018 1 Working with Text In this chapter we will study Ensuring Onscreen Readability Adding Logical Emphasis to Sections of Text Style

More information

Prezi PREZI ONLINE ACCOUNT START FROM A TEMPLATE

Prezi PREZI ONLINE ACCOUNT START FROM A TEMPLATE Prezi PREZI ONLINE ACCOUNT Go to www.prezi.com/pricing/edu and sign up for an online only account. This account is available anywhere in the world as long as you have access to the internet. After creating

More information

WordPress User Interface Expert Review Gabriel White Version 1.0 DRAFT March, 2005

WordPress User Interface Expert Review Gabriel White Version 1.0 DRAFT March, 2005 WordPress User Interface Expert Review Gabriel White Version 1.0 DRAFT March, 2005 WordPress User Interface Expert Review, Gabriel White (v1.0 Draft, March, 2005) 2 Copyright Copyright Gabriel White, 2005.

More information

Real Wireframes Get Real Results

Real Wireframes Get Real Results Page 1 of 7 Real Wireframes Get Real Results by Stephen Turbek Published on 09/19/2006 19 Comments 8,935 Views How many times have you been asked, So, is the new website going to be black Just because

More information

Web publishing training pack Level 2 Extend your knowledge of the web publishing system

Web publishing training pack Level 2 Extend your knowledge of the web publishing system Web publishing training pack Level 2 Extend your knowledge of the web publishing system Learning Objective: Understanding of concepts to enhance web pages look, streamline web publishing and evaluate your

More information

India. A Prototype Analysis of the Indian Government Website

India. A Prototype Analysis of the Indian Government Website India A Prototype Analysis of the Indian Government Website List of Figures Fig 1 Top right links on Home page in English and in Hindi page 5 Fig 2 Bottom links on Home page in English and in Hindi page

More information

Prototyping. Readings: Dix et al: Chapter 5.8 Marc Rettig: Prototyping for tiny fingers, Communications of the ACM, April 1994.

Prototyping. Readings: Dix et al: Chapter 5.8 Marc Rettig: Prototyping for tiny fingers, Communications of the ACM, April 1994. Prototyping Readings: Dix et al: Chapter 5.8 Marc Rettig: Prototyping for tiny fingers, Communications of the ACM, April 1994. 1 What is prototyping? producing cheaper, less accurate renditions of your

More information

Heuristic Evaluation of NUIG Participate Module 1

Heuristic Evaluation of NUIG Participate Module 1 Heuristic Evaluation of NUIG Participate Module 1 Nielsen s 10 Usability Heuristics (Nielsen & Mack, 1994) 1. Aesthetic & Minimalist Design Pages should not contain information which is irrelevant or rarely

More information