WebAccessibilizer

A web javascript to help blind to make html web pages more accessible

Download

If you are hurry, click the link below to directly download this web script in your web browser

Install or update the 1.3 version of the WebAccessibilizer in your web browser

Or you can choose to comeback to the previous version

Make a donation

You can support our work by making a donation to stsolution.org

Our bank to share parameter files

Access our page of accessibility shared parameter files.

Purposes of the WebAccessibilizer

When imported into your web browser, the WebAccessibilizer have essentially four goals:

1. To allow you to personnalize web site you visit.

The WebAccessibilizer adds several configuration forms into your web browser to help blind user to personnalize web sites by for example attaching labels, saying text by the vocal synthesis, creating shortcut to read/execute/focus element, changing the layout, etc.

2. To allow you to share configuration/personnalization files with other users.

Via the online bank of shared file, you can submit or download configuration files for a large range of web sites.

This allows to the community to progressively make accessible all the web.

3. To allow you to easily handle video and audio on web pages.

The WebAccessibilizer embed an alternative and accessible multimedia player, allowing by key shortcut to handle audio and video objects presents in web pages.

According to web sites, you can allow that the multimedia reader appears automatically or be called by shortcut.

You will find those options in the quick parameters dialog box.

4. To help blind web developer to studdy the layout of web pages they visit.

The WebAccessibilizer can be quite useful to blind web developpers by allowing them to study the layout of pages they create or visit. Notably by the use of: * the treeview of exploring and getting informations on each element of the dom; * the form to visualize CSS code related to the current web page; * the form to visualize javascript codes related to the current web page.

How to install the WebAccessibilizer

You should import the file WebAccessibilizer.user.js into your web browser by extensions as grease monkey for firefox or tamper monkey for google chrome.

If you don't have those extensions installed on your web browser, look at the end of this page:

• the procedure to install tamper monkey on google chrome
• the procedure to install grease monkey on Mozilla FireFox

main key Shortcut

You should make ctrl+shift+f2 to open the main accessibilization form.

Before executing this shortcut, if you want to customize a element of the current page, you should place the cursor on it in order this element be selected in the dom explorer of the accessibilisation form when it opens.

description of the accessibilization form

On the accessibilization form, you will find these fields:

the treeview of dom explorer

You move between the hierarchy of the elements of the current page with arrow keys.

The purpose of the treeview is to select an element of the page you want to customize.

However on that treeview, note that a context menu is available with more than 20 action to perform on the currently selected element.

Note also that you can directly force the vocal synthesis to say somme informations on the dom explorer by pressing some shortcut keys:.

There are the following:

• b = say the borders of the current selected node
• c = say the colors (background and text) of the current selected node
• d = say the dimensions (width and height) of the current selected node
• f = say the font family in the current selected node;
• i = say the url of the image in the current selected node;
• i pressed two times quickly= copy the URL of the image in the clipboard;;
• i pressed three times quickly= show the url of the image in the current selected node in a prompt dialog in order to be copied;
• m = say the margins in the current selected node
• n = say the type, role, name, ID, and class of the current selected node
• n pressed two times quickly = copy the type, role, name, ID, and class of the current selected node in the clipboard;
• n pressed three times quickly = show the type, role, name, ID, and class of the current selected node in a prompt dialog in order to be copied;
• o = say the opacity percentage of the current selected node;
• p = say the absolute positions (left and top) of the current selected node
• shift+p= say the paddings in the current selected node;
• s= say the URL of the file associated with the current selected node;
• s pressed two times quickly= copy the URL of the file associated with the current selected node in the clipboard;
• s pressed three times quickly= display the URL of the file associated with the current selected node in a prompt dialog in order to be copied;
• t = say the inner text in the current selected node
• t pressed two times quickly = copy the inner text of the current selected node in the clipboard;
• t pressed three times quickly = show the inner text of the current selected node in a prompt dialog in order to be copied;
• h = say the HTML code in the current selected node;
• h pressed two times quickly = copy the html code of the current selected node in the clipboard;
• h pressed three times quickly = show the html code of the current selected node in a prompt dialog in order to be copied;

• v = say the percentage of visibility of the element on the screen. Indicates parts that are tuched by other elements if not 100%.

  • enter = show the current node description in a prompt dialog in order to be copied

• a= make say the positioning normal, relative or absolute of the element or relatively to its parent;

• shift+c=make say the type of cursor within the element;
• shift+o=make say the types of overflow (horizontaly and verticaly) in the element;
• r=make say border radius for the four corners in the element;
• shift+left=make say the position left of the element and from how many pixels it is separated from the one of its parent;
• shift+up=make say the top position of the element and from how many pixels it is separated from the one of its parent;
• shift+right=make say the position right of the element and from how many pixels it is separated from the one of its parent;
• shift+down=make say the bottom position of the element and from how many pixels it is separated from the one of its parent; Note that for the four last key shortcuts, a negative gap detected with the border of the parent will means there is an overlapsing

Also note that you can move quickly between the nodes of the treeview by pressing these keys:

• shift+f = open a search dialog to find a node by its reference
• alt+f = open a search dialog to find a node by the text its contains
• f3 = search the next node with the criteria given in the search dialog;
• Ctrl+home = go to the first node of the treeview. it is always the body tag;
• home = go to the first sibling in the treeview
• end = go to the last sibling in the treeview

As you can see, a blind web developper can quite well use this fields to study a web page.

the button to add a new configuration parameter

When pressed, it opens the parameter form in order to create an accessibilization parameter for the current selected element in the dom explorer. This form will be describe below.

The listview of existing parameters

It is the list of parameters you've already configured.

Note that in this list you can press:

• del to delete the selected parameter;
• space to activate or deactivate a parameter.
• shift+upArrow to move the selected parameter up in the list;
• shift+downArrow to move the selected parameter down in the list;

The button to modify the current selected parameter

When pressed, it opens the parameter form in order to modify the configuration for the parameter currently selected in the list of existing parameters.

The button to delete a parameter

When pressed, it delete the current selected parameter in the list of existing parameters. Of course after a confirmation.

The button to access the quick parameters form

It opens a form in whick are present quick accessibility parameters features for the current web site. There will essentially be found checkboxes and textboxes. For some of them for example, will be ask to type the shortcut that will activate their related feature.

Remember that it will be in this quick parameters form that you will be able to activate and make available the personalized multimedia player of the WebAccessibilizer. This one is a perfectly accessible alternative reader, of multimedia objects (video and audio) present on web pages. All its actions will be made with the keyboard, and informations will be read by the current vocal synthesis.

the button to import parameters

This button opens a classical openDialog in order to select on your computer a .wap file that contains configurations parameters. When the parameters to import has not been made for the current web site, it will ask you to confirm the importation.

The button to import parameter by pasting the code

This button opens an input textbox where you can paste the internal code of a parameter file in order to import it.

the button to export parameters

This button opens a classical saveDialog in order to choose where to save on your computer the current web site configuration parameters. When the web browser is configured to automatically start downloading, it will not show you this dialog again. The accessibility parameters of WebAccessibilizer are stored in files with extensions like .wap or .wap.txt.

The button to access the global storage where all parameter files are saved

It will display the interface where all parameter files you saved will be listed. At the bottom, some buttons will allow you to export or import all at once. The shortcut to open this commun storage page is Ctrl+shift+s.

The button to visualize All CSS code of the current page

This button will open a new form where all CSS codes related to the current web page will be listed, and where will be proposed a text field where will be displayed the CSS content of those files.

The button to visualize All JS code of the current page

This button will open a new form where all javascript codes related to the current web page will be listed, and where will be proposed a text field where will be displayed the JS content of those files.

The button to access our web site

This button opens our web site where you can review the documentation, update your version of WebAccessibilizer, or be aware of changes version to version.

The button to share the current parameter file with the world

This button send the current parameter file toward our shared bank of parameters on our web site. To work, the current parameter file should be made or modified by you.

The button to access our bank of shared parameters

It opens the web page of shared parameter files made by other users. This page allows you: * To search accessibility parameter files from many criterias * To submit new parameter files

The button to directly update WebAccessibilizer

This button allow you to directly update the WebAccessibilizer from the last version of our web site.

the button close

To close the accessibilization form.

Some other shortcuts

To globally save your parameter files

In the accessibilization form, you can also do:

• Ctrl+s to force the saving of the parameter file of the current web site into a common storage.
• Ctrl+Shift+s to open the common storage where parameters for many web sites are stored.

Note that in the common local storage page, you can save all parameter files at once on you hard drive by a button at the bottom.

to force a non focussable element to be foccused in the dom treeview

Before entering the accessibilization form, in order to solve the problem of elements of the page that are not automatically selected in the dom treeview of the accessibilization form, you can make: Shift+f2; This will give the ability to be focussed to all elements of the current web page. So that, when you will call the accessibilization form with Ctrl+Shift+f2, the last element you were on will then be automatically selected when the dom treeview will appeare. Even this element is a paragraph, an image, a title or something else traditionnaly not focussable.

But also be warned that you should deactivate the auto-select of form field with NVDA or jaws before trying to do Shift+f2. Otherwice, the form mode will be activated each time you move the arrow keys.

Description of the parameter form

This form is used to add a new or to modify an existing parameter of accessibility.

Its fields are the following:

the textbox to describe the purpose of the parameter

Type here in one line the text that describe the roll of the parameter. If there is a shortcut that will be attached, we advise you to write it at the end of the description, so that you can directly see it when parameters are listed.

The checkbox to activate or deactivate the parameter

Always checked by default, you can uncheck it if you don't want that the current parameter is been executed anymore.

the textbox of the date of creation

This field doesn't allow modifications.

The combobox to choose the type of reference

This combobox serv to precise if the reference that will be typed should find an unique and precise element or either a group of elements.

When the value is absolute in this field, the reference to be given should indicate a only one element;

and when the value is "relative" in this field, all elements matching the reference will be collected.

the textbox to type the reference of the dom element

In this field should be typed the reference to identify the element on wich the action would be performed. In a way of speaking it is the path to find the element.

When you opens the parameter form, by default this textbox is automatically fill with the absolute reference of the selected element.

If in the combobox of type of reference you chose "Relative reference", you must modify the content of the current textbox But don't be afraid because it's simple.

You will notice that the referencement system look like the one in the css. But however it has its particularities.

Some examples:

• "bt_close"

  indicate elements with the id "bt_close";

• ."minuscule" indicate elements with the class "minuscule";

• $"txttown" indicate elements with the name "txttown"

• div simply indicate div elements

Note that the character "\" (backslash) indicates that the text after will indicate the children of the previous one. In the classical css referencement system it is the space character that do the same thing.

The combobox of action to apply

Here, you should Choose the action to be executed on the html element.

Available actions for the moment are the following:

• Assign a label to the element;
• give the following background color to the element
• give the following text color inside the element
• give the following text size inside the element
• say the text when there is a change in the element;
• say the following text when the element apeare;
• say the following text when the element dis apeare;
• assign the following key shortcut to say the text in the element;
• assign the following key shortcut to bring the focus to the element;;
• assign the following key shortcut to click on the element;
• Assign the following key shortcut to hide this element;
• Assign the following key shortcut to hide this element to the screen reader while it remains visible; Assign the following key shortcut to execute the following JS code;
• automatically delete the element
• automatically hide the element;
• Automatically hide this element to the screen reader while it remains visible;
• move the element before the following element
• move the element after the following element
• move the element as a child of the following element
• create the following type of element before the element
• create the following type of element after the element
• create the following type of element as a child of the element
• Make the following sound file play when the text change in this element;
• Make the following sound file play when this element apeare;
• Make the following sound file play when this element disapeare;
• Automatically execute the following js code;
• execute the following js code when the element apeare
• execute the following js code when the element disapeare
• execute the following js code when the element takes the focus
• execute the following js code when the element looses the focus
• execute the following js code when there is a click on the element
• execute the following js code every x secondes
• assign the following html attribute to the element.;
• Assign the following aria style to the element

When some of these action are chosen, it will trigger the apearance of additional field in wich some other argument will be asked to be fill.

Here you can note that: * in the js code to execute you can use some integrated function like - waSayString(text, blInterrupt=false): to say a text by the current vocal synthesis; - waPlaySound(url): to play a sound file; - waShowMultimediaPlayer(): to display the multimedia player of the WebAccessibilizer; - waIsSameKeys(): to get the number of times a shortcut combination have been pressed quickly; - waRandomizeBetween(lDown, lUp): to get a random number between lDown and lUp; - waClipboardCopyText(s, returnFunction=null, saymessage=true): to copy a text in the clipboard.

Additional fields

They apeare or dis apeare according to the currently selected action in the combobox of actions.

They can be:

• a textbox to type a required text like the text to say when the action is triggered;

• a textbox to type a key shortcut. For example: ctrl+shift+s, shift+3, alt+shift+z will be recognized. See below the of key codes accepted by the WebAccessibilizer.

• a combobox to choose for example an aria style or role.

the button OK

To validate all the changes, close the parameter form, and come back to the main accessibilization form.

the button cancel

To cancel the changes, close the parameter form, and come back to the main accessibilization form.

list of keys accepted in shortcut combinations by the WebAccessibilizer

The following keys can be use to write shortcut combinations you indicate to WebAccessibilizer:

Reminber for those key that the cass is not important.

• Ctrl, control
• Shift
• Alt
• wnd, window
• cmd, command
• Space
• left, ArrowLeft , LeftArrow
• Up, ArrowUp, UpArrow
• Right, ArrowRight, RightArrow
• Down, ArrowDown, DownArrow
• Escape
• PageUp, PgUp
• PageDown, PgDown
• End
• Home
• Delete, Del
• BackSpace, Back
• Enter, Return
• tab,
• pause, * printscreen,
• scrolllock,
• caplock,
• numlock,
• insert, insertion

The symbole + will be the concatainer to create combinations of keys. Example: ctrl+f1

How to install tamper monkey or grease monkey extension on the web browser

How to install tamper monkey on google chrome

We can divide this procedure in two steps: the proper installation, and the activation of tamper monkey.

The proper installation of tamper monkey

You can use the following link to reach the download page of tamper monkey on the google chrome web store:

tamper monkey

But if that link doesn't work, you can follow these steps to search for it directly in the chrome web store:

1- Open a page in google chrome

2- Press alt to go on the menu bar, then go down until the item "more tools"

3- Open its sub menu and go down until the item "extensions" and press enter.

4- In the page for managing extensions that will open should be listed extensions already installed in your web browser. But logically tamper monkey is not yet there. We have to search it on the google web store. So, at the beginning of this page to manage extensions you will find a button named "main menu". Click on it.

5- The main menu scroll down and within its items it will be proposed "open the chrome web store". Click on it.

6- In the chrome web store there is a search textbox that will normally directly get the focus, in which we invite you to type "tamper monkey" and press enter.

7- Within the results that will apeare on the page, the first result that will propose you the button "add to chrome" should normally be the good one. However, read it description til the end before clicking on it.

8- After this procedure, it will be displayed the message that tamper monkey has been correctely installed in your chrome.

The activation of tamper monkey

It is now necessary to insure that tamper monkey is activated and get enough right to execute the WebAccessibilizer.

Let's follow the steps below:

1- We should come back on the page to manage extension that is, let us remind it, is in: menu bar, more tools, extensions.

2- In the extension managing page, you will see that tamper monkey will apeare this time. Read it description, and insure yourself that its button activated is pressed down.

3- After, come back on its button details and click on it.

4- You will then access the configuration window of tamper monkey in which you will insure that the following element are activated:

• autorize in private navigation mode
• autorize access to files URL

5- And with all that it will be OK However, know that in this current page you have the button named "extension options". That opens a page where you can configure precisely tamper monkey. For example: activating or deactivating scripts.

How to install grease monkey on firefox

You can use the following link to reach the download page of grease monkey on your firefox:

grease monkey

But if that link doesn't work, you must follow these steps:

1- Open firefox

2- Go in menu bar, menu "tools", menu "complementary modules"

3- In the complementary modules management page that will apeare make tabulation until you will ear "extensions list" If it is not extension that is selected in this list, modify until you ear "extensions"

4- Make tabulation until you will ear "find new extensions" edition. In this textbox, you will type "grease monkey" and press enter.

5- In the result page that will apeare, normally the first result will propose you a link to go on the grease monkey page. Click on it.

6- In the grease monkey's page, you should have a link or a button to install it in your web browser. Click on it.

7- When grease monkey is installed, you should insure yourself that he is activated You go back to : menu bar, menu "tools", menu "complementary modules".

8- In the complementary modules management page that apeares you make tabulation until you reach the list of available extensions. You will find in it the newly installed "grease monkey".

9- In this list, on grease monkey, call the context menu. If in the context menu it apeare an item to activate grease monkey, click on it. Warning ! in some computer, it is necessary to close and restart firefox so that this activation is effective.

information on The autor

The autor of this script is:

• Yannick Daniel Youalé mailtoloco2011@gmail.com from Cameroon, in central Africa

log informations

As required by my friend Stefan Moisei, these are the changes by versions applyed to this script:

v 1.3 of the 2022-04-29

in the WebAccessibilizer's main window:

• Creation of shortcuts to trigger verious buttons (see in their labels)

• Better labelling of items

• creation of a button to export parameters by displaying it in a textarea in order to copy the code

• Creation of a button to directly submit your modifications to our online bank of shared parameters.

in the dom treeview of the WebAccessibilizer's main window

• improvement of the research by reference (shift+f). It now can search either by classical css query selectors or our personnalized syntax of referencement.

• Improvement of the research by text (alt+f). It is now not case sensitive anymore.

• You can now research the previous occurence with shift+f3. The research of the next occurence is still done with F3.

• Following new shortcuts have been assigned in the dom treeview:

• e: Open a prompt dialog for you to type a JS code to execute on the current node. E.G: e.target.style.visibility="visible";
• Delete: ask you if you really want to remove the current node from the page
• SpaceBar: perform the click method on the selected node
• Shift+SpaceBar: perform the click mouse event on the selected node
• Ctrl+SpaceBar: close the accessibility window and try to bring the focus on the selected node
• Shift+s on an element that have an attribute href or src or source trys to download the file referenced in that attribute.

• z to say informations retrieved by the JS code you can modify in the tab debug of the quick configuration window. It is a way of personalizing yourself what information you want to be read when that key is pressed on the dom treeview.

• the shortcut c to give information about colors in the current node now also give the color contrast between the foreground and the background.

• The shortcut f to read informations about de font now includes the font-size. It was an unforrtunatly forgotten information.

In the window to create or modify a parameter

• The field "Concerned URL" appears now just after the field "Date creation". It helps to indicate url pattern of pages on which the parameter should be executed. Example: http://www.stsolution.org/ Or: adminer.php To live this field empty will signify the parameter should be executed with all url of the web site.

• Following new actions have been added to the list of available actions:

• Execute the following js code when there is a change in the html code of this element

• More argument are now asked to complete the three action to create a new html tag. The new element can be created before, after or as a child.

• Bugs have been fixed with following actions:

• assign the following shortcut to hide this element;

• assign the following shortcut to hide this element to screen readers;

• You can now validate the all dialog box with alt+shift+o.

In the quick parameter window

• some Default shortcut are now automatically written for some fields: For example:
• alt+shift+v to display the multimedia player of the WebAccessibilizer;
• alt+shift+p to say or copy the URL of the current page;
• alt+shift+l to say or copy the URL of the selected link;

• alt+shift+g to activate or deactivate the verification of grammatical error within a selected text area. Very useful feature in deed.

• Creation of a new tab named 'debug' to regroup some features useful for debugging the accessibility of the current web page. These are the new entries inside::

• shortcut to display the main WebAccessibilizer's window (ctrl+shift+f2 by default).
• shortcut to make all element of the page clickable (shift+f2 by default).
• shortcut to generate the accessibility report on the current web page (alt+shift+x by default).
• JS code to retrieve and say information when Z is pressed on the dom treeview.
• Restrict dhe exploration to the body tag.
• Include br tags in the exploration
• Include comments in the exploration
• Include noscript tags in the exploration
• Include script tags in the exploration
• Include style tags in the exploration

• Include text in the exploration

• In the scripting language, new functions are available like:

• waSpellString(s): to spell a text by the current vocal synthesis (NVDA or jaws)

• waChoiceList(sPrompt, sTitle, arrItems, posStart=0, returnFunction=null, focusOnPreviousElement=true): to display a dialob box with a combobox that enumerates items in the array arrItems, and returns the position of the item that has been validated in that dialog box.

• You can now validate the all dialog box with alt+shift+o.

General new features

• Because the shortcut ctrl+shift+f2 to call the main WebAccessibilizer window can now be modify, in case of a bug, you can use a security backup shortcut to trigger the display of that window. So, you will then have to press F2 more than five times quickly to achieve that.

• By pressing alt+shift+x, it will be generated a report on the accessibility of the all current web page. Several section separated by titles are present and will be completed in the future. In this report, some more information will be hidden by default, but could be displayed by clicking on verious button 'display' present everywhere necessary. You will also find links to be able to choose element to open and automatically select in the dom treeview of the WebAccessibilizer. In the report, there is a section where you will have information on colors in the page. Notably on verious contrasts detected with their coeficient. This will help you to better evaluate mistakes on that part even if you are totally blind.

In the presentation page of the WebAccessibilizer on thes web site.

There are now two link to install or update the WebAccessibilizer.

• The first one to install or update the very last version
• The second one to comeback to the previous version, if it occures that the very last version is too buggy or laks of functionnalities you want.

v 1.2

• The automatical recording of parameters in the global storage of the web browser has been deactivated. By now, this recording should explicitly be asked by pressing Ctrl+s in the main WebAccessibilizer's window;

• By now, it will be checked and alerted if there is a new version of the WebAccessibilizer online;

• Creation of a personalized context menu on the dom explorer, and that regroups all action available by key shortcuts on that dom explorer; This context menu can be quite useful when some web page enter in conflict with alphabetical key shortcuts executing themselves on the dom explorer of the WebAccessibilizer; Made with the contribution of Stefan Moisei.

• By now, quick parameter options are gathered in a window with multiple tabs. (the general tab, the multimedia tab, and the vocal synthesis tab);

• Creation of following quick parameter options: 1In the general tab:

• The assignment of a key shortcut to go to the next title in the page;
• The assignment of a key shortcut to go to the previous title in the page; 2In the multimedia tab:
• The possibility to set a percentage of volume to audio and video object;
• The choice if auto play after the page is loaded;
• The choice if auto stop after the loading of the page;
• The assignment of a key shortcut to go to the next video (youtube only);

1. In the vocal synthesis tab:

- The choice to activate the reading by the vocal synthesis of the web browser on the current web site; - The ability to tune parameters of the web browser's vocal synthesis for the current web site; - The assignment of a key shortcut to open the dialog box to tune parameters of the vocal synthesis for the current web site; - The assignment of a key shortcut to refresh the text in the current web page before making it be read by the vocal synthesis; - The assignment of a key shortcut to make read from the cursor until the end of the page; - The assignment of a key shortcut to make read the next paragraph; - The assignment of a key shortcut to make read the previous paragraph;

• In the dom explorer, in the text of the current node, adding of the information if absolute/relative element if available;

• In the dom explorer, following new key shortcuts have been created:

• a= make say the positioning normal, relative or absolute of the element or relatively to its parent;
• shift+c=make say the type of cursor within the element;
• shift+o=make say the types of overflow (horizontally and vertically) in the element;
• r=make say the border radius for the four corners in the element;
• shift+left=make say the position left of the element and from how many pixels it is separated from the one of its parent;
• shift+up=make say the top position of the element and from how many pixels it is separated from the one of its parent;
• shift+right=make say the position right of the element and from how many pixels it is separated from the one of its parent;

• shift+down=make say the bottom position of the element and from how many pixels it is separated from the one of its parent; Note that for the four last key shortcuts, a negative gap detected with the border of the parent will means there is an overlapsing

• We have stop the displaying of the multimedia player when there is no multimedia object visible in the page. Bug correction;

• Bug correction about the dialog to display JS codes attached to the current web page;

• Bug correction with arrow keys in the dom explorer of the WebAccessibilizer;

v 1.1

• Now the version number of the WebAccessibilizer is displayed in the title of its main form;
• Creation of a form for quick accessibility parameters with 14 new options allowing to the user, without a lot of knowladge to rule quick accessibility options on a web site. The button to access this form is within the main accessibility form of the WA;
• Creation of a form for the personalized multimedia player of the WA to easily read video and audio object present on a page. It is activated via options present in the new quick accessibility form;
• Bug fixation of movement within form to visualize CSS and JS present on a page;
• Bug fixation with some page events that use to affect the main form of the WA;
• The following functions can now be employed in scripts:
• waSayString(s, stopSpeech=false): to say a text by the current vocal synthesis;
• waPlaySound(url): to play a sound file;
• waIsSameKeys(): to know how many times the assigned key shortcut has been pressed;
• waShoMultimediaPlayer: to display the personalized multimedia player of the WA;
• Since now, in the dom explorer, whill pressing verious shortcuts, the second quick pressing will copy the information in the clipboard, and the third one will display it in a prompt dialog;
• In all field to enter key shortcuts, new key words are now allowed. They are:
• From f1 to f15;
• tab, pause, printscreen, scrolllock, caplock, numlock, window, insert/insertion
• From numpad0 à numpad9;
• Keys from 0 to 9 of the alpha-numerical pad;
• cmd or command in keys combinations for the key command if we are on mac;
• wnd or window in keys combinations for the key window if we are on windows;
• Ascii numerical code will also be accepted. Example: ctrl+112 will work for the combination ctrl+F1.

v 1.0

• In the dom treeview, the shortcut v now says the percentage of visibility of the current element on the screen. Indicates parts that are tuched by other elements if not 100%.
• In the parameter's form, is now present a checkbox to indicate if the element should be treated as a dynamic element that can be created dynamicly. This feature comes to solve the problem of element that are not present in the page just after its loading.
• The action "Say the text in this element when it has appeared" has been added to the list of available action. It can be quite useful associated to the dynamic detection if you want to handle a chat for example.
• When you use an action to execute a JS code, in that JS code you can now make reference to the element that has triggered the event with e.target.

v 0.9

• Shift+f2 now force any element of the page to be focussable and to be automatically selected when the dom treeview is called. You should execute it before calling the main WebAccessibilizer window with Ctrl+Shift+f2; And therefore, the last element, even if it was a paragraph, an image or a simple title, will then be automatically selected in the dom treeview.
• The role of the current element has been added within informations given by the shortcut n in the dom treeview;
• Ctrl+s save the parameter file of the current web site in a common local storage;
• Ctrl+Shift+s open the common local storage where all your parameter files for verious web site are saved. You can there restore them or save them at once on your hard drive.
• A button to open the common local storage where all your parameter files for verious web site are save is been added to the main form.
• The direct link to access the page for installing grease monkey for firefox has been inserted into the documentation at the section "How to install grease monkey on firefox".
• The direct link to access the page for installing tamper monkey for google chrome has been inserted into the documentation at the section "How to install tamper monkey on google chrome".
• the documentation has been refreshed.

v 0.8

• the ability to visualize JS codes present in the current web page as it is all ready possible with CSS code;

v 0.7

• The key h in the treview give now the all html code of the current node, not only of its children;
• Improvement of the structure and the layout of forms used by the WebAccessibilizer;
• It is now possible to reference elements in the page by CSS code selector. See the new item in the reference type list in the parameter form;
• We've add the action 'Insert the following CSS code after the page is loaded'. See the new last item in the list of actions of the parameter form.
• Bug correction to solve key conflicts with some web pages;
• We've add the possibility to visualize css code from attached css files or within css tag in the current web page. We've add for that a button 'visualize CSS code' that opens a form where are listed all css attached element of the current web page;

v 0.6

• The focus comback now on the element that were focused before the opening of the accessibilization form;
• the tuch o to make say the opacity of the current node;
• the tuch i to make say the url of the image in the current node;
• the tuch i two times quickly to make appeare the url of the image of the current node in a prompt dialog;
• the combination Shift+p to make say the paddings of the current node;
• the tuch p to make say the paddings in the current node;
• the correction of an error in the process to say margins in the current node;

v 0.5

• We've set a problem with encoding when exporting by converting by default in utf8
• now the tuch enter in the existing parameters list opens the modification form
• now you can submit your own parameters to the web site directly from the main form of web accessibilizer
• We've add new actions like:
• add an increasing number to the label of the element
• We've improve the filtering form of the bank of parameters on our web site
• We've improve the search engine of parameter files of the bank of parameters on our web site
• We've add a system to check new versions of WebAccessibilizer online and warn the user

v 0.4

• a bug correction concerning the escape key and the dom explorer focus when in the accessibilization form
• There is now a confirmation dialog to wipe out old parameters when user want to import new ones
• during importation old parameters are now updatable
• there is now a button to access a bank of shared parameters files on our web site on the main accessibilization form;

v 0.3

• a bug correction concerning a lost of focus in the dom explorer and the impossibility to close the accessibility form;
• the button web site has been added to the accessibility form;
• the action say a text when the element apeare has been implemented;
• the action say a text when the element disapeare has been implemented;
• n pressed two times quickly on the dom explorer will show the tag name, id, name, class, title of the current element in a prompt dialog in order to be read or copied;
• the error when ctrl+home has been solved;
• completion of the translation in french;
• You can now enter a relative reference in the search dialog to find an element in the dom explorer
• adding of the action "Assign the following key shortcut to hide this element";
• adding of the action "Assign the following key shortcut to hide this element to the screen reader while it remains visible";
• adding of the action "Assign the following key shortcut to execute the following JS code";
• adding of the action "Automatically hide this element to the screen reader while it remains visible";
• adding of the action automatically execute the following js code;
• adding of the action "Make the following sound file play when the text change in this element";
• adding of the action "Make the following sound file play when this element apeare";
• adding of the action "Make the following sound file play when this element disapeare";
• it is possible to use the function saystring(text) in the js code to execute in order to say a text by the current vocal synthesis;;
• more details about the text of the current selected element in the dom explorer including noaw "aria-label", "value" properties;
• Better repositionement in the list of parameters after modification or deletion;
• better handling of load event that make the script execute faster
• alt+f opens a dialog to search a element by the text it contains;
• shift+upArrow to move the selected parameter up in the list of existing parameters;
• shift+downArrow to move the selected parameter down in the list of existing parameters;
• space to activate or deactivate a parameter inthe list of existing parameters;
• now to make a key shortcut exclusive you can add a "#" character as the first character of the shortcut string
• now you can use those key in key combinations: escape, space, pageup, pagedown, leftarrow, uparrow, rightarrow, downarrow, home, end, delete, del, f1, f2... f12.
• accessibilisation forms are now in application style, so they will behave as classical windows forms
• Importation and exportation are now made in classical open and save dialogs; they create now .wap or .wap.txt files.
• adding of the following actions:
• give the following background color to the element
• give the following text color inside the element
• give the following text size inside the element
• automatically delete the element
• move the element before the following element
• move the element after the following element
• move the element as a child of the following element
• create the following type of element before the element
• create the following type of element after the element
• create the following type of element as a child of the element
• execute the following js code when the element apeare
• execute the following js code when the element disapeare
• execute the following js code when the element takes the focus
• execute the following js code when the element looses the focus
• execute the following js code when there is a click on the element
• execute the following js code every x secondes
• assign the following innerText to the element
• Assign the following innerHTML to the element
• Give a treeview style to this ul element

My other projects

See my other projects at:

https://www.stsolution.org/home.php