| |
|
Increasing
accessibility and readability of web pages.
There are some guidelines for creating an
accessible and
professional web design
Text can be a very important tool in the context of
professional web design. It can be extremely
flexible as it can be changed into Braille or audio, used to
describe non-text elements and can be presented visually in
numerous sizes. However, if not used carefully it can also be
destructive. Examples of text being harmful are:
1. Not changeable to suit the preferences of end user.
2. Presented in dense blocks, which makes it difficult to read.
3. Difficult to read due to font incompatibilities, so small it
can’t be read.
4. Unreadable because of inadequate contrast between text color
and background or ‘busy’ backgrounds.
5. Presented as an image - that can't be resized or read by
people using screen readers.
6. Difficult to read due to movement or blinking or text.
With some careful thought and application of a few basic
guidelines, these problems can be avoided for
.
A. Instead of setting a font size or type, leave that decision
to the user.
For many designers however control over the web text is needed
due to reasons of branding, styling and sometimes due to subject
necessities. Control of web text can also realize usability
gains. CSS provides useful features like limited control over
margins, adjustments with line width, line height,
color and font choice and size.
You can use all of this to present the text of your web site in
a way that makes it easier to read. Remember the easier it is to
read the more accessible it is.
Accessible text is very important for
professional web design. Readability of the
text should not be compromised by inaccessible color schemes.
Visitors will be shown the web page with the default font and
font size that they have set in their web browser preferences
and can change these properties to suit their own needs.
If however, control over the size, color, layout and typeface is
needed then you must realize that you will never be able to
completely control how a user will see your text. The reason is
that HTML defines the logical structure of documents; leaving
the presentation of the page up individual computer capabilities
and devices that displays the page.
Your own “suggestions”can be provided for how a web page should
look, but the fact is that users can override your settings to
match their own web browser preferences. And that’s how it
should be on a accessible website design India.
There is no one best font for accessibility. It is fact that for
any particular user there is no ‘most accessible font’. There
might be one, but it will not be the same one for every user. In
the world printed documents this means creating numerous
versions for every document to meet the different presentation
needs of each individual. On a
professional website design India, we can
provide one web page capable of being presented in many
different ways, through the use of style sheets.
We cannot decide what will be the most accessible font for a
user. We must fall back on the assumption that the user himself
knows best and let him pick a font which he is comfortable with.
On an accessible website users should be able to do the
following:
1. Style sheets should be turned off so that the page adopts the
default settings in a users web browser. This is another good
reason not to use the deprecated font tag; presentation
attributes will still be present after the user turns off the
style sheet.
2. Substitute their own style sheet, assuming that browser has
this facility. Override all the preferences set in your style
sheet with their own including font size, style and colors. Here
a critical issue is the unit used to set the font size, that is,
absolute units against relative units.
Creating a accessible and usable font is no walk in the park and
it will to helpful to keep in mind these tips while doing so.
1. The type of browser will affect the text visually.
2. Availability of fonts will be different for different
operating systems. Text size will depend on the operating system
itself and its screen resolution.
3. Some typefaces are designed to look good on paper and some
are designed to look good on web pages. If the fonts designed
for paper are used on screen then it might
create a messy effect.
4. Different computers have different defaults and a user can
change the preferences on his browser.
Normally web pages are created with images as heading instead of
text, to get around the limitations spoken of above. Sometimes
all the text will be contained in one image. This option does
give the designer complete control over the look of the text but
it also creates some problems. Professional web design India in
this manner will be accessible to a lesser amount of people.
Some other key issues are:
1. The download time becomes longer as the image increases the
size of the page.
2. Images can’t be enlarged via the browser preferences. The
size of the image will remain the same no matter how large the
text becomes.
3. Readability may be less, as it will not be possible to
increase color or contrast.
4. If no ‘alt’ attribute is added to the text in the image, it
will be lost when images are turned off in the client browser.
Alt attributes will need to be added to each graphic.
5. Using images instead of real text reduces the amount of
information related to page structure. For example, a heading
will be marked with the <hn> tag, whereas an image with the
heading will not be. So, the text will not create the desired
effect. Marking headings appropriately is useful especially for
those people who use screen readers.
6. It is not easy to change the presentation of text across the
site, instead using style sheets to change the presentation is
more efficient.
B. To ensure the text on your professional web design India is
readable, size is a important factor. Accessibility and
usability are the primary concerns of a professional web
designer. People who are visually impaired will obviously find
large text easier to read. If you provide them this benefit,
does it mean that people who are not visually impaired will be
able to read your pager quicker?
Whatever your intentions are, the fact is that placing big text
on your web page may actually deter some people from your
website. This is because there are people who find small text
more accessible. So, if both the texts might repel visitors,
what can be done to ensure that the text on the page is
accessible to the widest audience possible? Instead of worrying
about the right size, we can create something that is called
flexible text. To put it simply ensure that the user can set the
size of the text to whatever he is comfortable with.
Accessibility of a website relating to text is basically letting
the user set his own browser preferences.
By not controlling the text on the
professional web design, you are removing
accessibility barriers, at least, those relating to text which
you might put unknowingly in the way of your visitors. However
does it also mean that your pages will not look as nice as you
want them to? And also will that adopt the user’s browser
preferences and the default HTML style sheet? The outcome is
uncertain.
However, with the use of relative units, you can get the best of
both worlds. You can give the user control of relative text size
and you get to set text sizes that won’t offend your
preferences. With this method, if a user changes the text size
in their browser, then the text off all the pages will change,
but the relative size of the text structure will remain the
same.
By incorporating relative units to set the text size of your web
pages, you can be sure that even if you can’t predict the user’s
requirement or the type of output device, the visitors will be
able to make it big if he needs, just by changing their browser
preferences. Below are some example of relative units you could
use to give your users that ability:
1 em units
2. percentages
3. relative keywords such as smaller or bigger
Different users will have different needs. Some might prefer
large text, while some small. Some users are comfortable with a
highly contrasting color scheme, while some can only read yellow
text on a black background. To provide accessibility for
everyone,
professional web design should be flexible in
design, so that they may change the text and color for their
comfort and needs.
Download this Article in PDF Format
If you do
not have Acrobat Reader,
Download Here
More Articles on
Website Design & Development India
| |
