Website Context and History

advertisement
Website Context and History:
An Overview and Design Proposal
Luc Tiemessen
luctiemessen {at} gmail {dot} com
ABSTRACT
In this paper, we describe an overview of the work that is being
done for supporting users while browsing the World Wide Web
(WWW). We describe the problems users face when visiting
multiple pages in different website environments. We evaluate
different approaches to solve the “Lost in Hyperspace”
(Conklin, 1987) problem. While evaluating several articles, we
distinguished two different approaches; the first is the
evaluation of the “Back” button and its implementation, the
second is the facilitation of (navigational) context in order to
give users handles for orientation within the hyperspace. At first
these two approaches seem different but we think the
functionality of both approaches overlap each other and can
potentially support each other in their core function. Finally, we
will take a look at how aesthetics can or should play a role in
the design of the additional (navigational) context and propose
an implementation for the back button and present guidelines
for page designers.
Keywords
User interfaces, Browsers, Web Navigation, History and revisitation, Navigational Maps.
the “disorientation problem”. We will give an overview of the
work done in solving this disorientation problem where
additional features are added to browsers in order to prevent
users from having this problem.
In addition, we discuss the back button for revisiting pages
users have already visited. The “hub-and-spoke” navigation
(Catledge & Pitkow, 1995) is one type in which the back button
is very useful but fails to remember all the pages users visit.
This is caused by the functional model behind the back button.
The model behind the back button is a stack (Greenberg, Ho, &
Kaasten, 2000) which in some circumstances pops a visited
page of the stack and replaces it with a newer page. This
behavior is not always desired. Revisiting pages is 58% of all
the page visits web users do when they browse the web
(Tauscher & Greenberg, 1997). Other recent experiments point
out that this percentage can be between 38% (Herder, 2006, p.
128), and 80% (Cockburn & McKenzie, 2001) so with the
millions of people browsing even more webpages every second
of the day, any minor improvements on this mechanism is
advisable.
2. LITERATURE STUDY
1. INTRODUCTION
The WWW has expanded exponentially in the past decades,
with enormous increase of web pages, images, and complex
content. The amount of people using the web (users) has also
increased enormously. One of the things that has been left
behind are the web browsers and their user interaction design
(UID). Browsers are constantly updating their engines with new
support for W3C standards (W3C, 2008) and improving their
preformance but the graphical user interface (GUI) has not
evolved significantly (apart from being slimmed down). The
“Back” and “Forward” buttons already appeared in the first
major browsers (NCSA, 2009) and are still present in modern
browsers like Firefox (Mozilla, 2009) and Safari (Apple Inc.,
2009). Not much browsing functionality has been added in the
past few years to aid its users while navigating.
The “Lost In Hyperspace” (LIH) problem is known for years
(Conklin, 1987) and is a problem that is possibly to be solved
by the browser developers. Conklin states that users can lose
track of their virtual environment, not being aware of their
location on the page and navigational possibilities. He calls this
Permission to make digital or hard copies of all or part of this work for
personal or classroom use is granted without fee provided that copies
are not made or distributed for profit or commercial advantage and that
copies bear this notice and the full citation on the first page. To copy
otherwise, or republish, to post on servers or to redistribute to lists,
requires prior specific permission.
1st Twente Caput & Referaat Conference, Enschede 14 June 2004
Copyright 2004, University of Twente, Faculty of Electrical
Engineering, Mathematics and Computer Science
Lost in hyperspace occurs when users are not able to pinpoint
their location in a website. This problem can have many causes.
The most important, is the lack of contextual information and
structure in the website. When users experience cognitive
overload or disorientation on a webpage (Park & Kim, 2000),
this is often caused by the lack of spatial and temporal context.
Spatial context meaning awareness of the location on the
webpage through structure or visual aids like site maps,
navigation menus and index pages. Temporal context meaning
awareness of the way that led to this situation by showing back
and forwards buttons, visual navigation histories and
bookmarks (Herder, 2006, p. 133).
Much research is done on extending browsers with the
capability of showing more contextual information.
An overview of different research on designing for WWW
navigation is presented by (Cockburn & Jones, 1992). They
identify five issues in the design and functionality of the
visualization systems they reviewed:
1.
2.
3.
4.
5.
Characteristics of the visual representation;
Scope of the subspace representation;
Mechanisms for generating the visualization;
Degree of browser independence;
Navigation support facilities.
These five issues form a nice starting point for our search for
improvements in the design of WWW navigation as a whole
(browser, website, user and their interaction with each other).
When searching for research on browser capabilities, backwards
navigation, user support, contextual information, and solving
the lost in hyperspace problem, it soon becomes clear that a lot
of research has been done varying from extending the browser
with custom programmed tools (Cockburn, Greenberg,
McKenzie, Jasonsmith, & and Kaasten, 1999; Medynskiy,
Dontcheva, & Dontcheva, 2009) to the usage of the back button
(Greenberg, Ho, & Kaasten, 2000; Greenberg & Cockburn,
1999; Orner & MacKenzie, 2006).
One common behavior of users is the hub-and-spoke browsing
method where users return to an index page with several links to
“child” pages in order to search for specific information or just
to scan the content of the entire website (Catledge & Pitkow,
1995). Thus, a hub contains a collection of links leading to a
child website (“spoke”). When users search for information
from a hub and return to this hub when no satisfactory
information was found on the spoke, users go back to the hub
and try to find the desired information. This going back to the
original information point is called backtracking (Bieber &
Wan, 1994). The amount of backtracking activities by users
depends greatly on their task at hand. When users are executing
a goal directed task, (i.e. finding a specific piece of information)
backtracking is more common than when users are freely
exploring the web (i.e. browsing for fun or scanning for news
on news websites) (Herder, 2006, p. 128).
In the next sections we will distinguish the back button and the
context features. With context features we mean the contextual
information displayed on the webpage to prevent users from
being lost in hyperspace. The back button will be analyzed
separately on its current behavior and related research. In the
results section we try to find where these functionalities can join
forces.
2.1 Back button
As described above, of all the visits of web pages, almost 60%
is a page that is visited before by the same user. This user
accesses these pages though normal browsing (typing the
appropriate URL or navigating via another hyperlink),
bookmarks (3%), URL’s accessed via the browser’s history
feature (<1%), the forward button (1%) and most importantly,
the back button (30%) (Tauscher & Greenberg, 1997; Kaasten
& Greenberg, 2000).
With this vast amount of usage, one should expect users to fully
comprehend functionality or model behind the back button. This
is however, very untrue (Cockburn & McKenzie, 2001;
Greenberg, Ho, & Kaasten, 2000). They have indicated that
users cannot predict the behavior of the back button correctly
(even sometimes when the users were certain about their
answer) and use the back button until they visually recognize
the page they are looking for. This asks of a serious rethinking
about the usefulness of the model behind the back button, even
more since the current model has a big disadvantage over other
possible models. At this moment of writing, most modern
browsers have implemented the same model behind the back
button. The back button is not just an indicator to a simple list;
the most fitting name of the underlying model of the back
button is a “stack”.
2.1.1 Stack back
Most modern browsers have implemented the stack as a model
behind the back button. In this section we describe the actual
functionality of this model and what the advantages and
drawbacks are.
The stack is analyzed by (Greenberg, Ho, & Kaasten, 2000) and
works as follows:
Figure 1 Browsing path
Figure 1 shows the click path of a user. The black (straight)
arrows represent the clicking action on a hyperlink; the grey
(curved) arrows represent the users’ action of clicking on the
back button of the browser (thus, not via internal hyperlinks).
The user navigates from node A to B, to C, to D. Now the stack
contains the following elements in chronological order (most
recent on top/end): [A,B,C,D]. Then, the user uses the back
button to go back to page B, on this page B, a link to page E is
clicked and with that, the nodes C and D are pruned from the
stack. The stack now looks like this: [A,B,E] and users are
unable to get back to node C and D with only the back and
forward buttons. The stack has great support for hub and spoke
browsing and backtracking but we think the drawback of the
pruning of the nodes might be one that is solvable with the right
model, implementation and facilities.
The stack is not the only model that has been a subject of
research over the years. Recency is a variant which does not
have the drawback of pruning but throws up other problems.
2.1.2 Recency back
Recency is a model presented by (Greenberg, Ho, & Kaasten,
2000) which differs from a stack in a way that the most recently
visited page is put on the end of a list. No matter how many
times, a user clicked on the back button, the latest visited site is
always on the end of the list. The biggest advantage of this is
that no pages are pruned. Other research has showed that the
Lost in Hyperspace occurs fewer times when the recency back
model is used (Orner & MacKenzie, 2006). This phenomena
can be explained by the simple fact that users are not looking
for pages they cannot find since they are always (even if it takes
a few more clicks) available.
Recency back cannot be just an ordinary list with the most
recently visited node on top. When users follow the path of
Figure 1, when these users reach node D, the list looks like this:
[A,B,C,D] to go back to node b many people would probably
suggest two clicks back. This is wrong. Strictly taken, when
clicking the back button from node D, the newest node on top of
the stack would become C, resulting in the list to become
[A,B,C,D,C] so far so good but now we can see the problem
when we hit the back button for the second time. Since C is the
new latest item and the user came from D, now, D is the most
recently visited node. This model would switch endlessly from
C to D and back. So to make this model usable we have to make
some adjustments and Greenberg came up with multiple
implementations (Greenberg & Cockburn, 1999). Their starting
point was to remove the duplicates from the list, pruning al
duplicates by keeping only one single copy in its most recent
position in order to keep the list of items as small as possible.
However, this did not solve the cycling problem of the last two
nodes. Therefore they came up with three different
implementations.
•
•
•
Adding spokes only
Hub and spoke enhancement
Temporal ordering enhancement
Adding spokes only adds all new pages to the end of the list,
removing the older ones in the list. This however results in bad
performance for hub and spoke navigation. When only spokes
are added to the end of the list, while hitting the back button to
get back to the hub, users have to hit the back button n times,
where n is the amount of spokes accessed from the latest hub.
Hub and spoke enhancement solves the previous problem by
adding both previous and current node to the end of the list. The
temporal ordering enhancement is an implementation where the
exact order of the previous nodes is preserved. This can be
achieved by keeping track of a second list of visited nodes when
users hit the back button. This second list can be added at the
end of the first list and before the new node when the user clicks
a new link.
as showing the title of the recently visited pages). In addition
they indicated where hub pages in the history list were located
so users are able to quickly access the important pages.
In their research they concluded that all these alternatives can
produce unpredictable results for users.
Most of these researches showed improved results on
backtracking support, reducing “lostness” and revisitation.
2.2 Context features
With context features we try to discover features designed by
page designers and browser developers to support the user in
keeping track of where they are in hyperspace.
In the information visualization research area there has been a
lot of work done on usability guidelines by Nielsen (2002),
Shneiderman (1998) and many, many more. These guidelines
give page designers and browser developers handles to design
and develop a good user experience on the web by pointing out
what they should keep in mind while designing or developing
websites or browsing applications.
Many of these rules are applicable to our problem of providing
context to users (i.e. location, click path, origin, shortcuts,
possibilities etc.). We will give an overview of some of the
research done on improving contextual information for users
within hyperspace.
One of the many browser features researchers are addressing is
the visualization of the browsing history. One could see it as a
list with icons, text, images that represent the stack model
underneath the back button. This gives the user information on
how they have reached the current location and gives them the
possibility to visually recognize recently visited pages
(Cockburn, Greenberg, McKenzie, Jasonsmith, & and Kaasten,
1999; Chakrabarti, Gibson, & Mccurley, 1999; Ayers & Stasko,
1995). In their experiments they all implemented a sidebar or
separate screen in which all visited pages were displayed with
title, thumbnail and hierarchical structure. This gives the user
the ability to view the path they followed to get to the current
location, accompanied with information about how the pages
visually looked by including thumbnails of the visited web
pages.
Other research proposed improvements on the back button
(Milic-Frayling, Jones, Rodden, Smyth, Blackwell, &
Sommerer, 2004; Orner & MacKenzie, 2006).
These
experiments made it possible to see the navigational history in
textual form. Orner’s research gives users insight in the model
behind the back button. In their research they use the recency
back model and make it accessible with only the back and
forward buttons, therefore facilitating users to maintain all of
their browsing history and making it accessible with common
control features (back and forward buttons). Although we think
these solutions are somewhat interruptive, they show interesting
approaches to maintaining the history list. Milic-Frayling’s
research improved the back button with adding groupings to the
buttons’ dropdown functionality (where the user can hold the
back button down, showing a list of visited pages, almost all
modern browsers have this functionality but only implemented
Other research implemented a history search system for back
navigation. (Won, Jin, & Hong, 2009; Kaasten & Greenberg,
2000) with thumbnails. These researches experimented with the
improvement of the history list. The history list is the list of
visited items and in most cases in modern browsers this is
another list of visited pages than the stack list behind the back
button. The history list is the complete list of most recently
visited pages, in contrast with the back button; no nodes are
pruned regardless of the browsing path. Their research
improved the history with a search function, thumbnails and
more contextual information about the visited webpage.
Park & Kim (2000) evaluated the actual availability of
contextual information in general, evaluating two different types
of websites measuring the browsing efficiency and improving
subjective ease of navigation. The measurements showed
significant improvements of the performance of browsing tasks,
regardless of the type of website. They carried out their research
with only page design enhancements. No additional browser
dependent application was written. They carefully thought about
the possible navigational actions of the users and adjusted the
page design to enable easier hierarchical navigation with links
to siblings, parents, grandparents and children. This adding of
important links can improve users’ question “what can I do?” or
“where can I go?” another important question remains
unanswered: “how did I get here?”. By adding temporal content
to the page, users are able to answer this question (Theng,
Thimbleby, & Jones, 1996).
We evaluated research concerning the back button and
contextual information. When we look at the many researches
done by others we can see that some of the researchers who
proclaim to deliver more contextual information, are actually
visualizing the previously visited web pages (Cockburn,
Greenberg, McKenzie, Jasonsmith, & and Kaasten, 1999;
Kaasten & Greenberg, 2000; Milic-Frayling, Jones, Rodden,
Smyth, Blackwell, & Sommerer, 2004; Tabard, Mackay,
Roussel, & Letondal, 2007) accessible through the back button.
When delivering information about the history of the visited
web pages, the users get more contextual information. The only
problem is that this information is not instantly visible or
accessible via the back button although as few as possible
actions should be carried out to reach this information
(Tauscher & Greenberg, 1997).
3. RESULTS
As described earlier in this paper, users do not have a good
mental model about the functionality of the back button and use
the button to go back (as if it was a plain list) and visually
recognize the page they are looking for. When this page does
not appear, users can feel lost in hyperspace. We think that if
users have a poor mental model of the back button we should
consider removing the big disadvantage of this stack namely,
the pruning of visited pages. We think that the advantages of
recency – being no loss of visited pages – will be bigger than
their downside – being possible unpredictable behavior. Since
users tend to “click-till-recognize” (ironically, caused by their
poor understanding of the stack back button) we think the most
important thing to do is to store every visited page.
Given the fact that users tend to “click-till-recognize” we think
we can support the users in giving information about the
previously visited pages before they reach the desired page. By
simply visualizing these pages by icons that represent the page
(Teevan, et al., 2009) or by displaying a thumbnail of the entire
page when only hovering over the back button. The hover
action can initiate a small non-interruptive screen which shows
the user an overview of the most recently visited web pages.
by other browsers – was considered while designing the
alternative.
This possible solution obviously implies browser vendors to
implement it. The browser should keep track of a list of URL’s
and make screen captures of these websites and link them to
their URL. Page designers cannot do this with the current
technology, although Firefox’ extension library makes it easier
for third party developers to add functionality to the browser but
this is highly browser dependent.
The list of design guidelines we propose in order to give users
more recognition, handles and feedback is described below.
Research has already indicated that it will be useful when for
every page can be determined if it is a hub (Milic-Frayling,
Jones, Rodden, Smyth, Blackwell, & Sommerer, 2004). We
think the World Wide Web Consortium (W3C, 2008) can play a
crucial role in this. If they make it possible for page designers
and developers to manually indicate hub pages, this could be
used by browser vendors to support users with visualizations.
While searching for information on solving the lost in
hyperspace problem we took a step back and came to the
following conclusion: No matter how ingenious the
implementations of the researchers were, many researches seem
to ignore the role of the design of the web page itself since they
try to develop browser extensions or external tools to add more
functionality on the browser by implementing additional
windows or additional interactive elements within the page.
They did not question the possibility of having current
technologies solve these problems with a few exceptions
(Danielson, 2002; Hanson, 2007). Some research was done
based on technologies that should (due to accessibility
drawbacks) no longer be used like html frames (Chakrabarti,
Gibson, & Mccurley, 1999). We think that many improvements
can be made nowadays with design guidelines instead of
additional features to resolve the lost in hyperspace problem
because the development of CSS, JavaScript, and XHTML and
Server Side Scripts like PHP or Python can deliver more
information than currently used (in general). Not only the
website technology has evolved, also the hardware technology
has, users nowadays have more CPU power, more screen real
estate and more bandwidth than several years ago. Bigger
resolutions can lead to more detailed information, more CPU
power can lead to more complex interaction patterns, and more
bandwidth can lead to more interaction within a page. In unison
of what other researchers argued (Theng, Thimbleby, & Jones,
1996) we think many of the lost in hyperspace problems are
caused by bad page design. This is why we decided to formulate
some design guidelines that meet today’s possibilities and will
be suitable for page designers to use in their daily work.
4. DESIGN CONSIDERATIONS
This section describes the design considerations that can be
made when implementing our suggestions. As stated earlier, for
the contextual information enhancement we will set up some
guidelines for page designers. These guidelines will partly
overlap with the many earlier written guidelines but we focused
on the support of context information to prevent lost users.
The back button design considerations result in some proposals
for the implementation of our improvements. In designing the
improvements, browser independence was taken into account.
This means that no specific browser functionality – not shared
We split this chapter in two sections. The first handles the visual
design guidelines for contextual information, in the second we
describe our reflections on redesigning the behavior of the back
button.
4.1 Visual design guidelines
Expose page origin and destination
If the site facilitates a strong hierarchical structure, enable users
to see it as such. Remember to show users the way they took to
get where they currently are and think along with the users
about their possible destinations and highlight these (Conklin,
1987; Weinreich, Obendorf, & Lamersdorf, 2001). This
facilitates the user with a logical “back” or “undo” action.
Visualize the page hierarchy
Hierarchy or sections can be visualized with color or visual
indentation. Visual distinction helps users to indicate they are in
another section of the site (Conklin, 1987).
Use color with tact
Design visited links with different colors so users are visually
triggered (Weinreich, Obendorf, & Lamersdorf, 2001).
Keep navigation nearby
On every location of the page, the user must have some clue on
how to get to a location where he can choose which way he
wants to go. This does not necessarily mean that the navigation
should be visible on every spot on the page, though users should
be able to reach the navigation with ease.
Visualize impact
If links are taking the user to another domain or window, clarify
this with an icon (Weinreich, Obendorf, & Lamersdorf, 2001).
Design for content
Rethink the design after content is added; consider the
contextual feedback on pages with a great vast amount of text,
especially in these pages, users need contextual information.
This can occur when a text is consuming all screen real estate
leaving no place for navigational aids. One could think to divide
the text into (logical numbered) subsections so users can see
their progress or using only partial screen real estate to indicate
where the navigation is located which is easily accessible when
desired. This problem originates also in the conventional print
medium where people can get lost in linear text (Conklin, 1987,
p. 38). Although this issue can be addressed with previously
described guidelines (Expose the page structure and Keep
navigation nearby) we explicitly would like to describe that
information on a page can grow exponentially in a short amount
of time (considering big content management systems that allow
multiple editors to work on one specific item).
Do not take the back button for granted
Facilitate users on the page with handles for back navigation;
users want to feel in control (Shneiderman, 1998).
Use images for branding
Logo’s and color are well recognized by users (Teevan, et al.,
2009) and usable for revisitation.
Beautiful design is good design…
Good aesthetics can have positive effects on usability. Even
though beauty might be subjective, it actually can have a
function of improving usability (Parizotto-Ribeiro & Hammond,
2005; Tractinsky, Katz, & Ikar, 2000).
Separate content from navigation
As much as possible, find one place for the navigational
facilities, therefore users can concentrate on the content and
when needed quickly recognize the navigation on the page.
Design by page
The amount of time spent on the page is dependent of many
variables, one of them the level in the hierarchy (Danielson,
2002). Anticipate on the time spent on the page with visual
clues for extra navigational items or letting users dive in the
content. Also, evaluate your design for every page individually
as if it is the first page the user visits, even if this page is deeply
nested in your site structure. When your site is optimized for
search engines, the search engines can pinpoint to one single
page of your entire selection. In that case, users also have to be
able to comprehend the site structure and their navigational
possibilities.
Design for your user
Carefully think about your target Group when designing the
page. Infants might have a different way of understanding
navigation than elderly.
Design a favicon
Although the size is small, in history lists it is possible to stand
out with your favicon.
AJAX with thought
With AJAX it is possible to request pages on your own websites
without reloading, it is possible to enhance your internal links
with a thumbnail of the target page. On every link this might
clutter the interface but sparingly (i.e. with visited links) this
can improve the revisitation within your website (Weinreich,
Obendorf, & Lamersdorf, 2001).
We think this list with design guidelines will give page
designers handles for proper page design which minimizes lost
in hyperspace problems for their visitors.
4.2 Functional design
In this section we describe our considerations for redesigning
the behavior of the back button.
While evaluating web browsers we found one interesting visual
design feature implemented on only one browser. Firefox 3.x
(Mozilla, 2009) incorporated a big back button. Enabling users
to find and use this button with more ease (Fitts, 1954).
Figure 2 Firefox' bigger back button
This relatively simple addition to the browser makes back
navigation easier to access. Though the change seems marginal,
we think this can greatly improve the overall usage of the back
button since we stated earlier that every minor improvement can
implicate great benefits because of the many times this button is
used.
We tried to come up with a simple yet effective, non real estate
consuming, non interruptive, improvement of the back button
while at the same time, giving users contextual information.
This is where we think the lost in hyperspace problem and the
back button can come together. When we thoughtfully design a
feature that gives users feedback about the visited pages in a
non-interruptive way while backtracking, this can support users
while backtracking and show them contextual information on
how they got to the current web page.
While searching for a possible implementation we considered
many alternatives and found a distinction between 2d and 3d
solutions. A closely related topic is the performance of finding
information within big datasets, filtering results to quickly
access the desired information. We did not focus our research
on measuring effectiveness of these implementations but we
found an interesting conclusion about the use of 3d information
visualization. Within small datasets (smaller than 100 items) 3d
visualizations hinder the effectiveness of information finding
within the available data (Cockburn & McKenzie, 2002). Since
our research has shown that the amount of pages used in the
history list should be between 6 and 10, the decision was made
to propose a 2d suggestion.
We decided to design an addition to the back button that would
support the users while backtracking. This backtracking would
be facilitated by the recency back model with temporal ordering
and uses images of recently visited web pages so users can
recognize the desired page and select it. Since users seem to
have a poor mental model of the model behind the back button,
we think giving insight in this additional model might confuse
people. We think the model behind the back button is of minor
importance for users as long as they are able to recognize the
desired page.
Another suitable candidate for supporting the back button is the
history list. This is currently being implemented in several
modern browsers where users are able to see the history list of
most recently visited items when they “click and hold” the back
button. It shows a list with page titles of the most recently
visited items. We think the information given to users can be
less interruptive and richer. We think the “click and hold”
action is time consuming and interruptive and the list of page
titles are not a good source of page recognition (Weinreich,
Obendorf, & Lamersdorf, 2001). Therefore, we propose an
overview of page thumbnails that appear while hovering the
back button.
Cockburn & Greenberg (2000) showed that textual history
representation is not sufficient to quickly identify pages and in
order to improve page recognition time; tools like ours should
display individual pages in a way that aids rapid identification.
We do this by making thumbnails of the visited pages.
For determining the amount of thumbnails that should appear in
the window, we decided the number should be between 6 and
10 items (Tauscher & Greenberg, 1997). They state that there is
a 42% chance that the next URL the user would like to visit has
not been visited before and a 43% change that this has occurred
within the last 10 visits. As discussed in the beginning of this
paper, 58% of all pages are revisits, so visualizing 43% means
that more than 74% of all possible revisits are displayed within
the last 10 pages.
According to other research, long history lists are not worth
considering since the screen real estate is (sometimes) limited
and the cognitive overload of long lists is quickly achieved
(Greenberg, 1993). The last design consideration was described
by Tauscher & Greenberg (1997) where they proclaim that
“Accessing the history mechanism should be minimally
disruptive to the user’s current task.”
With this last design consideration in mind we tried to design a
solution that uses no additional screen real estate next to the
browser, would not be disruptive to the users’ current task
(namely clicking the back button) and would take cognitive
overload into account. The result of the design process is shown
in Figure 3.
Figure 4 Design proposal for back button with hub
enhancement (no exact temporal ordering)
Figure 3 Design proposal for back button enhancement in
Safari web browser
Figure 3 shows a context menu with 9 thumbnails on a raster of
3 by 3 with the most recent visited page on the top left and the
least recently visited page on the bottom right where the second
most recent visited page is on the right of the most recent one.
The menu has a pointing arrow towards the back button
implicating their relation.
In this situation, the context menu reserves space close to the
back button (the closest horizontal section) for displaying three
hub pages. These pages are separated with a line from other
non-hub or less recently visited hub pages which order is based
on recency. This solution might be confusing for users since the
last visited page is not always located closest to the back button.
Therefore, we propose another alternative which maintained the
ordering of the first design proposal but explicitly highlighted
the hub pages.
While designing the panel, we put the “Settings…” button on
the screen to think about useful settings users could define since
they want to feel in control of the application (Shneiderman,
1998). The settings button could be used for the user to
determine the amount of thumbnails shown in the menu, the
size of the panel, the reaction time of the panel, disable the
panel, set the opacity etc. We did however not evaluate these
settings.
In the example above, no hub and spoke enhancement is
provided. We think the hub and spoke navigation could become
available for users via the context menu. If it is possible to
dynamically determine the hub page (or W3C comes with a
standard for the page designers to describe if the page is a hub,
this will be discussed later) Figure 4 illustrates how this can be
used for easier access to hubs. To clarify the situation, we
defined the third, fifth and sixth page in Figure 3 as hub pages.
These three pages should become easier accessible for users to
enhance hub and spoke navigation.
Figure 5 Design proposal with hub enhancement and true
temporal odering
With this context menu for the back button we think it is easier
for users to revisit web pages stored in the history list.
Needless to say is that the way the context menu appears is of
great importance. The usage of the back button should by no
means be obstructed. When clicking the back button and the
page takes some time to load, it might be possible to highlight
(while the page or the context menu is still visible) the page in
the context menu so every time the user hits the back button it
gets information of where in the history list the user is going.
5. FUTURE WORK
6. CONCLUSIONS
At first has to be determined whether the contextual menu
proposed in this paper is beneficial for users in revisiting web
pages. We would like to see tests on evaluating the performance
of the contextual menu we proposed with users. With this
information can be evaluated if the proposed design will support
users in their page revisitation. If these tests prove otherwise,
we should reconsider our design. The design guidelines have to
be evaluated in order to see if the user and the page designer
benefit from these rules while designing and visiting websites.
Due to the enormous evolution of the web the lost in hyperspace
problem still occurs since the amount of information users have
to digest has also grown exponentially. With this vast amount of
information, new and additional context has to be provided in
order to prevent users from being disoriented in their web page.
In addition, some other issues can be addressed. The size of the
thumbnails might be subject for optimization where the
drawback of used screen real estate is minimized and the
visibility (where users can identify the page enough to
determine the desired page) is sufficient.
The contextual menu we proposed can also be evaluated when it
is filled with the normal history list, leaving the back button
with the stack back functionality for good hub and spoke
support. The context menu than can only show the latest visited
windows, maybe with hub enhancement. We have to determine
if this mismatch between model of the back button and items in
the context menu will not confuse users.
The W3C can help browser vendors and page designers with
delivering the standard in which page designers can indicate
whether a page is a hub or a spoke or a page of another kind.
When this feature can be styled with CSS, page designers can
design specific links for navigating towards hubs. Currently
page designers are able to define the type of page or their
description, this is however metadata which is mainly used for
search engine optimization. Obviously, internet users have to
get used to these features.
The generation of thumbnails we proposed opens a complete
new array of possibilities if browser vendor also reveal these to
the page designer who in this case can do many things with
these thumbnails. For example, if the browser captures every
visited page as a thumbnail, and keeps a list of the history with
the URL and the corresponding thumbnail, page designers are
able to use these thumbnails for internal links. In the case of
revisits it is currently possible to style these links with CSS. If
the user hovers over a visited link (this link must be in the
history list) the browser vendor or the page designer (depending
on the implementation) can display the stored thumbnail of the
page next to the link in order for the user to preview the site he
is going to visit. This can be very useful in navigational sections
like menus, sitemaps, and breadcrumbs. When these features are
combined, they give the user structural information and more
information about where they are going. Especially for
backtracking purposes this can be very useful.
In this research we overviewed research currently done on the
subject of supporting users to prevent the “lost in hyperspace”
problem and discussed the functionality of the back button.
When backtracking information, users tend to “click-tillrecognize” and since the current back button makes it possible
to prune information from the list of recently visited items, we
argued that a reconsideration of the back button was needed.
Our main argument against the use of a stack related back
button was the removal of nodes. Other research gave insight in
alternative models of the back button. We chose the recency
back button with duplicates removed and temporal ordering.
Even though this model has its disadvantages, according to us it
is a better alternative to the stack back model since all pages
stay stored in the list of recently visited items.
We also proposed design considerations based on findings in
different research where researchers are trying to solve the
problems with external tools, many of the problems are solvable
with proper page design and thinking about the user of the
website.
Finally, we proposed a browser design implementation that
makes the back button more usable by providing insight in the
most recently visited pages on a non disruptive way.
REFERENCES
Adaptive Path Inc. (2009). Adaptive Path. Retrieved May 23,
2009, from Ajax: A New Approach to Web Applications:
http://www.adaptivepath.com/ideas/essays/archives/000385.php
Apple Inc. (2009). Apple - Safari. Retrieved May 23, 2009,
from http://www.apple.com/safari/
Ayers, E., & Stasko, J. (1995). Using Graphic History in
Browsing the World Wide Web. Atlanta: Georgia Institute of
Technology.
Bieber, M., & Wan, J. (1994). Backtracking in a multiplewindow hypertext environment. ACM European conference on
Hypermedia technology (pp. 158 - 166). Edinburgh, Scotland:
ACM.
Catledge, L., & Pitkow, J. (1995). Characterizing Browsing
Strategies in the World-Wide Web. The Third International
WWW Conference. 27, pp. 1065-1073. Elsevier Science B.V.
As seen in other research, colors and logo’s are a good reference
point for users when they revisit web pages (Teevan, et al.,
2009). The favicon, now used in almost every browser, is too
small to contain the information needed for users to recognize
the page; therefore the favicon could be enlarged to meet the
size where it can be more usable for selecting sites from a
history list.
Chakrabarti, S., Gibson, D., & Mccurley, K. (1999). Surfing the
Web Backwards. WWW 8 Conference, (pp. 1679-1693).
Browsers can improve the display of links to a webpage that is
stored in the bookmarks of the browser. They can be visualized
differently from the other links on the page. This gives users
feedback that they are able to visit a page they have visited
before (this page might not be in the history list when users
empty their history list, the bookmark list remains unchanged).
Cockburn, A., & Jones, S. (1992). Design issues for World
Wide Web navigation visualisation tools. Computer Science
Working Papers. Hamilton, New Zealand: University of
Waikato, Department of Computer Science.
Cockburn, A., & Greenberg, S. (2000). Issues of Page
Representation and Organisation in Web Browser's Revisitation
Tools. Australian Journal of Information Systems , 7 (2), 120127.
Cockburn, A., & McKenzie, B. (2002). Evaluating the
Effectiveness of Spatial Memory in 2D and 3D Physical and
Virtual Environments. CHI 2002. Minneapolis, USA: ACM.
Cockburn, A., & McKenzie, B. (2001). What Do Web Users
Do? An Empirical Analysis of Web Use. International Journal
of Human-Computer Studies , 903-922.
Cockburn, A., Greenberg, S., McKenzie, B., Jasonsmith, M., &
and Kaasten, S. (1999). WebView: A Graphical Aid for
Revisiting Web Pages. Australian Conference on Human
Computer Interaction. Wagga Wagga, Australia.
Conklin, J. (1987). Hypertext: An Introduction and Survey.
IEEE Computer , 17-41.
Danielson, D. (2002). Web navigation and the behavioral
effects of constantly visible site maps. Interacting With
Computers (14), 601-618.
Fitts, P. (1954). The information capacity of the human motor
system in controlling the amplitude of movement. Journal of
Experimental Psychology , 47 (6), 381-391.
Greenberg, S. (1993). The computer user as toolsmith: the use,
reuse, and organization of computer-based tools. Cambridge
University Press.
Greenberg, S., & Cockburn, A. (1999). Getting Back to Back:
Alternate Behaviors for a Web Browsers' Back Button. Human
Factors and the Web. Gaitersburg, USA.
Greenberg, S., Ho, G., & Kaasten, S. (2000). Contrasting StackBased and Recency-Based Back Buttons on Web Browsers.
Alberta, Canada: University of Calgary.
Hanson, N. (2007). Wayfinding and Navigation: A Look at
Browsing Via Aerial Map Style. Retrieved May 23, 2009, from
Nils Hanson: http://nilshanson.com/research.html
Herder, E. (2006). Forward, Back and Home Again - Analyzing
User Behavior on the Web. PhD thesis, University of Twente,
Enschede, The Netherlands.
Kaasten, S., & Greenberg, S. (2000). Designing an Integrated
Bookmark / History System for Web Browsing. Western
Computer Graphics Symposium. Panorama Mountain Village,
BC, Canada.
Kaasten, S., & Greenberg, S. (2000). Integrating Back, History
and Bookmarks in Web Browsers. Extended Abstracts of the
ACM Conference of Human Factors in Computing Systems.
Alberta, Canada: ACM Press.
Medynskiy, Y., Dontcheva, M., & Dontcheva, S. (2009).
Exploring Websites through Contextual Facets. CHI 2009 - Web
Searching and Browsing (pp. 2013-2022). Boston, USA: ACM.
Milic-Frayling, N., Jones, R., Rodden, K., Smyth, G.,
Blackwell, A., & Sommerer, R. (2004). Smartback: Supporting
Users in Back Navigation. WWW 2004 (pp. 63-71). New York,
USA: ACM.
Mozilla. (2009). Firefox web browser. Retrieved May 23, 2009,
from http://www.mozilla.com/en-US/firefox/firefox.html
NCSA. (2009). About NCSA Mosaic. Retrieved May 23, 2009,
from http://www.ncsa.uiuc.edu/Projects/mosaic.html
Nielsen, J. (2002, May 12). Home Page Design Guidelines.
Retrieved May 23, 2009, from Jacob Nielsen's Alertbox:
http://www.useit.com/alertbox/20020512.html
Orner, D., & MacKenzie, S. (2006). A Comparison of
Hierarchical and Linear Browser Back Menus. IADIS
International Conference WWW/Internet 2006, (pp. 119-126).
Parizotto-Ribeiro, R., & Hammond, N. (2005). Does Asthetics
Affect the Users' Perception of VLE's. Artificial Intelligence in
Education (AIED), (pp. 25-31). Amsterdam.
Park, J., & Kim, J. (2000). Effects of Contextual Navigation
Aids on Browsing Diverse Web Systems. CHI '2000 (pp. 257264). The Hague, Amsterdam: ACM.
Shneiderman, B. (1998). Designing the User Interface:
Strategies for Effective Human-computer Interaction. AddisonWesley.
Tabard, A., Mackay, W., Roussel, N., & Letondal, C. (2007).
PageLinker: Integrating Contextual Bookmarks within a
Browser. CHI 2007 (pp. 337-346). San Jose, USA: ACM.
Tauscher, L., & Greenberg, S. (1997). How people revisit web
pages: empirical findings and implications for the design of
history systems. Int. J. HumanÐComputer Studies , 47, 97Ð137.
Teevan, J., Cutrell, E., Fisher, D., Drucker, S., Ramos, G.,
André, P., et al. (2009). Visual Snippets: Summarizing Web
Pages for Search and Revisitation. CHI 2009 (pp. 2023-2032).
Boston, USA: ACM.
Theng, Y., Thimbleby, H., & Jones, M. (1996). "Lost in
hyperspace": Psychological problem or bad design. APCHI'96,
(pp. 387-396). Singapore.
Tractinsky, N., Katz, A., & Ikar, D. (2000). What is beautiful is
usable. Interacting with Computers (13), 127-145.
W3C. (2008). World Wide Web Consortium - Web Standards.
Retrieved May 23, 2009, from http://www.w3.org/
Weinreich, H., Obendorf, H., & Lamersdorf, W. (2001). The
Look of the Link - Concepts for the User Interface of Extended
Hyperlinks. 12th ACM conference on Hypertext and
Hypermedia (pp. 19-28). Århus, Denmark : ACM.
Won, S., Jin, J., & Hong, J. (2009). Contextual Web History:
Using Visual and Contextual Cues to Improve Web Browser
History. CHI 2009 (pp. 1457-1466). Boston, USA: ACM.
Download