Replace cautiously

The above-stated method should be used with special the responsibility. In the image always there should be a same text, as in the hidden html-code. Otherwise it will be unfair to show users at the switched on styles one, and at switched off - another. The image - substitute can differ in the size and in the way of a spelling of a font, his{its} color and in distance between symbols. But these stylistic decisions are defined{determined} by only graphic design of page, and they should not be applied to the replaced html-text. For example, if to repeat pasting words (i.e. removal{distance} between them blank as it is made in graphic headings of a site stopdesign.com) in html-text, voice browsers and browsers for blind will transform the text into porridge. Hence, the html-text should be made out with observance of spelling and syntax as though he intended for page without styles.

It is necessary to mention some very serious lacks of this method:

First, in spite of the fact that this method perfectly approaches for search robots (as against an insert of simple images instead of the text), the user will have problems by search of the replaced text (function of search in browsers) or at his{its} copying in a clipboard.

Second, sometimes it happens (though and it is rare), that the user disconnects show of images in a browser, but does not switch off support CSS. In that case replaced text will be still latent, and the background image on the screen will not appear. As the result, page will look as with empty blocks without the text. As it has already been said, such cases are rare: if something from two (CSS and the schedule) is switched - off, also the second often is switched - off.

Thirdly, the user cannot manipulate the graphic text: will not leave to change at heading the size, color or to make his{its} more contrast (i.e. all that so it is easily possible to make with the usual text).

These lacks should be taken into consideration, and the decision on use of the given method should be accepted in each concrete case. If all of you-taki decide to use this method, try to take into account also all nuances by development of images - replacements. It will be simply irresponsible to use in them the fine or low - contrast text. At a choice of colors and-or a background of the image try to take into account features of perception{recognition} of these colors at colour-blind persons.

Also remember, that excessive (or wrong) use of good receptions can leave in due course sideways. We always use this method seldom and very cautiously.

Compatibility with browsers:

Mac: Camino .7 +, IE 5 +, Mozilla, Netscape 6 +, OmniWeb 4 +, Opera 5 +, Safari

Win: Firebird .6 +, IE 5 +, Mozilla, Netscape 6 +, Opera 5 +, Phoenix .5 +

THE IMPORTANT NOTES

The method could not pass check by the several popular programs, reading to the user the text from the screen. See clause{article} on site A List Apart: Facts and Opinion About Fahrner Image Replacement.

Results of the research which have been lead{which have been carried out} Dzho, show, our idea to create something more floppy, than simple images with the attribute registered for them alt, has come to grief. We assumed, that in browsers with the switched on show schedules the text will be latent by a style rule display:none, and in voice browsers precisely it{him} will read to the user. Appeared, that some browsers so do not do{make} even in that case when we register in styles media = "screen" as they will read to that would be visible on the screen literally. The majority of voice browsers do not support media = "aural" so "speak" any sense of use of properties vanishes in the table of styles for them.

Offers acted to use instead of " display:none; " a rule " visibility:hidden; ", but it also did not solve a problem of perusal of the "hidden" sites of the text in the majority of voice browsers. The current version of popular program JAWS - perhaps most widespread voice browser - all the same reads the text latent by method Farnera. But, looking on actions of other similar programs, we cannot rely that following versions JAWS will save this function.

As well as at job about any other content - preobrazujuhhej (content-altering) a technique before her{it} to apply, it is necessary to weigh carefully all advantages and lacks at the decision of specific targets of imposition. Since time of a spelling of clause{article} the methods deciding{solving} a similar problem{task} - everyone with the advantages still more some. However any of methods and is not the universal decision of a trick with substitution of the text on the image. The brief list of alternative ways is below resulted:

Transformation Valiant[Leahy/Langridge Image Replacement (LIR)]

Essence: contents of a tag <span> disappear by the task to an ancestor of a tag <span> zero height (height: 0;) and invisibilities (overflow: hidden;). Then the top space (padding-top), corresponding is set to height of the background image. The method is offered in one and too time Simusom Are valiant and Stjuartom Lehngridzhem (Seamus Leahy and Stuart Langridge).

Shift of the text by method Randla (Rundle's Text-Indent Method)

Mike Randl (Mike Rundle) has invented a simple trick with use of CSS-property "text-indent" for shift of a site of the text for limits of seen area of an element.