I'm working on an new TYPO3 website and try to make this as barrier-free as possible.
Checking the site with a testing tool (wave) i get told that there is redudant text in the menu items. It says: "Title attribute text is the same as text or alternative text".
The generated code (boostrap_package) looks like this for example:
<span class="nav-link-text">Fach</span>
I dont know how to change this. Can someone help me?
The WAVE tool reports "errors" (red squares with a white X, ) and "alerts" (yellow triangles with a white exclamation point,), among other things.
All results from WAVE should be inspected for accuracy but in general, "errors" typically need to be fixed (most of the time they're WCAG failures) but "alerts" might be a "best practice" and not necessarily a WCAG failure.
In this case, having a link with text that matches the title attribute will most likely cause a screen reader to say the text twice so it's flagged as an "alert" (). It's not great to hear the text twice but it's not a failure either.
foo
Assistive technology, such as a screen reader, will announce the "accessible name" and optionally the "accessible description". The description is normally announced with default screen reader settings but the user can turn it off.
The "accessible name" will come from the text inside the link, "foo" in my example or "Fach" in your example. The "accessible description" will come from the title attribute.
You can see a list of various attributes that are used to computer the accessible name and description at Accessible Name and Description Computation 1.1.
In this case, the "accessible name" comes from step 2F, "Name from Content" and the "accessible description" comes from step 2I (eye), "Tooltip attribute".
A screen reader normally announces the "accessible name" of an element, the type or role of the element, "link" in this case, and then the "accessible description". So you'd hear "foo, link, foo" or "Fach, link, Fach".
WAVE is just letting you know that hearing the text twice might sound a little wordy and redundant. You don't have to fix it but it's worth considering. A sighted user will see the text of the link and if they hover their mouse over the link, they'll see the same text in the tooltip. It doesn't really give the user any more information than they already have so the tooltip is kind of useless.
Related
I have a title component(touch-ui) in my project and made the title field mandatory by setting required(boolean) – true at the title property level. Now, when we save the dialog with an empty title field, validation fires up, but the triangular icon overlaps the description icon in the component. See the screenshot attached. Is there any way to resolve this?
Seeing the same behavior in We.retail title component.
It's the same in AEM 6.4. I've kind of assumed this was by design, so that more attention is drawn to the error.
If you look at the JavaScript behind the validation logic, you'll notice that the description icon receives the u-coral-screenReaderOnly CSS class as soon as a validation error appears, which results in its disappearance. It's not that the error icon overlaps the info one. The latter is explicitly hidden from sight.
This appears to be part of the Coral UI 2 client library. This isn't something you could fix on your own (an attempt to do that would be tricky and not maintainable). If you need this behaviour changed, you could try your luck contacting Day Care. It does look like a deliberate feature though.
I have an accessibility requirement that states:
"Verify that, upon input within the stated UI component, the user input does not force a change of context unless the user has been previously advised through messaging.
-- Change of context = That no change occurs in the user agent, viewport, focus of that particular element, or content changes that impact meaning."
WCAG give an example of a failure to be a "pop-up window". To non-developers, I am thinking that a on-screen modal could be perceived as a pop-up window. Does anyone else agree?
We literally have dozens of modals all over the site I am working on and need to make sure before I start throwing aria-labels all over the place.
Yes, it is a change of context. In operating systems, this is communicated to users through the user of the ellipsis (...) at the end of the name e.g. a button with the text "Save..." can be expected to popup a dialog, whereas a button with the text "Save" will be expected to just save.
You can use aria-haspopup="true" on a button, in combination with a convention like the ellipsis to convey this in an accessible manner. http://www.w3.org/TR/wai-aria/states_and_properties#aria-haspopup
Using 2.0
Getting starting, confortable with Smalltalk, so tool questions I have not found readily in image or 'by Example' book (outdated).
Looking for entry field (not ready-to-use dialog box).
Like:
(TextMorph new) contents: '(enter name here)'; openInWorld.
"but this just opens text, would like to be editable"
Would like to construct [simple] canvas with say four fields e.g. entry, radio, dropdown, etc. examples available?
Anyone know where 'PreferencesBrowser' has been moved to (e.g. keyboard etc.).
Is there a 'Local senders of...' in regard to class browser selected method?
In order to construct a UI you could either use Polymorph or Spec.
For Polymorph examples try in a workspace:
UITheme exampleDialogs.
UITheme exampleBasicControls
For a Spec tutorial have a look at:
Bahman Movaqar, Spec - Part I: The Basics.
The Preferences Browser is replaced by the much nicer Settings Browser which can be found in WorldMenu > System > Settings.
And you can display a method’s senders in Nautilus (the new standard system browser) when you right click on a method name in the method list via the context menu.
You may want to read a Spec tutorial: http://www.bahmanm.com/blogs/spec-part-1-basics
Does anyone know how to show a spinner for progress bar in a j2me alert?
Here is my piece of code so far:
loadingDialog = new Alert("Please Wait","Please Wait.",null,AlertType.INFO);
Gauge gau = new Gauge( null, false,
Gauge.INDEFINITE,
Gauge.CONTINUOUS_RUNNING );
loadingDialog.setIndicator(gau);
loadingDialog.setTimeout(500000);
displays.setCurrent(loadingDialog);
I am getting a horizontal line (like a slider). What I want is a spinner in place of it.
http://www.developer.nokia.com/Resources/Library/Full_Touch/ui-components/progress-indication.html
The second image (labelled non interactive gauge) of the link is what I am looking for:
The way how you create Gauge looks about right, in accordance with instructions given at Nokia page you refer as well as with Gauge API javadocs (available online):
CONTINUOUS_RUNNING
The value representing the continuous-running state of a non-interactive Gauge with indefinite range.
...
INDEFINITE
A special value used for the maximum value in order to indicate that the Gauge has indefinite range.
Explanation at Nokia page (somewhat vague) suggests the most likely reason for the issue you describe is that Nokia shows spinner only in forms, not in alerts:
- Indefinite gauge in Java Form uses spinner.
- An Alert uses a "barber shop roll" (animated bar of fixed length).
The way to test above assumption is to put Gauge like yours into the Form instead of Alert and see how device / emulator displays it.
If Form shows spinner, then the most straightforward workaround is to use Form instead of Alert. In this case, since Form lack "dismissal" feature provided by Alert, you would have to implement it yourself - eg by using TimerTask to schedule form replacement with previous screen.
Hehehe, the clue is in the link you gave --
Java Alerts do not use spinners due to layout constraints.
So it's not possible!
In my program I want the user to be able to choose between some options so I was using wxChoice component. Unfortunately after user interaction (clicking a button) I have to show custom text (not from my predefined list). Everything works fine if I use wxCombobox control but the drawback of this approach is that each time user selects an element from a list, selected text is highlited. It is annoying. I want the component to be read-only like. How to achieve this ?
Some code to visualize my question:
wxComboBox* viewAngle = wxDynamicCast( owner->FindWindow
( ID_CHOICE_3D_VIEWANGLE ), wxComboBox );
viewAngle->SetSelection( wxNOT_FOUND );
viewAngle->SetValue(_("Custom View"));
EDIT:
This control is used to set camera view in 3D object viewer application. Possible options are like: top, left, right, etc. It is also possible that the user moves 3D object using mouse. In that case I want my combobox to display "custom view" string. However "custom view" should not be a part of combobox list because selecting this option does nothing.
wxWidgets default implementation alwasy marks selected text. Which might be misleading for the user because he might think that he is expected to input any text.
IMHO, the custom text should be added to the wxComboBox control, the program could just ignore it when user selects that option.
Also, the wxComboBox's wxCB_READONLY style could be used to avoid the highlighting thing.