Tip:
Highlight text to annotate it
X
This is the Worldspace FireEyes quick start video. I'm going to be giving you an overview
of the user interface of Worldspace FireEyes and some of the more difficult things for
a first-time user to understand.
Worldspace FireEyes is a Firefox and a Firebug plugin. This means that it appears within
the Firebug user interface. As you can see here is the "Worldspace FireEyes" tab as a
peer of the Firebug "Console" and "Net" tabs (among others).
Worldspace FireEyes tracks three types of data inside Firebug. Firstly the events that
are going on inside the browser, secondly the changes that are happening to the content
or the DOM (or document object model) and thirdly (after analyzing the events and the
content) the accessibility issues that result from those.
Accessibility analysis is done in two ways, either automatically (turned on or off by
checking or unchecking the "automatic" checkbox) or when you click the "Now", "Color" or "Order"
buttons.
The Worldspace FireEyes user interface has five tabs:
1) The "Current Document" tab shows you all of the events, the changes and the issues
that are related to the current document as defined by the URL that is displayed in the
location bar; 2) The "Report" tab shows the same information
but for all of the pages that we have visited in the current session
3) The script tab shows all of the events that we have recorded during the current recording
session. This recording can be toggled on or off using the "Record" checkbox.
4) The "Settings" tab is where you can define the analysis scope, analysis standards and
event recording settings. These settings are persisted for each project separately. By
default all the settings are in the "default" project.
5) The "Projects" tab is where you define the different projects or sites you are working
on and the servers that correspond to the life cycle stages of those projects. You can
have one for production, one for QA and one for your own personal sandbox.
When Worldspace FireEyes first starts up, all of the options are enabled. This can be
somewhat overwhelming. Firstly, the event recording will be turned on which will track
everything that you do inside the browser. This is only required when you have dynamic
sites with lots of JavaScript. We recommend turning it off until you are ready to use
it. Secondly, Worldspace FireEyes will highlight every HTML element that has an issue with
a striped overlay. This is useful because it gives you a visual indication of how much
of your page is inaccessible and it prevents you from interacting with that element using
the mouse. Frustrating? Well now you know how users of AT feel when they visit your
page. This can be turned off by unchecking the "Highlight" checkbox - but remember to
turn it on again every now and then to remind yourself of how AT users feel when they visit
your pages. Thirdly, Worldspace FireEyes automatically analyzes every web page for which Firebug
is enabled. When you're debugging some difficult issue, this can take time. You can turn this
off by unchecking the "automatic" checkbox and then turn it on when your bugs are fixed
and you are ready to fix your accessibility issues. Of course you could always fix your
accessibility issues first and tackle the bugs later.
The current document and the report tabs are both organized chronologically. The difference
between the two is that the current document tab has the newest stuff at the top, whereas
the report tab has the newest stuff at the bottom. Within these tabs, Worldspace FireEyes
groups the items into contiguous groups of like items. So if there are a bunch of events
with no content changes, these will be grouped together. When content changes occur, these
will be grouped together until interrupted by another type of event. This allows you
to see the events, their resulting content changes and the resulting issues in the order
that they occurred.
On the script tab, there are five ways to replay the recorded events. You can replay
the entire script from the beginning to the end using this button; you can replay the
script one event at a time using the "step through" button; you can replay a single event
using the play button; you can replay from the beginning of the script to a particular
event with the replay to event button; and finally, you can replay the script to the point at
which an issue occurred using the replay to issue button on the report tab.
When Worldspace FireEyes is doing something, it displays status messages in the status
area to the right of the tabs.
That gives you an overview of the user interface areas. Now I'm going to show you what a few
of the more difficult to understand buttons do:
1) In the "Report" toolbar button grouping, the clear button will clear the report, current
document and script tabs; 2) In the "Analysis" toolbar grouping, the
"Color" button will perform a detailed color contrast analysis of the current page;
3) The "Order" button will perform a detailed reading order analysis of the current page;
and 4) The "Scope" button will allow you to set
the scope definitions being used, to restrict the portions of the page being analyzed. This
is very useful for large sites that use templates to render the user interface; and
5) In the "Events" toolbar grouping there is a "Freeze/Thaw" button. Clicking it when
it is in its "Freeze" state will stop all user events from firing in the browser and
will stop the application from making updates based on those events. This is particularly
useful in conjunction with script replay. For example when a script gets a document
into a state that can easily be interrupted by user inputs but you would like to inspect
the state of the DOM, .css and or JavaScript. An example of this is a mouseover menu. When
the menu is activated, moving the mouse over other portions of the page may result in the
menu disappearing. By pausing the script at that spot and freezing the browser window
with the freeze button, you can then inspect the html using Firebug's HTML inspector functionality.
Clicking it when it displays "Thaw" will allow the application to once again receive user
event notifications. 6) Finally, in the "Report" grouping on the
script tab, the "Save..." and "Load..." buttons will save the script and related issues or
reload a script and related issues that were previously saved;
That concludes our quick start guide for Worldspace FireEyes. Please visit our web page to contribute
to the feedback and to check for additional tutorials and updates.