Information and Opinion About Fahrner Picture Substitute – A Checklist Aside

Improvement of the Fahrner Picture Substitute approach and its
analogues is shifting quicker than the destruction of the Berlin Wall.
This text offers some much-needed empirical information on how FIR truly works in display screen readers.

Article Continues Beneath

Named after Todd Fahrner, apparently invented by C.Z. Robertson, and popularized
by Douglas Bowman (see his web site for full coding
particulars) and Jeffrey Zeldman’s Designing With Net Requirements, FIR is a standards-compliant approach that makes use of
stylesheets and extraordinary HTML to offer a visual picture, normally
consisting of textual content. The designer specifies, by way of CSS, that the
picture will show usually; if it shouldn’t show for some
motive, the underlying structural HTML markup is meant to take its

Utilizing FIR, it turns into doable to properly typeset headlines and different
design components whereas utilizing markup no extra sophisticated than inside
<h1>. The HTML plain textual content is hid by way of a
stylesheet declaration of show: none
(canonically, not less than – you might additionally use
visibility: hidden). The image of textual content shows
as a CSS background picture.

The benefits listed below are a pleasant graphical look more often than not
and markup considerably extra elegant than <h1>
, which is just about your solely
various if, say, you need to use an image of textual content as a headline.
As a result of it doesn’t nest a picture inside a heading, FIR is not less than
superficially higher for accessibility.

As defined in a earlier story for A
Checklist Aside, display screen readers are functions that learn internet pages, and
normally anything in your
pc, out loud. They make a pc accessible to an individual who
is blind or severely visually impaired, and have been used
often by folks with studying disabilities like dyslexia. They
are a type of adaptive know-how – software program or
{hardware} used to make a pc accessible to a disabled individual.

The main display screen readers are:

  1. IBM Dwelling Web page Reader (which limits
    itself mainly to internet pages, web-based mail, and multimedia
  2. Jaws (Freedom Scientific)
  3. Window-Eyes (GW Micro)
  4. OutSpoken
    (ALVA Entry Group; Home windows and Macintosh, although the Mac
    model has been discontinued)
  5. Emacspeak (freeware for Linux; T.V. Raman)
  6. SpeakThis (Fonix)

Stylesheet interpretation#section3

In Fahrner Picture Substitute, two CSS methods are in typical use,
although just one pertains to visible styling. That’s true even
although each derive from visible, not auditory, CSS media sorts.

show: none is our bugbear right here. The W3C
specification states:

This worth causes a component to generate no bins within the formatting
construction (i.e., the ingredient has no impact on format). Descendant
components don’t generate any bins both; this habits can’t be
overridden by setting the ‘show’ property on the

Please notice {that a} show of ‘none’ doesn’t create an
invisible field; it creates no field in any respect.

Therefore, show: none actually means
manifestation: none or
elimination: complete. An merchandise assigned to
show: none expunges itself.

There’s another choice that can be utilized:
visibility: hidden, during which, the spec tells us,
“[t]he generated field is invisible (totally clear), however
nonetheless impacts format.”

The visible distinction, then, is between nonexistence and an empty
bounding field. How ought to display screen readers deal with these?

Person testing with display screen readers#section4

I have no idea the reply to that query, however, due to some consumer
testing, I can now inform you how display screen readers do deal with

I requested numerous contacts and some mailing lists (WAI
Curiosity Group, UVIP-Net-Check) to strive
studying FIR-encoded textual content with each display screen reader they might put
their fingers on.

The take a look at case was the somewhat easy intro web page for Ten Years In the past in Spy, my
pæan to the now-defunct satirical journal that Matt
Mullenweg had lately re-coded utilizing CSS
format and Fahrner Picture Substitute. Two pictures on that web page had been
marked up with FIR. Beforehand, I had used extraordinary img

I arrange two take a look at pages:

  1. Utilizing
    show: none
  2. Utilizing
    visibility: hidden

I used to be capable of find customers of three variations of Jaws, plus
Window-Eyes, Dwelling Web page Reader, and one other product, Hal. I used to be additionally capable of get outcomes for
the now-discontinued OutSpoken for Macintosh.

The outcomes are unreassuring.


  show: none

  visibility: hidden

  Hal model 5.20

  Doesn’t learn


  IBM Dwelling Web page Reader 3.02

  Doesn’t learn

  Doesn’t learn

  Jaws (4.02, 4.50, 5.0 beta)



  OutSpoken 9

  Doesn’t learn

  Doesn’t learn

  Window-Eyes 4.2

  Doesn’t learn

  Doesn’t learn

It appears clear that any ingredient given a mode of
show: none shouldn’t be rendered, learn, or
manifested in any respect by any machine in any modality. Hal, IBM Dwelling Web page
Reader, OutSpoken, and Window-Eyes are behaving correctly beneath this
interpretation, whereas Jaws is misbehaving.

It appears additionally that a component styled with
visibility: hidden, as a result of it generates a field with
invisible contents, shouldn’t be learn by any machine whether or not visible
or not (that’s, both a graphical browser or a display screen reader). The
sole distinction between the 2 stylesheet declarations is the impact
on the rendered format, which a browser should obey however a display screen reader
might theoretically ignore. (Recall the distinction between
show: none, which takes up no house, and
visibility: hidden, which does.)

An exception may very well be a case the place the bounding field styled with
visibility: hidden impacts studying order or some
different consideration that’s perceptible in a sequential voice
presentation, during which case a display screen reader might alter its voice
output in a roundabout way. Maybe some makes use of of FIR fall into that class.
We might use some take a look at pages to look at that concept.

In any occasion, it appears that evidently no display screen reader ought to work
with Fahrner Picture Substitute besides in uncommon circumstances. The truth that
the dominant such program, Jaws, and the smaller-market product Hal
truly do perceive FIR is an accident we should always not depend on for
the long run.

A bit-known function of Jaws, Window-Eyes, and Dwelling Web page Reader is
the power to synchronize voice output with both onscreen show
(scrolling the display screen and/or highlighting sections as they’re learn)
or Braille or each.

  • Window-Eyes launch notes name it a “browsing with sighted buddies” function.
  • IBM Dwelling Web page Reader
    “is synchronized with a shifting cursor to make studying even
  • Jaws and Window-Eyes can each
    produce Braille as an alternative of or concurrent with voice.

Thus, display screen readers in widespread use are multimodal gadgets.
They’re clearly at odds with the present CSS media-type definitions as a result of their
behaviour is multimodal, for which the prevailing display screen,
aural, and braille media sorts are usually not actually suited.
Maybe it’s time for a brand new media kind that display screen readers in
precise use at this time might adjust to – one that offers clear
steerage on how a system that shows, talks, and produces Braille
ought to deal with real-world model definitions.

I recommend right here that the World Huge Net Consortium fail to repeat its
mistake with embed, a widely-used and still-supported
ingredient that was by no means made authorized within the (X)HTML spec. The multimodal
behaviour of present display screen readers must be explicitly authorized
in keeping with the CSS spec even when that requires including to it.

That wouldn’t require overturning the prevailing spec, which
already says, “Media sorts are
mutually unique within the sense {that a} consumer agent can solely help
one media kind when rendering a doc. Nonetheless, consumer brokers might
have completely different modes which help completely different media sorts.” It
doesn’t seem like a troublesome job to develop these definitions to
present for multimodal output.

With a media kind that pertains to the way in which display screen readers in vast use
truly behave, we’d have a stronger foundation from which to
insist that screen-reader producers adjust to stylesheet
specs. A full dialogue of that will, after all, require a
separate article.

Not an accessible approach#section8

Sadly, Fahrner Picture Substitute can’t be mentioned to be an
accessible internet approach when used for textual content. Display screen-reader
customers both already can’t learn any textual content marked up that manner or will
not be capable to sooner or later when the software program is up to date to
interpret CSS accurately. Different folks with disabilities will most likely
by no means be adversely affected by its use, and lots of will profit the way in which
nondisabled folks do, since a whole lot of disabled folks on-line have
regular imaginative and prescient and revel in enticing web sites. However we can’t exclude
screen-reader customers from a conception of accessibility.

For that motive, standards-compliant designers ought to use FIR solely
for pictures that may very well be known as “nonsemantic,” that’s,
not significant. Background patterns is likely to be one instance, or a
firm emblem that’s reproduced in plain textual content (presumably as a heading)
someplace close by. Use your frequent sense.

Assist for builders#section9

This case of a standards-compliant approach, superior by probably the most
subtle builders, that nonetheless hits an iceberg and sinks
on the subject of accessibility not less than has the advantage of
highlighting a number of deficiencies that should be remedied. In

  • Brandon Bowersox
  • Douglas Bowman
  • Wealthy Caloggero
  • Tomas Caspers
  • Antonio Cavedoni
  • Tantek Çelik
  • Tom Croucher
  • Bob Easton
  • Todd Fahrner
  • Chris Hofstader
  • Michael L. Johnson
  • Andrew Kirkpatrick
  • Eric Meyer
  • Will Pearson
  • Seth Rothberg
  • Dave Shea
  • Aaron Smith
  • Jim Thatcher
  • Léonie Watson

Leave a Comment