Skip to main content

Home/ Web Accessibility/ Group items tagged captions

Rss Feed Group items tagged

Filter: All | Bookmarks | Topics Simple Middle
Sandra Earl

Forget WYSIWYG editors - use WYSIWYM instead | 456 Berea Street - 0 views

www.456bereastreet.com/...yg_editors_use_wysiwym_instead

accessibility WYSIWYG

shared by Sandra Earl on 12 Oct 10 - Cached
  • A huge problem with almost every CMS in existence is the extremely poor quality of the code produced by their WYSIWYG editors.
  • Since visual gadgetry like WYSIWYG editors sells, every CMS has to have one.
  • That, in turn, makes it necessary for Web professionals who want to reduce the risk of clients unknowingly ruining the website’s semantics and accessibility to disable features and implement more or less advanced code cleaning procedures. It is a mess.
  • ...4 more annotations...
  • Because of the problems caused by WYSIWYG editors I have toyed with the idea of providing a much simpler interface for content editors. Markdown, BBCode, and Textile are a few possible solutions that ensure valid markup and increase the likelihood of it being semantic. The problem would be making clients accept working that way, directly editing pseudo markup. Most clients wouldn’t, so that option is ruled out.
  • But there is another kind of editor that is better suited than WYSIWYG for content-driven, client-edited sites - the WYSIWYM (What You See Is What You Mean) editor. In Visually Editing Semantics - What You See Is What You Mean, Peter Krantz mentions one such editor: WYMeditor.
  • From the WYMeditor site: Our goal is to create a XHTML strict web-based editor which will be usable on many platforms, whith the help of the Open Source Community.
  • There are a few limitations, of course. This is an early version, after all. Besides the issues Peter notes in his post about WYMeditor, here are a few more things I noticed: Table accessibility. There is no way to add elements and attributes (th, caption, scope, etc) needed for accessibility to data tables. Table resizing. It is possible to size tables by dragging handles. Doing so is reflected in the markup. That needs to be filtered out at some stage before saving the page to the database. Incorrect nesting of lists. When you create nested lists, the current list element is closed before the next level ul or ol is inserted.
Vernon Fowler

5 Ways to Offer a Better UX for Disabled Users - 0 views

www.sitepoint.com/offer-better-ux-disabled-users

accessibility research empathy colour typography video captioning webdesign

shared by Vernon Fowler on 08 Mar 16 - No Cached
  • Vernon Fowler on 08 Mar 16
     
    Empathy is unrivalled as a skill a user interface designer should have. Walking in somebody else's shoes (or seeing through their eyes may be a better metaphor), can be a temporary replacement for having a user/tester at hand. Let's take a look at some disabilities that we so often forget.
Vernon Fowler

Prettier Accessible Forms · An A List Apart Article - 0 views

alistapart.com/...prettyaccessibleforms

accessibility formdesign forms screenreaders

shared by Vernon Fowler on 09 Feb 19 - No Cached
  • The fieldset element allows us to group form controls into logical, related “chunks.” legend then allows us to add a caption to that fieldset, which helps users understand the context of the form controls contained within that fieldset. In some screen readers, the legend is associated with each form control within a fieldset and is read out after each tab of the keyboard, so that a particular control can always be referenced back to its legend.
  • Vernon Fowler on 09 Feb 19
     
    "The most important part of a form is the HTML we use to build it. Fortunately, HTML gives us a nice assortment of tags to build our forms in an accessible way. These are fieldset, legend, and label."
Vernon Fowler

Breadcrumbs: 11 Design Guidelines for Desktop and Mobile - 0 views

www.nngroup.com/...breadcrumbs

navigation mobile

shared by Vernon Fowler on 18 Jul 19 - No Cached
  • the breadcrumb corresponding to the current page should not be a link. You should never have a link that does nothing. The last breadcrumb (denoting the current page) should not be a link.
    • Vernon Fowler
      Vernon Fowler on 18 Jul 19
       
      The breadcrumb denoting the current page SHOULD be a link and differentiated from others via mechanisms such as aria-current="page" See https://scottaohara.github.io/a11y_breadcrumbs/ for this pattern.
    • Vernon Fowler
      Vernon Fowler on 18 Jul 19
       
      The breadcrumb denoting the current page SHOULD be a link and differentiated from others via mechanisms such as aria-current="page" See https://scottaohara.github.io/a11y_breadcrumbs/ for this pattern.
  • Include the current page as the last item in the breadcrumb trail.
  • Breadcrumb trails should start with a link to the homepage.
  • ...14 more annotations...
  • Breadcrumbs aren’t necessary (or useful) for sites with flat hierarchies that are only 1 or 2 levels deep, or sites that are linear in structure.
  • Unfortunately, on mobile, the cost of using breadcrumbs can quickly overwhelm the benefits. Don’t use breadcrumbs that wrap to multiple lines.
  • Don’t use breadcrumbs that are too small or too crowded together.
  • Consider shortening the breadcrumb trail to include only the last level(s).
  • The Oregon state government website includes a breadcrumb trail, but omits a link to the homepage. However, in this case this is acceptable, as the site also includes a Home link in the global navigation
  • duplicating the Home link in both the global navigation and the breadcrumb trail is not recommended — one or the other is fine
  • This site’s structure is nonhierarchical, and so there is no need (or value) in including a breadcrumb trail.
  • MIT’s main website has a flat hierarchy, with only 1 page in each section. While it features a breadcrumb at the top of the page, this breadcrumb isn’t necessary. In the main navigation, the location of the page is highlighted.
  • Breadcrumbs should include only site pages, not logical categories in your IA.
  • The link to the parent page is a dropdown menu, with the current page’s siblings (bottom image). A better design would  have a separate UI for the local navigation, to enable users to travel to lateral pages in the current section of the site.
  • Breadcrumbs should not replace the global navigation bar or the local navigation within a section.
  • Breadcrumbs augment but do not replace those main forms of navigation.
  • when they skip some of these levels (for example, because they arrived to the site by clicking on an external link such as a search-engine result), breadcrumbs orient them and help them find their way to other, possibly more relevant, pages.
  • In this example, the home page and current page are omitted from the breadcrumb trail, which is not recommended.
‹ Previous 21 - 28 of 28
Showing 20▼ items per page