Chapter 5 Flashcards

1
Q

Above the fold

A

The content that appears on a screen without a user having to scroll.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
2
Q

Accessibility

A

The degree to which a website is available to users with physical challenges or technical limitations.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

Breadcrumbs

A

Links, usually on the top of the page, that indicate where a page is in the hierarchy of the website.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
4
Q

Call to action

CTA

A

A phrase written to motivate the reader to take action such as sign up for our newsletter or book car hire today.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
5
Q

Content audit

A

An examination and evaluation of existing content on a website.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
6
Q

Content

strategy

A

In this context, a plan that outlines what content is needed for a web project and when and how it will be created.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

Convention

A

A common rule or tried-and-tested way in which something is done.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

Conversion

A

Completing an action or actions that the website wants the user to take. Usually a conversion results in revenue for the brand in some way. Conversions include signing up to a newsletter or purchasing a product.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

Credibility

A

In this context, how trustworthy, safe and legitimate a website looks.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
10
Q

Fidelity

A

An interface design. A low-fidelity prototype will be basic, incomplete and used to test broad concepts. A high fidelity prototype will be quite close to the final product, with detail and functionality and can be used to test functionality and usability.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
11
Q

Information

architecture

A

The way data and content are organised, structured and labelled to support usability

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
12
Q

Navigation

A

How a web user interacts with the user interface to navigate through a website, the elements that assist in maximising usability and visual signposting so users never feel lost.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
13
Q

Prototype

A

Interactive wireframes, usually of a higher fidelity, that have been linked together like a website

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
14
Q

Responsive

design

A

A design approach that enables a website display to change depending on the size of the viewport or screen, regardless of the device on which it is displayed.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
15
Q

Search engine
optimisation
(SEO)

A

The process of improving website rankings on search engine results pages.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
16
Q

Sitemap

A

On a website, a page that links to every other page in the website, and displays these links organised according to the information hierarchy. In UX terminology, this is the visualised structural plan for how the website’s pages will be laid out and organised.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
17
Q

Usability

A

A measure of how easy a system is to use. Sites with excellent usability fare far better than those that are difficult to use.

18
Q

User-centred

design (UCD)

A

The design philosophy where designers identify how a product is likely to be used, taking user behaviour into consideration and prioritising user wants and needs. UCD places the user at the centre of the entire experience.

19
Q

User experience design (UXD)

A

The process of applying proven principles, techniques and features to create and optimise how a system behaves, mapping out all the touchpoints a user experiences to create consistency in the interaction with the brand.

20
Q
User interface
(UI)
A

The user-facing part of the tool or platform i.e. the actual website, application, hardware or tool with which the user interacts.

21
Q

Wireframe

A

The skeletal outline of the layout of a web page. This can be rough and general, or very detailed.

22
Q

Online UX can be divided into two broad categories.

A
  • Functional UX

* Creative UX

23
Q

Functional UX

A

This covers the elements of the user experience that relate to actually using the tool such as working technical elements, navigation, search and links.

24
Q

Creative UX

A

This is the bigger, harder to define impression created by the tool. The so-called ‘wow’ factor that covers visual and creative elements.

25
Q

Six qualities that make up good UX

A
  • Findability – Can I find it easily? Does it appear high up in the search results? How long does it take me to find something on the site? Does the three click rule work on this site?
  • Accessibility – Can I use it when I need it? Does it work on my mobile phone, or on a slow Internet connection? Can I use it as a disabled person?
  • Desirability – Do I want to use it? Is it a pleasant experience, or do I dread logging in?
  • Usability – Is it easy to use? Are the tools I need intuitive and easy to find?
  • Credibility – Do I trust it? Is this website legitimate?
  • Usefulness – Does it add value to me? Will I get something out of the time I spend interacting with it?
26
Q

When designing for the user, you need to ask the following questions:

A
  • Who is the user?
  • What are the user’s wants and needs from your platform?
  • Why is the user really coming to your website?
  • Where is the user most likely to be in their customer journey when they visit your site?
  • What are the user’s capabilities, web skills and available technology?
  • How can the site facilitate the customer journey to conversion and purchase?
  • What features would make the user’s experience easier and better?
27
Q

Today, more than half of web traffic originates from…

A

…a mobile device, with users accessing the Internet through either a smartphone or tablet (think with Google, 2016).

This number is increasing every year and is
expected to be over 70% by 2019 (Internet Society, 2015). Therefore, designing for mobile must be a priority.

28
Q

Mobile users are…

A
  • Goal orientated
  • Time conscious
  • Search dominant
  • Locally focused
29
Q

The limitations of mobile…

A
  • Small screens
  • Difficult inputs
  • Slow connection speeds
  • Slow hardware
30
Q

3 main approaches to creating mobile-accessible content

A
  1. Mobile websites (called mobi sites)
  2. Native and web applications (called apps)
  3. Responsive websites (websites that adapt to the device).
31
Q

One of the most important aspects of usability involves sticking to conventions, which are simply common rules or ways of displaying or structuring things on the
web. Popular conventions include:

A
  • Links that are blue and underlined
  • Navigation menus at the top or left of the web page
  • The logo in the top left hand corner which is linked to take the user back to the home page
  • Search boxes placed at the top of the page, using standard wording such as ‘search’, or a magnifying glass icon.
32
Q

Key ‘dont’s’ when it comes to building a user-friendly and usable website:

A
  • Never resize windows or launch the site in a pop-up.
  • Do not use entry or splash pages i.e. a page that site visitors encounter first before reaching the home page.
  • Flash is no longer used to design websites. Unaided, most search engine spiders cannot effectively crawl Flash sites, and Flash usually doesn’t work on many mobile devices.
  • Don’t distract users with ‘Christmas trees’ such as blinking images, flashing lights, automatic sound, scrolling text and unusual fonts.
33
Q

best practices for mobile

A
  • Reduce loading time. Try to keep content and actions on the same page as this ensures better performance as there are fewer page loads. Encourage exploration especially on touchscreens, users like to browse elements and explore. This makes them feel in control.
  • Give feedback. Ensure that it is clear when the user performs an action. This can be achieved through animations and other visual cues.
  • Communicate consistently. Ensure that you deliver the same message across all your touchpoints, for example, using the same icons on the website as you would on the mobile app prevents users from having to relearn how you communicate.
  • Predict what your user wants. Include functionality such as autocomplete or predictive text. Remove as much manual input as possible to streamline user experience.
34
Q

In UX projects, which option is almost always the more user-friendly one?

A

the simpler one

35
Q

Simplicity can mean several things:

A

• Lots of empty space. In design terms, this is referred to as negative or white space. Though, of course, it need not specifically be white. Dark text on a light background is easiest to read. In general, the more effectively ‘breathing room’ is placed between various page elements, lines of text, and zones of the
page, the easier it is for the user to grasp where everything is.

  • Fewer options. Studies have found that people faced with fewer choices generally choose more quickly and confidently, and are more satisfied with their decision afterwards (Roller, 2010).
  • Plain language. Unless your website is aimed at a highly specialised technical field, there’s usually no need to get fancy with the words you use. Clear, simple, well-structured language is the best option when creating a great user experience.

• Sticking to conventions. As we’ve said before, conventions are excellent shortcuts for keeping things simple for users. There’s no need to reinvent the
wheel and try to teach your users a whole new way of navigating a website.

36
Q

Cues that visitors use to determine the credibility of a website:

A
  • Looks – does it look professional and beautiful?
  • Prominent phone numbers and addresses are easy to locate – this assures the visitor that there are real people behind the website, and that they are easily reachable.
  • Informative and personal ‘About us’ – some customers want to see the inner workings of a company and are interested in the head honchos. Consider including employee pictures and profiles to add personality to the site.
  • Genuine testimonials – testimonials are a great way to show potential customers what your current customers have to say about your organisation. Trust is vital, and this is one way to encourage it. Video testimonials can be particularly effective, assuming your audience does not face data restrictions.
  • eCommerce – using a reputable sales channel helps your websites credibility.
  • Social media – having a social media presence often goes further towards establishing credibility than testimonials, which could have been faked.

• Logos of associations and awards – if you belong to any relevant industry associations or have won any awards feature them. Not only does this go a long way towards establishing your credibility, but it will show that you’re at
the top of your game, a notch above the competition.

  • Links to credible third-party references or endorsements – this is a way to assert your credibility without tooting your own horn.
  • Fresh, up-to-date content – a news section that was last updated a year ago implies that nothing has happened since or that no one cares enough to update it.

• No errors – spelling and grammar mistakes are unprofessional, and while the large majority of readers may not pick them up, the one or two who do will
question your credibility. This extends to broken links, malfunctioning tools, and interactive elements that don’t work as advertised.

37
Q

The points that UX needs to address are:

A
  • What the site should achieve
  • What the user wants and needs
  • What makes the content unique, valuable or different
  • The tone and language used
38
Q

Principles of creating content

A
  1. Structure
    • Highlighting or bolding key phrases and words
    • Using bulleted lists
    • Using paragraphs to break up information
    • Using descriptive and distinct headings
  2. Hierarchy: On the page, use an inverted pyramid style or F structure for your copy.
  3. Relevance
39
Q

Sitemap

A

The visualised structural plan for how the website’s

pages will be laid out and organised.

40
Q

“What do I test?”

“When do I test it?”

A

Test as much as possible, as often as possible,

and as early as possible.

41
Q

Tools of the trade

A

Balsamiq (https://balsamiq.com) bills itself as a ‘rapid wireframing tool’ and is great for creating fun, low-fidelity wireframes and simple prototypes.

Axure (www.axure.com) is an all-purpose prototyping tool that allows you to create fully interactive wireframed websites without needing to code anything. A useful
feature is that it also generates technical specifications for developers to work from based on the interactions and links created in the prototyping process.

Gliffy (www.gliffy.com) is a web-based tool that allows you to create a wide range of diagrams, everything from wireframes to sitemaps to charts.

Invision (www.invisionapp.com) is a web based tool that allows you design prototypes across web and mobile.

Morae (www.techsmith.com/morae.html) is a good place to start if you’re looking for a web-based replacement for user labs.

Pop (https://marvelapp.com/pop/) or Prototyping on Paper, is a free app for prototyping apps on mobile.