&

, 2008
ii
()

...................................
.
&

Copyright . , 2007.
. All rights reserved.

, ,
, . ,
, ,
.
.

iii


,

. , ,
.
.
, W3C WCAG 1.0,
.
,

.

. , ,
. , URL

.

:
, , , , , W3C, WCAG,
WAI, ATAG, UAAG, HCI, , , ,
, , Bobby, Cynthia, Watchfire WebXACT, Wave, siteValet

i
 Abstract

As referred by the Information Society Observatory, the World Wide Web should be
completely accessible to people with disabilities as well the elderly. All the Web sites should,
therefore, satisfy the international accessibility specs. Only in this way the human right of choice
is assured still for the people who belong to vulnerable social groups. These guidelines, which
have been issued by the international web consortium W3C and are known as WCAG 1.0, are to
be presented and evaluated in this thesis.
As a conclusion a comprehensive reference is included with regard to existing
accessibility validation systems, which evaluate websites in terms of usability. This thesis comes
to an end with the implementation of an accessibility validation system. More specifically a
website, which contains the accessibility validator, is implemented so that any user can enter the
URL of a site and get in as an output the results of every check that the source code of that site is
subjected to.

Keywords:
Web, Accessibility, Access, Validator, Persons with Disabilities, W3C, WCAG, WAI, ATAG,
UAAG, HCI, Priority, Assistive Technology, Screen Reader, Conformance Levels, Information
Society, Bobby, Cynthia, Watchfire WebXACT, Wave, siteValet

ii


,
, .

iii


, . . ,
.

,

.

, , ,
.

iv


1 ..................................................................................................................................................1
1.1 ............................................................................. ............ ................ 1
1.1.1.................................................................................................................................................1
1.2 ..................................................................................... ........ ........ ................1
1.2.1...................................................................................................................................................2
2 ..................................................................................................................3
2.1 HCI - ................................................. ......... ................ 3
2.1.1 ..................................................................................................................................................4
2.1.2 ....................................................................................................................................................5
2.1.3 .................................................................................................................................................5
2.2 - .............................................. .......................... ................ 6
2.2.1 .............................................................................................6
2.3 .......................................................... ........................... ................ 8
2.3.1 ....................................................................................................9
2.3.2 ...........................................................................10
3 .....................................................................................................12
3.1 ............................................................................................................. ....... .............. 13
3.2 .................................................................................... ...................... .............. 13
3.3 ................................................................................... .................... .............. 14
3.4 ............................................................ .................... .............. 15
3.5 ................................................................ ............................. .............. 16
3.6 ................................................................................... ............................ .............. 16
3.7 .............................................................................. ..................... .............. 17
3.8 ..................................................................................... ................... .............. 18
3.9 .............................................................................. ......................... .............. 19
4 W3C............................................................................................21
4.1 WORLD WIDE WEB CONSORTIUM - W3C ......................................... ................................. .............. 21
4.1.1 ........................................................................................................................................21
4.1.2 WAI..................................................................................................................23
4.1.3 ..............................................................................................................................24
4.1.4 .............................................................................................................................................24
4.2 : 1.0 .......................... ..... .............. 26
4.2.1 ,.......................................................................................26
4.2.2 ...................................................................................................................................27
4.2.3 .........................................................................................................................28
4.2.4 (imagemaps)................................44
4.2.5 ...................................................................................45
4.2.6 ...................................................................................49
4.2.7 ....................................................................................50
4.2.8 appletsscripts...................................................................51
4.2.9 ...............................................................................53
4.2.10 ...........................................................................................54
4.3 : 2.0 ...... ......................... .............. 56
4.3.1 ................................................................................................................56
4.4 ...................................................................................... ........................ .............. 57
5 ..................................................................................................58

v
 5.1 ............................ ......................... .............. 58
5.1.1 W3CMarkupValidationService..........................................................................................................58
5.1.2 CynthiaSays.........................................................................................................................................59
5.1.3 Bobby...................................................................................................................................................60
5.1.4 WebAIMTheWAVE...........................................................................................................................61
5.1.5 WebXACTWatchfire............................................................................................................................63
5.1.6 EvalAccess............................................................................................................................................63
5.2 ............................................... ......................... .............. 64
6 .............................................................................................................................................66
6.1 ................................................................ ........................ .............. 66
6.1.1 Wamp2.0...............................................................................................................................67
6.1.2 PHP.........................................................................................................................................67
6.1.3 MySQL....................................................................................................................................68
6.2 .......................................................................... ...................... .............. 68
6.3 ............................................................ ................... .............. 70
6.4 ................................................................................... ....... .............. 79
6.4.1 ..................................................................................................79
6.4.2 ............................................................................................81
6.4.3 ..................................................................................82
6.4.4 ............................................................................................83
7 ................................................................................................................................................85
7.1 ..................................................................................................... .................... .............. 85
7.2 ................................................................................... ........................ .............. 86
7.3 .......................................................... ............................... .............. 86
7.3.1 ..........................................................................................86
7.3.2 ........................................................................................................86
............................................................................ ........................... .............. 88
......................................................................... ................................. .............. 88
WEBLIOGRAPHY ........................................................................................... ........................... .............. 89

........................................................................................................ ............ .............. 88

........................................................................................................ ............... .............. 88
WEBLIOGRAPHY .................................................................................... ....................... .............. 89
.........................................................................................................................89
.......................................................................................................................... 89

............................................................................... ............... .............. 91

MYSQL ............................................................. ............................ .............. 92

PHP ..................................................................... ........................... .............. 95

vi


2.1 - ........................................................... 4
2.2 .................................. 7
2.3 ............................................................................ 8
2.4 , ............................................... 9
4.1 W3C................................................................................... 22
4.2 W3C ...................................................... 22
4.3 OPTGROUP IE, FIREFOX, OPERA .................................. 37
4.4 TABINDEX ............ 40
4.5 ..................................................................... 43
5.1 W3C MARKUP VALIDATION SERVICE ....................................................................... 59
5.2 BOBBY ....................................................................................................................... 60
5.3 WAVE ........................................................................................................................ 61
6.1 ................................................... 66
6.2 WAMPSERVER............................................................................................... 70
6.3 ................................................................................... 71
6.4 WCAG 1.0 .................................................................................... 72
6.5 URL ............................................... 73
6.6 ............................................................... 74
6.7 .................................................................... 75
6.8 2 ................................................................................................................... 76
6.9 ................................................................................... 77
6.10 10 ................................................................................................................. 78
6.11 PAGEINFORMATION.PHP ...................................................................... 80
6.10 ......................................................... 81
6.11 ............................................. 82

vii


1.1 .................................................... 2
3.1 ............................................... 13
3.2 ..................................... 14
3.3 .................................. 14
3.4 ........... 15
3.5 ....................... 16
3.6 ......................................... 17
3.7 ............................. 18
3.8 .................................. 18
3.9 .................................. 20
4.1 W3C ...................................................................................... 24
4.2 WEB .................................................... 25
4.3 ................................................................... 27
4.4 .......................................................................................... 27
4.5 12 .............. 57
5.1 WAVE ............................................................ 61
5.2 WAVE ......................................... 62
5.3 WAVE ........ 63
5.4 ................................ 65
6.1 ............................................................... 69
6.2 ............................................................... 76

viii
1

,
, .
,

.
.

, .
:
(Bentham, 1780)
: , .
, ,
,

.

1.1
,
:
, ;

.

1.1.1
:
1. WCAG 1.0,
.
2. .
3. .
4. /
5. .

1.2
, ,
2 - -
. 3 . 4
5
1
 . 6 ,
/ 7.
8.

1.2.1
.

R : 216
G : 216
B : 216
R : 204
G : 153 1
B : 153
R : 204
G : 204 2
B : 153
R : 153
G : 204 3
B : 153
1.1

HTML.( Courier New 10)

. ( Courier New 10)

, Light List Microsoft

Word 2007.

2
2

,
.
. ,
ICF-Final Draft Full Version 2001
.
. ,
,
. ,

.

2.1 HCI -
70, Man-Machine Interaction
( ),
, , ,
/ (industrial engineering) ,
HCI.
.
.

. ,
.
. ,
.
,

.

.
.

- HCI.

3
2.1.1

(interactive computer systems), .

, -,
' .
,
,
.
.

,
.
.

, .
, .
background batch processing.

.

2.1 -
4
2.1.2

HCI
, . HCI
, /
, ,
( ,
). ,
.
HCI (interface technology) ,
,
. , ,
.

, HCI :
(Learnability)
(Efficiency)
(Memorability)
(Few Errors)
(Satisfaction)

( ).

2.1.3

70% .
,
,
, ( ).
/.

28 1979 : 3 mile island

backup ,
, .
,
. ,
.

3 1988 : Iran Air 655 USS Vincennes

F-14 Tomcat,
290 .
,
.

5
2.2 -
,
(assistive) ,
(hardware) (software).

, ,
, , .

()
22%,
6%.

:
(28%)
( ,
23% )
(/ ) (15%)

/ (11%), (9%)
(6%).

2.2.1

, ,
, , ,
.

, ,
:

: ,
,
( b210).
. ,
Braille, ,
, , , ,
.... ,
.

:
( 18 ).

, .
6
 :

, . ,

(Joysticks), (Trackball), (Head Sticks), -
(Sip-Puff), (Switches), .

2.2 -

:
,
, , , ,
.

.
, .

,
.

:
. , ,

,
.
,
.

: ,
, , ,
.

. ,
.
7
2.3
, ,
, .
,
, . .
(Zhangxu,2001).

,
. ,
54% , 38%
.

2.3

,

, , .
.
.

.
:
, , , . ;
. ;
, . .
;
.

8
 .

2.3.1

"" ,
, ,
,
, .

, ,
(
, ,
).
, :

,
.
(web browsers) (media player)


.
(Web authoring tools),

.
(evaluation tools) .

2.4 ,
,
Web .

9
/ Web,
.
,
.
;

,

.

(multi-modality) ( , )
, , . ,
(
), ( ),
( ), ( ).

, ,
, ,
.

(style sheets)
.

. Web
. ,

. , ,
.

2.3.2

. ,
:

10

.

, , .
: ,
,
, video,
,

.

.

: ,

. CSS
(Cascading Style Sheets).

: "click here" ,
.

.

: ,

. (screen reader).

, .

:

. , attribute longdesc
. ,
.

,
. ,

.

11
3

,
( ) :

1. (transparent),
,
.

2. , , ,
(effective)
.

3.
(maintained)
.

4. (accessible) ,
,
, .
,
,
,
. ( )

5. (usercentred).


.

6. (responsive),
.

7.
(multilinguality),
.

8. (interoperable)

.

9. (managed) IPR (
) .

10.
(preserved) .

12
3.1
.

.
,
.
,
,
.

,
.

.
,
, .
URL
.
:


.

(.. index.html).
3.1

. ,
,
.

3.2
-
, ,
-.

.
.
crumbtrail (
).

13

.
.



.
.
.
.
.
, .
( )
Crumbtrail.
.
page jumps, .
.
.
.
3.2

3.3
.

.
. ,
, , . ,
.

.
, , ...
.
.
.
.
.
back-up.
.
3.3

14
3.4
'
. ,
. , ,
.

, :

-
;

,
;

,
.

,
.

, ,
,
.
,
. .
.
.
, on-line
.
.

( ).
3.4

. ,
,
- .

15
3.5

. ,
, ,
...
,
,
.

.
, ,
.

.

.

.
.

.
,
.
, ,
, ().

.
, ,
, .
3.5

3.6
.
,
.

.
, ,
.
.

.
.
, flash,
.

16

.
,
.

.
.
.

.
(, )
.
, ( , , )
.
.

.
.
.
.
3.6

3.7
,
.
.
, ,
on-line .
, , (Harvesting)
.
.
,
.

,
.
.
, , .
. ,
, (),
.

17

,



Dublin Core / DC.Culture.
XHTML, HTML XML.
Javascript . .
,
OAI PMH.
META
, / .

Z39.50 SRW/SRU.
.
RSLP. RSLP / DC
META ( ).
.
3.7

3.8

, - ,
(). , ,
.
,
.
.
(IPR)
.
:

.

.

.
.

.

.
.
3.8
18
3.9
.

.
.

.

. ' ,

, , .

.
. ,
,
.

, ,
. ,
, , .
,

. ,
back-up ,
, , ...

,
(Digital Linear Tape DLT-Tape) backups,
CD DVD.

, ,
. ,
, .

,
.

(migration) ,
.

. ,
,
, .

19

.
:
Back-ups

back-ups
DLT
:


()
,
.
.
, plug-ins ...
3.9

20
4 W3C

, . World Wide Web
Consortium (W3C) ,
1999,
(WCAG - Website Content Accessibility Guidelines 1.0), 27 2006
(draft) (WCAG 2.0).

W3C.

4.1 World Wide Web Consortium - W3C

W3C 1994
, Tim Berners-Lee, Massachusetts
Institute of Technology (MIT) European Organization for Nuclear Research (CERN)
U.S. Defense Advanced Research Project Agency (DARPA)
(European Commission). ,
INRIA, ERCIM , Keio.

.
, ,
.
,
(Recommendations) (de facto standards)
.

4.1.1

Web ,
W3C (member organization). 400
,
, , , ,
, . IBM, Microsoft, America
Online, Netscape, Apple, Adobe, Macromedia, Sun Microsystems.
W3C
, .
W3C ,
.
,
,
. ,
,
,
21
 . , W3C,
, , Workshops,
.
,
: , -, , , , , , ,
, , , , , , , ,
.

4.1 W3C

4.2 W3C

22
4.1.2 - WAI

W3C :

1.
2.
3.
4.
5. (WAI).

(WAI)
, , ,
. ,
,
,
.
WAI,
,

.

3 WAI :

(Web Content Accessibility Guidelines 1.0 - WCAG 1.0)
, (, ,
, .) .
, ,

.

(Authoring Tool Accessibility Guidelines 1.0 - ATAG 1.0)

. ATAG ,
,
.

(User Agent Accessibility Guidelines 1.0 - UAAG 1.0)

(, , , ).






23
4.1.3

W3C , :

W3C
" ,
,
, , ,
."
"
,
Web , : ,
. "
" Web
,
.."
"
"" (-) ,


.

".
" Web
, .
, , ,
."
"o ,
Web
Web . "
" , W3C



Web".
4.1 W3C

4.1.4

W3C
Web (Web specifications) .
(Recommendations) , HTML XML,
(building blocks) Web.
W3C (work group)
(members) (invited experts).
, (Working Draft)
(Proposed Recommendation). (Recommendation)
W3C (Recommendation) W3C.
W3C Web standard,
:
24
 Web
1. W3C (suggestion)
(Submission) consortium Web standard. W3C
(submission) consortium.
W3C, W3C

.
2. (submission) W3C Note. Note
(Note) .
Note W3C (discussion).
Note W3C.
Note Note
W3C. Note ,
. Note
W3C Note.
3. (submission) W3C,
(Working Group) (Working Group)
.
(time schedule) (Working
Draft) ,
.
4. (Working Drafts) W3C
(Working Draft) Web site W3C .
,
(reference material).
,
.
5.
(Candidate , -
Recommendation) (software vendors).
(Candidate
Recommendations). (Candidate Recommendation)
("work in progress")
. ,
.
6. (Proposed Recommendation)
(Working Group).
(Proposed ("work in
Recommendation) progress") ,
.
W3C,
.
7. (Recommendations) W3C
(Recommendation) W3C W3C.
W3C
.
4.2 Web

25
 4.2 : 1.0
( WCAG 1.0),
Internet
.
,
.

4.2.1 ,

( 1 11)

1: .
2: .
3: , .
4: .
5: .
6: .
7: .
8: .
9: .
10: .
11: W3C.

( 12 14)

12: .
13: .
14: .

, , ,
(, url).
:

12: ( )
: 12.4: (label)
2
HTML
<label for="firstname">First name:</label>
<input type="text" id="firstname" tabindex="1">

;
26
4.2.2

(checkpoints). ,
(1, 2 3)
.
:

.
1 .
,
.

.
2
.
.

.
3
.
.
4.3

( WCAG 1.0)

1 .
-
1 2 .
-
1, 2 3 .
4.4

:
<a href=http://www.w3.org/WAI/WCAG1A-Conformance

title=" ">

<img height="32" width="88"

src=http://www.w3.org/WAI/wcag1A

alt=" ,
W3C-WAI Web Content Accessibility Guidelines 1.0">
</a>

27
4.2.3

1.1 - (.. (attribute) "alt",

(attribute) "longdesc" ).
- : ,
( ), , (.. GIF),
, ascii, (frames),
(scripts), , ,
, ( ),
, .

.
Braille,
.

.
, alt
browsers
- . alt
- ,
. ,
.
alt, longdesc
. alt
,
.

<!-- .-->
<IMG SRC="home.gif" ALT="
">

<!-- .-->
<!-- graph1.htm
.-->
<IMG SRC="graph1.gif" LONGDESC="graph1.htm" ALT="
.">

<!-- OBJECT.-->
<OBJECT data="home.gif" type="image/gif" height=100
width=100>
. </OBJECT>

28
 <!-- .-->
<SCRIPT type="text/javascript">... </SCRIPT>

<NOSCRIPT>
/ javascript.
</NOSCRIPT>

,
alt , alt="", .

2.1 ,
, .

.
, . ,
:
(
):
1.
2.

:
(
->):
1.
2.

,
/ .

4.1
(.. ).

lang
. ,

, Braille,
, .

<!-- lang.-->
<H1>
<SPAN LANG=el> </SPAN>
</H1>
<P LANG=el> .</P>
29
6.1 (style sheets). ,
HTML , .

CSS.
, CSS,
CSS . style sheet
, . ,
(browsers),
, , CSS
.
, style sheet

<!-- style sheet.-->

<STYLE TYPE="text/css">
.part1 /* */ { padding-left: 0;
color: red; font-size: 14pt;
font-family: copperplate gothic bold, fantasy, sans-serif }
.part2 /* */ {padding-left: 100px;
color: brown; font-size: 10pt;
font-family: times new roman, desdemona, serif }
.part3 /* */ { padding-left: 350px;
color: purple; font-size: 18pt;
font-family: desdemona, times new roman, serif }
.part4 /* . */ { padding-left: 350px;
color: blue; font-size: 24pt;
font-family: fantasy, copperplate gothic bold, sans-serif }
</STYLE>

<DIV class=part4> . <DIV class=part1> </DIV>

</DIV> <DIV class=part2></DIV>
<DIV class=part1> </DIV> <DIV class=part3> </DIV>
<DIV class=part3> </DIV> <DIV class=part4> .
<DIV class=part2></DIV> </DIV>

CSS
. .

: CSS
, CSS :

Internet Explorer: Tools Internet Options Accessibility options

Netscape: View Page Style No Style
Firefox: View Page Style No Style

30
6.2 .


:


<!-- <!--
--> html.-->
<FRAME name= "picture_frame" src= <FRAME name= "picture_frame" src=
"home.gif" > "home.html" >
<!--
. --> , home.html
:
<IMG src= "home.gif" alt= "
.">

7.1 ,
.

().

.

50 z (60 z )
. 2 ,
2 25 z (30 z )
. 25 z .
,
(gif) .

14.1
.

.

. , ,

.

.

.
, / .
31

.

, ,
.

2.2
.

2 3 .


(Protanopia , Deuteranopia- , Tritanopia-
).
/ ,
.
:

(( X 299) + ( X 587) + ( X 114)) / 1000
125.

:
( maximum ( 1, 2) - minimum ( 1, 2) ) +
( maximum ( 1, 2) - minimum ( 1, 2) ) +
( maximum ( 1, 2) - minimum ( 1, 2) )
500.

:


, .

32
3.1 , ,
.

,
bit-mapped ,
. ,
MathML.
, Sqrt[x]

<math xmlns='http://www.w3.org/1998/Math/MathML'
mathematica:form='TraditionalForm'
xmlns:mathematica='http://www.wolfram.com/XML/'>
<msqrt>
<mi>x</mi>
</msqrt>
</math>

3.2 .

XHTML 1.1
:

< !DOCTYPE html

PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-gb">

3.3 .

div.newsItem
{
font: normal 1em/1.3em Verdana, helvetica, sans-serif;
text-align: center;
background-color: #fff;
color: #000;
}

33
3.4 (attributes)
.

(PC), (PT), (in),

(cm) (mm).

em .

3.5
.

. <h1> .
,
,
.

3.6 .

<dl>, <ul>, <ol>

, .

<UL> <OL type=A>

<LI> : <LI> :</LI>
<DL> <DT> <OL type=1>
<DT> <LI></LI>
<DT> <LI></LI>
</DL></UL> <LI></LI>
</OL>

: 1. :
1.
2.
3.

34
3.7 .
.

/ <q> <blockquote>
.
. , <q>
, <blockquote> .

<q> !</q>

<blockquote cite="http://www.w3.org/TR/WCAG10-HTML-TECHS/#text-quotes">
<p> . </p></blockquote>

6.5 .

.
PHP, ASP, PERL ..

,
.

noframes.
.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-gb">
<head> <title> </title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"/>
</head>
<frameset cols="30%, 70%" title=" ">
<frame src="navigation.html" title="" />
<frame src="main.html" title=" " />
<noframes>
<body> <p> <a href="navigation.html"></a>. </p> </body>
</noframes>
</frameset> </html>

7.2 ,
(
).

35
 . ,
.
blink HTML ,
,
em .

7.4 ,
.

,
.
.

. ,
.
7.5
, . ,
.

10.1
,
.

,
.
. Mozilla Netscape
.

11.1 W3C
.

. W3C's HTML
validation service CSS validation service.

11.2 W3C.

font color
, CSS.

: Transitional DOCTYPEs ,
Strict Doctypes.
36
 :

9 : DIR 9 : CENTER
: start : align,
value valign, clear, nowrap
9 : APPLET 9 : hspace, vspace, compact,
9 : ISINDEX type
9 : STRIKE, S, U,
FONT, BASEFONT : face, size
9 : background, bgcolor,
color, text, link, alink, vlink
noshade HR.

12.3 .

tags
select optgroup. options
( ). IE 6, Firefox
1.0, Opera 8.0.
<form> <select id="favcity2" name="favcity2">
<optgroup label="Europe">
<option value="1">Amsterdam</option>
<option value="4">Moscow</option>
<option value="5">Dresden</option>
</optgroup>
<optgroup label="North America">
<option value="2">New York</option>
<option value="6">Salt Lake City</option>
<option value="7">Montreal</option>
</optgroup>
</select> </form>

4.3 Optgroup IE, Firefox, Opera

37
13.1 .

.
:

1. .
2. .
3. .

13.2 .

crawlers
. HTML ,
HTTP-EQUIV, content name.

LINK HTML
"rel" "rev" (.. rel="next", rel="previous", rel="index", ..).

<HEAD> <link rel="prev" href="chk9-0.htm">

<link rel="contents" href="overchk.htm">
<link rel="next" href="chk11-0.htm">
</HEAD>

13.3 (..
).

.
. ,
TITLE.

<A HREF="a.htm" TITLE="level 1"> </A>

<A HREF="b.htm" TITLE="level 2"></A> (main page)
<A HREF="c1.htm" TITLE="level 3"></A>
<A HREF="d1.htm" TITLE="level 4"></A>

38
13.4 .

o
,
.
,
.

4.2 .

ABBR ACRONYM, :

MFA,
W3C. Mass. Ave. Mem. Dr.

<ACRONYM TITLE="Museum of Fine Arts"> MFA </ACRONYM>,
<ACRONYM TITLE="Massachusetts Institute of Technology"> MIT </ACRONYM>

<ACRONYM TITLE="World Wide Web Consortium"> W3C </ACRONYM>.

<ABBR TITLE="Massachusetts Avenue"> Mass. Ave. </ABBR>
<ABBR TITLE="Memorial Drive">Mem. Dr.</ABBR>.

4.3 .

<HTML lang="*"> ,
* . <HTML lang="EL">.

9.4 ,
.

Tab
,
HTML .
, tabindex
. Tabindex <A>,
<AREA>, <BUTTON>, <INPUT>, <OBJECT>, <SELECT> <TEXTAREA> .
39
 4.4 tabindex

9.5 (
), .

(access keys),
.

.

Access keys Windows

Internet Explorer 4+ : Alt + [], Return
Netscape 6+, and Mozilla 1+ : Alt + []
Opera 7+ : Shift + Esc + []

Access keys Macintosh

Internet Explorer 5+ : Ctr + [], Return
Netscape 6+, and Mozilla 1+ : Ctr + []
Opera 6+ : Shift + Esc + []

Access keys Mac OS 9 Mac OS X 10 Mozilla.

Access keys Linux

Galeon 1 : Alt + []
Mozilla 1+ : Alt + []

accesskey.

<map title="Bara Ploigisis" id="NavBar"><p>

<a href="/index.html" tabindex="1" accesskey=""></a> -
<a href="/proionta.html" tabindex="2" accesskey=""></a> -
<a href="/sxetika.html" tabindex="3" accesskey=""> </a> -
<a href="/epikoinwnia.html" tabindex="4" accesskey=""></a>
</p>
</map>

40
10.5 ( )
, (
) .

() , .
| (
) .
.
,
CSS.

11.3
(, , ..).

,
content negotiation
. HTML 4.0
lang.
content negotiation hreflang' <A>
<LINK>.

13.5 .

.
.
(breadcrumb).

. ,
.

Google > AdWords > >

(MCC) > MCC >
MCC;

13.6 , ( ) ,
,
.

41
 .
.

13.7 ,
.

,
. ,
(AND, OR),
.
.

13.8 , , , ..

. ,
:

<h1> </h1>
<ul>
<li> </li>
<li> </li>
<li> </li>
<li> </li>
</ul>

13.9 (
).

, HTML LINK
(attributes) "rel" "rev".
(.. zip, tar gzip, stuffit, ..).


.

13.10 ASCII .

ASCII ,
.
.

42
 SSSS TTTTTTTT UU UU DDDDD IIIIII OOOO
S TT UU UU DD D II OO OO
SSSS TT UU UU DD D II OO OO
S TT UU UU DD D II OO OO
SSSS TT UUU DDDDD IIIIII OOOO

<P><a href="#post-art"> ASCII </a>

STUDIO.
<!-- ASCII -->
<a name="post-art"> ...</a>

14.2
.

,
. ,
. ,
. ,
, ,
.

14.3 .

,
.
(templates)
Cascading Style Sheets.

4.5
43
 4.2.4 (image maps)


1

1.2
.

(
ISMAP IMG)
.
A, B, C, D E ,
. ,

<!-- (server-side image maps)-->

<A HREF="img/imgmap1.map">
<IMG ISMAP SRC="imgmap1.gif"
ALT="
.">
</A><BR>
[ <A HREF="a.htm">Section A</A> | <A HREF="b.htm">Section B</A> |
<A HREF="c.htm">Section C</A> | <A HREF="d.htm">Section D</A> |
<A HREF="e.htm">Section E</A> ]

9.1 ,
.

alt
.
, , .
(
- GIS)
,
:
<!-- server-side image map-->
<OBJECT data="imgmap4.gif" type="image/gif" usemap="#map1">
<MAP name="map1">
<P>Navigate the site. </P>
<A href="a.htm" shape="rect" coords="0,0,39,39">[Section A]</A>
<A href="b.htm" shape="rect" coords="40,0,79,39">[Section B]</A>
<A href="c.htm" shape="rect" coords="80,0,120,39">[Section C]</A>
<A href="d.htm" shape="rect" coords="121,0,160,39">[Section D]</A>
</MAP></OBJECT>

44
 3

1.5
,
.

,

.

<!-- (client-side image maps)-->

<IMG SRC="img/imgmap1.gif" ALT="Image map:
."
TITLE=" " USEMAP="#map1" BORDER=0>

<MAP NAME="map1">
<AREA COORDS="0,0,39,39" HREF="a.htm" ALT=" A.">
<AREA COORDS="40,0,79,39" HREF="b.htm" ALT=" B.">
<AREA COORDS="80,0,120,39" HREF="c.htm" ALT=" C.">
<AREA COORDS="121,0,160,39" HREF="d.htm" ALT=" D.">
</MAP>

<MAP NAME="map2">
[ <A HREF="a.htm">Section A</A>
| <A HREF="b.htm">Section B</A>
| <A HREF="c.htm">Section C</A>
| <A HREF="d.htm">Section D</A> ]
</MAP>

4.2.5


1
5.1 .

, HTML TABLE (
TR, TD, CAPTION). ( PRE)
,
.
45
 table :

.
1 2
1 1 , 1 2, 1
2 1 , 2 2, 2

:
<TABLE border=1>
<CAPTION> .</CAPTION>
<TR>
<TD></TD>
<TH> 1 </TH>
<TH> 2 </TH>
</TR>
<TR>
<TH> 1 </TH>
<TD> 1, 1</TD>
<TD> 1, 2</TD>
</TR>
<TR>
<TH> 2 </TH>
<TD> 2, 1</TD>
<TD> 2, 2</TD>
</TR></TABLE>

<TH> ,
.

.
<TD>,
,
. ,
scope

. : row, col, rowgroup,
colgroup.
id headers.

<TR> <TH id="t1"></TH>

<TH id="t2"></TH>
<TH id="t3" abbr=""> </TH>
<TH id="t4">;</TH>
</TR>
<TR> <TD headers="t1">T. Sexton</TD>
<TD headers="t2">10</TD>
<TD headers="t3">Espresso</TD>
<TD headers="t4"></TD>
</TR>
<TR> <TD headers="t1">J. Dinnen</TD>
<TD headers="t2">5</TD>
<TD headers="t3">Decaf</TD>
<TD headers="t4"></TD>
</TR> 46
 , :

: .Sexton, : 10, : Espresso, :

: J. Dinnen , : 5, : Decaf, :

5.2 ,
.

,

San Jose
25 97 37.74 112.00 45.00
26 97 27.28 112.00 45.00
65.02 224.00 90.00 379.02
Seattle
27 97 96.25 109.00 36.00
28 97 35.00 109.00 36.00
131.25 218.00 72.00 421.25
196.27 442.00 162.00 800.27

,
:

San Jose
25 97 37.74 112.00 45.00
26 97 27.28 112.00 45.00
65.02 224.00 90.00 379.02
Seattle
27 97 96.25 109.00 36.00
28 97 35.00 109.00 36.00
131.25 218.00 72.00 421.25
196.27 442.00 162.00 800.27

11 (
).
,
HTML 4.0 .
, :

: San Jose, : 25 97, : 37.74, : 112.00, 45.00

: San Jose, : 26 97, : 27.28, : 112.00, . 45.00
: San Jose, , : 65.02, : 224.00, 90.00, : 379.02
: Seattle, : 27 97, : 96.25, : 109.00, 36.00
47
 : Seattle, : 28 97, : 35.00 : 109.00, 36.00
: Seattle, , : 131.25, : 218.00, 72.00, : 421.25
: : : 196.27, : 442.00, : 162.00, : 800.27

5.3 , .
, , (
).

CSS
.
.

,
.

5.4 ,
.

CSS
. , TABLE
.
:

<TABLE> <TD>
<DIV style="font-weight: bold"> </DIV>
</TD></TABLE>

<TABLE> <TH> <TH> </TABLE>

5.5 .

(visual browser),
.
summary element TABLE.

<TABLE border="1"
summary=" . . . ">
</TABLE>

48
5.6 .

abbr.
"etc.", "GR", "St.".
abbr ,
browser, , ,
. browsers,
, .

<tr>
<th abbr=""></th>
<th abbr=""></th>
<th abbr=""></th>
<th abbr=""></th>
<th abbr=""></th>
<th abbr=""></th>
<th abbr=""></th>
</tr>

10.3 ( )
, ( )
.

5.3

4.2.6

12.1 (frame) (frame)

.

4 .
. ( )
. ( )
.
.
FRAMESET title.

<FRAMESET ROWS="20%,*,30%">
<FRAME SRC="f1.htm" title=" ">
<FRAMESET COLS="20%,*,">
<FRAME SRC="f2.htm" title=" ">
<FRAME SRC="f3.htm" title=" ">
</FRAMESET>
<FRAME SRC="f4.htm" title=" ">
</FRAMESET>
49
 2

12.2 ,
.

title ,
. ,
longdesc
.

4.2.7

10.2
, ,
.

. 3
:

1 : [ | | ]

2 :

3 : [ | | ]

, -. ,
3,
.

12.4 .

,
.
.

50


10.4 ,
.

(element textarea) :

. . .
:

4.2.8 applets scripts

6.3 (scripts),
.
, .

Applet
alt.

<APPLET code="Press.class" width="500" height="500"

alt="Java applet: how temperature affects pressure">
As temperature increases, the molecules in the balloon...
</APPLET>

: javascript URL

.

51

. , :

<A href="javascript:">...</A>

6.4 (scripts) ,
.

,
(application-level event handlers)
(interaction-level event handlers). onsubmit ,
. ,
, onclick
.
onkeypress :

<!--
JavaScript.-->
<a href="selida.html"
onclick="window.open(this.href); return false;"
onkeypress="window.open(this.href); return false;"></a>

7.3 ,
.

.
, .

8.1 , (scripts)
, . [ 1
, 2.]

, applets, ,
( 6.4).
, .
Flash MX ,
, .
, Java javax.accessibility,
Java 2. AccessibleContext
52

. JFC/Swing!
.

AccessibleContext.

AccessibleContext context = email.getAccessibleContext();

context.setAccessibleName("Email");
context.setAccessibleDescription("The email address of a friend");

. Java
(mnemonics) (keyboard
accelerators)
. setLabelFor Label
.

'
JLabel label = new JLabel(" :");
label.setDisplayedMnemonic('U');
label.setLabelFor(username);
'
JMenu menu = new JMenu("");
menu.setMnemonic('F');
'
JMenuItem item = new JMenuItem("");
item.setAccelerator(KeyStroke.getKeyStroke(KeyEvent.VK_O,KeyEvent.SHIFT_MASK));

9.3 (scripts) ,
.

6.4

4.2.9

1.3
(visual track),
.

, , , , , ..,
.

(
text-to-speech).
53
 .

. (
) ,
.
,
,
.

. QuickTime Apple, W3C SMIL (Synchronized
Multimedia Integration Language) SAMI Microsoft.
,
. ,
.

1.4 (.. ),
(.. )
.

,
, .
( )
( ).
, .

.
.

1.
.
, .
2. ,
. , ,

.

4.2.10

1

11.4 , , ,

W3C, ,
http://www.w3.org/WAI/wcagcurric/overchk.htm
( ) - () .

54
 ,
.
, :
1. .
2. ,
, , .
3. .
4. , fax, e-mail,
24 24.

:
1.
. ,

.
.
2. - .

.

site !
site
site.

site !

<A HREF=path1/> site </A>

<A HREF=path2/> site</A>.

( 2.0).

55
4.3 : 2.0
WCAG 2.0
,
. WCAG 2.0
WCAG 1.0 ,
.

4.3.1

WCAG 2.0 :
1: .

1.1:
( ).
1.2: .
1.3: ,
.
1.4:
.

2: .

2.1:
.
2.2:
.
2.3:
.
2.4: ,
.
2.5: .

3: .

3.1: .
3.2: .

4:
.

4.1:
4.2:
.

56
4.4
( 2007) 12
69 .
, sites (..
), . ,
,
.
, 6
WAI-A, 2 WAI-AA.
1
.

.
:

Web Site

http://www.taxisnet.gr/



()
: http://www.ekt.gr/tolib-serv/edetb

(on line
(
)
)

: http://www.heal-link.gr
:

http://www.duth.gr
:

http://www.upatras.gr
: http://www.ion.gr
: http://www.teimes.gr

: http://www.mohaw.gr/gr
( )
: http://www.ika.gr

(
1)


http://www.sismanoglio.gr
4.5 12

57
5

,
.
.
: ,
(.. ).
online / , .
,
.

5.1

URL .

5.1.1 W3C Markup Validation Service

,
W3C, . ,
HTML
WAI.

:
1. URL
(Validate by URL)

2.
(Validate by File Upload)

3. HTML
(Validate by Direct Input)

58

5.1 W3C Markup Validation Service

,
,
/ .

5.1.2 Cynthia Says

Cynthia Says
. (WAI Section 508),

.
, on-line .
.
. (feedback) ,
.
,
HTML. ""
. , Cynthia Says HiSoftware's
AccMonitor Server,
.
(server) .
.

59
5.1.3 Bobby

,
.
Bobby ,
.
online .
Bobby .
Bobby ( ).
(Priority 1) .
,
Bobby
. Bobby ( ),
(W3 Section 508).
, W3.
Bobby.

5.2- Bobby

60
5.1.4 WebAIM - The WAVE

WAVE Accessibility Tool,

Bobby, (W3 Section 508). WAVE
, ,
, , .
,
.
WAVE
URL http://www.ceid.upatras.gr .

5.3 - Wave

WAVE :

(Errors)

Missing alt text Empty form label
Spacer image missing alt text Multiple form labels
Linked image missing alt text Orphaned form label
Image input missing alt text Frame missing title
Image map missing alt text Invalid longdesc
Image map area missing alt text Broken skip navigation link
Server-side image map Empty heading
Form label missing
5.1 WAVE

61
 (Alerts)
HTML

Suspicious alt text Deprecated bold tag - use
<strong> or CSS instead
Redundant alt text Marquee
A nearby image has the same Possible blockquote
alt text
Very long alt text Very small text
Complex image may require Popup window
long description
Background images should Problematic link text
NOT contain important content
Missing or non-informative Frame with suspicious title
<title>
Fieldset without a legend Hidden skip link
Possible heading Invisible content
Incorrectly ordered headings Accesskey
Incorrect use of list Tabindex
Deprecated italic tag - use Page refreshes or redirects
<em> or CSS instead

Javascript element Javascript jump menu may
be present
Event handler Noscript element

Link to media Link to PDF document
Applet <object> or <embed>
Link to Word document Flash
Link to Excel document Shockwave
Link to PowerPoint document Quicktime
Link to WordPerfect document RealPlayer
Link to OpenOffice.org Windows Media Player
document
5.2 WAVE

62
 (Accessibility features)

Alt text Image input alt text
Null or empty alt text Long description
Null or empty alt text on spacer Skip link
Linked image with alt text form label
Image map alt text fieldset
Hotspot alt text Frame title
5.3 WAVE

:
.

5.1.5 WebXACT Watchfire

online ,
, .
WAI Section 508.

5.1.6 EvalAccess

EvalAccess on-line
(Web Service technology).

. :
,

HTML (HTML mark-up).
.
,
WCAG 1.0.

siteValet, Hermish, Ocawa , TAW, Hera.

63
5.2

,
.
.

Sullivan Matson WCAG

1,0. , (failure-rate)
. ,
0 1. , ,
( , )
.

_
_ =
_

Hackett .. , WAB (Web Accessibility Barrier-

).
,
. ,
. ,
.
,

. WCAG
:

_
WAB _ score =
_

Bhler ..,
. :

A(u ) = 1 (1 Rb Sub )

R S 0 1 (
b u). ,
.

Myriam Arrue Markel Vigo

.
,
(CAM),
,

64
 () ,
(RCM)
.
: ,
(), ()
, ,
,
.

for x in each checkpoint in a guideline {P,O,U,R} loop
for y in each type of checkpoint {error, warning} loop
for z in each priority {1,2,3} loop
x ' = calculate _ x '_ po int ( a, b, T )
E
if < x ' then
T
Axyz = calculate _ S _ line ( b, E )
else
Axyz = calculate _ V _ line(a, E , T )
end if
end loop
3
Axy = k z Axyz 1

z =1

end loop
N xy Axy
y 2
Ax =
Nx
end loop
N x Ax
3
A= x

N
5.4
Myriam Arrue Markel Vigo

65
6

6.1

server-side php HTML.
MySQL mini server Wamp 2.0. , Server
Javascript.

.

6.1

1 : (Mozilla Firefox) HTTP

2 : (Apache Server) ,
PHP

3: PHP script. script,

. PHP MySQL
(server) .

4 : MySQL (server) ,
PHP

5 : PHP script,
HTML. HTML web
(Apache Server)

6 : (Apache Server) HTML browser

(Mozilla Firefox), .

66
6.1.1 Wamp 2.0

To WAMP -server
Windows. WAMP 2.0 :
Apache 2.2.8

PHP 5.2.6 + PECL

SQLitemanager

MySQL 5.0.51b

Phpmyadmin

WAMP,
WAMP :
) WAMP , ( ),
) WAMP ( )
) WAMP ( ).

Apache MySQL
"Stop Service".

/ WAMP
http://localhost http://127.0.0.1/ web browser.

:
Wamp .

6.1.2 PHP

H PHP .

.
php ,
, .
:
9
9
9
9
9 . php
( C Perl)
9
9

67
6.1.3 MySQL

MySQL .
MySQL ,
. MySQL
,
. ,
.
, :

9 Internet
9 backup
9
9

9
9 MySQL .

6.2
(patterns)
.
.

,
( meta): . \ [ ] * + ^ $

1. '.' () .

2. '\' () ,
('(', ')'), ('[', ']') 1 9
( [7], [8] [9]). (escape character)
meta-, .
([4]), .

3. [] .
"^", , .. .
S-E S
E. "]" "-"
.

68
4. '*' () [1] [4],
(*)
.

5. '+' [5], .

6. [1] [10], \(\)

. ,
[8] .
1.

7. '\' () 1 9
([7]).

8. '\<', '\>' '\<' / '\>' ,

, / .
/
A-Z a-z 0-9 _. , /
.

9. xy x y [1] [10]
x y.

10. '^', '$' ^ /

$ , ,
. ^ $ ,
.

[a-z]
[^]-] ] -
[^A-Z]

[a-zA-Z]
\0nnn nnn
\d
\s
\1 \2 ... \n
\\ \
\cx control-x (a-z)
6.1

69
6.3
wamp,
http://localcost ip .
:

6.2 Wampserver

Your Projects
Diplwmatikh, .
index.php ,
.
phpmyadmin
.

70
 6.3

.
, WCAG 1.0, Validator
( ),
, .
,
, .

.
, html .
W3C.

,
.
WCAG 1.0.

71
 6.4 WCAG 1.0

14 WCAG 1.0.
. ,
( ),
,

(_____).
.
,
.
.
14 ,
.

( Validator).

72
 Validator ,
.

:

6.5 URL

url (),
:

1. Screenshot ,
.

2.

3. (DTD). jumpMenu
/ .

4. . jumpMenu
.

, .

73
 6.6

. , .

74
 6.7

, ,
,
ip ( localhost).
, URL 2 ,
,
.
,
. ,
.

2.

75
 6.8 2

.
.
.
,
.

. ,
.

:

6.2

76
 2, ,
.

.

6.9

125.
,
.
2 . RGB

.

77
 6.

6.10 10

css.
css.

.
, .

2 6. , .

78
6.4
.
o
: http://www.ceid.upatras.gr
http://www.contra.gr.
,
.

6.4.1

To
pageInformation.php.
, .

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<body>

<?php
include('pageInformation.php');

$url = "http://www.ceid.upatras.gr";
$file = file_get_contents($url);

$title = get_doc_title($file);
$doctype = get_doctype($file);
$links = get_a_href($file);

echo "<h1> </h1>";

if(!empty($title[0]))
{
$title[0] = preg_replace("/</","&lt;",$title[0]);
echo "<br/>: $title[0]<";
}else{
echo"<br/> .<br/>";
}

if(!empty($doctype[0]))
{
$doctype = preg_replace("/</",'&lt;',$doctype[0]);
echo "<br/> doctype: $doctype";
}else{
$doctype = "<br/><br/> doctype.<br/>";
echo $doctype;
}

if(!empty($links[0]))
79
{
echo "<br/> :<ul>";

foreach($links as $key => $val)

{
$val = preg_replace("/</","&lt;",$val);
echo "<li>" . htmlentities($val) . "</li>";
}

}
?>

</body>
</html>

6.11 - pageInformation.php

80
6.4.2

To
saveimages.php. ,
( ),
:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<body>

<?php
include(saveimages.php);
$url=http://www.ceid.upatras.gr;
?>

</body>
</html>

, .

6.12

81
6.4.3

To
saveheadings.php. ,
( ),
:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<body>

<?php
include(saveheadings.php);
$url=http://www.contra.gr;
?>

</body>
</html>

6.13

type 1 1 (<h1>), 2 2
(<h2>) ...

82
6.4.4

html.

<?php

//
$tables=preg_match_all('/<table /i',$file,$matches);
$withsummary=preg_match_all('/<table[^>]*\bsummary=/i',$file,$wsummary);
$withabbr=preg_match_all('#<th>(?:(?!</th>).)*<abbr #is',$dile,$wabbr);
$width_no_absolute = preg_match_all('/width="[0-
9]{1,3}"/i',$file,$na_widths);
$width_no_absolute2 = preg_match_all('/width=[0-
9]{1,3}/i',$file,$na2_widths);
$height_no_absolute = preg_match_all('/height="[0-
9]{1,3}"/i',$file,$na_heights);
$height_no_absolute2 = preg_match_all('/height=[0-
9]{1,3}/i',$file,$na2_heights);

//
$frames=preg_match_all('/<frame[^>]*>/i',$file,$frames);
$frames_with_title=preg_match_all('/<frame[^>]*title="[_0-9a-zA-
Z\s]*>/',$file,$t_frames);
$frames_with_longdesc=preg_match_all('/<frame[^>]*longdesc="[_0-9a-zA-
Z\s]*>/',$file,$l_frames);
preg_match_all('#(<iframe[^>]*>.*?</iframe>)#si', $file, $iframes);

//
preg_match_all('/<(a.*) href=\"(.*?)\"(.*)<\/a>/i',$file,$hrefs);
preg_match_all('/<(a.*) href=\"(.*?)\" title=\"[^>]*\">/i',$file,$t_hrefs);

//
preg_match('/<meta\s+name\=\"(.+?)\">/i',$file,$meta_tags)

//
preg_match_all('/<form[^>]*>/i',$file,$forms);
preg_match('/<input[^>]*type="submit"[^>]*value=""/',$file,$search);
preg_match('/<input[^>]*type="submit"[^>]*value=" "/',$file
,$nsearch);
$count_input_text=preg_match_all('/<input[^>]*type="text"[^>]*>/i',$file,$inp
uts);
$count_input_values=preg_match_all('/<input[^>]*type="text"[^>]*value="[^"]*"
>/i',$file,$input_values);

//
preg_match_all('/<img [^>]*ismap>/i',$file,$ssmap);
preg_match_all('/<img [^>]*usesmap>/i',$file,$csmap);
preg_match_all('/<img [^>]*alt="[^"]*" ismap>/i',$file,$assmap);
preg_match_all('/<img [^>]*alt="[^"]*" usemap>/i',$file,$acsmap);

83
//
preg_match_all('/<[^>]*onmousedown="[_a-zA-Z.]*">/i',$file,$onmousedown);
preg_match_all('/<[^>]*onmouseup="[_a-zA-Z.]*">/i',$file,$onmouseup);
preg_match_all('/<[^>]*onclick="[_a-zA-Z.]*">/i',$file,$onclick);

//
preg_match_all('/<ol>/i',$file,$olists);
preg_match_all('/<ul>/i',$file,$ulists);
preg_match_all('/<dl>/i',$file,$dlists);

//
$pattern1='%<blockquote[^>]*>(.+?)<\/blockquote>%i';
$pattern2='%<q[^>]*>(.+?)<\/q>%i';

?>

84
7

,
, .

7.1

. ,

, . ,
.
: , .
, ,
:

1. (/,
).

2. &
, .

3. , ,
, , , , ,
.

4. ,
( &
, , ,
, ).

5. (/ ).

6. .

WCAG 1.0 W3C
1, .

, .
,
W3C Validation Markup Service, SiteValet, to Wave .
, , ,
.

85
 , , excel,
..
,
.

7.2
,

, .

. ,
, Noam Chomsky

...
(Chomsky, 1968).
.

.

7.3

7.3.1

3 , Google,

(Google, 2005).
Yahoo.com.


. .


. , ,

, .

.

7.3.2

1 (WCAG 1.0),
2 (WCAG 2.0) .
86
 ,

. site
e-mail site,
WCAG.

87


1. (2004) :
, , .

2. : (), ,
.

3. (2004) : ,
, .

4. : , ,
.

5. ()(2004) :
() ,
, .

6. ()(2004) :
, ,
.

7. ( 2003) : , ,
.

1. Lawton Herny, Jim Thatcher (2002) : Constructing Accessible Web Sites, Peer Information Inc.

2. Lazar J, Dudley-Sponaugle A, Greenidge K.D, (2003) : Improving web accessibility: A study of

webmaster perceptions, in "Computers in Human Behavior", 20 (2), 269-288, Elsevier, USA.

3. Paciello M, (2000) : Web Accessibility for People with Disabilities, CMP Books, NY, USA.

4. Slatin J,M. Rush Sh. (2002) : Maximum Accessibility: Making Your Web Site More Usable for
Everyone, Addison-Wesley, UK.

88
Webliography

1. , :
http://www.kourelis.com/web/ia/publish/1998/Epilipsia.pdf

2. : http://amea.teithe.gr/

3. , : http://www.go-
online.gr/ebusiness/specials/article.html?article_id=874

4. , / :
http://www.epyna.gr/modules.php?name=News&file=article&sid=1569

5. W3C, : http://www.ics.forth.gr/publicity/W3C_leaflet.pdf

6. , -
: www.ilsp.gr/hope_files/imerida/Protopapas.pps

7. ... . , World Wide Web Consortium (W3C) :

http://dide.flo.sch.gr/Plinet/Tutorials/Tutorials-W3C.html

8. , :
http://www.syros.aegean.gr/users/evlach/courses/webaccess/

9. , :
http://www.cs.ucy.ac.cy/~nicolast/courses/cs435/

10. , ( ) :
http://www.etl.uom.gr/mr/courses/proj_amea.html

11. ,
: http://www.observatory.gr/Files/press_releases/PR_AME%C1%20291107.pdf

1. Accessibility Valet Demonstrator : http://valet.webthing.com/access/url.html

2. AccMonitor Online : http://www.hisoftware.com/accmonitorsitetest/

3. Bobby : http://bobby.watchfire.com/bobby/html/en/index.jsp

4. Dive Into Accessibility : http://diveintoaccessibility.org/

5. Hera : http://www.sidar.org/hera/index.php.en

6. HiSoftware Company, Cynthia Says : http://www.cynthiasays.com

89
7. Juicy Studio, Colour Contrast Analyser : http://juicystudio.com/services/colourcontrast.php

8. Microsoft, Guides by Impairment : http://www.microsoft.com/enable/guides/default.aspx

9. NC State Univerity, The Center for Universal Design, Principles of Universal Design, 1997 :
http://www.design.ncsu.edu/cud/univ_design/princ_overview.htm

10. NILS, Web Accessibility Toolbar : http://www.nils.org.au/ais/web/resources/toolbar/index.html

11. School Web Accessibility : http://www.tsbvi.edu/technology/web/508/0a.htm

12. SitePoint, An Introduction to Accessible Web Design : http://www.sitepoint.com/article/accessible-

web-design

13. TAW : http://www.tawdis.net/

14. Torquemada : http://www.Webxtutti.it/testa_en.htm

15. UAEN, Getting Acquainted with the Accessibility problem and its challenges :
http://www.hisoftware.com/uaen/WebHelp/uaen.htm

16. U.S. Federal Government Section 508 Guidelines : http://www.section508.gov

17. Watchfire Corporation, WebXACT : http://webxact.watchfire.com/ScanForm.aspx

18. WebAim Accessibility Techniques & Concepts : http://www.webaim.org/techniques

19. Wave : http://www.wave.Webaim.org/wave35/index.jsp

20. W3C, Web Access Initiative : http://www.w3.org/WAI

21. W3C, W3C MarkUp Validation Service : http://validator.w3.org

22. W3Schools, W3C Tutorial : http://www.w3schools.com/w3c/

:
26
2008.

90


ASCII => American Standard Code for Information Interchange
ATAG => Authoring Tool Accessibility Guidelines
CSS => Cascading Style Sheets
DHTML => Dynamic HyperText Markup Language
DTD => Document Type Definition
HCI => Human Computer Interaction
HTML => HyperText Markup Language
HTTP => HyperText Transfer Protocol
ICT => Information Communications Technology
IST => Information Society Technologies
RGB => Red, Green, Blue
SQL => Structured Query Language
UAAG => User Agent Accessibility Guidelines
URL => Uniform Resource Locator
WAI => Web Accessibility Initiative
WAMP => (Windows), Apache, MySQL, PHP
WCAG => Web Content Accessibility Guidelines
WEB => World Wide Web
W3C => World Wide Web Consortium
XAG => XML Accessibility Guidelines
XHTML => eXtensible HyperText Markup Language
XML => eXtensible Markup Language
1

91


MySQL

# diplwmatikh.
CREATE DATABASE `diplwmatikh`;

# MySQL .
USE diplwmatikh;

# ---------------------------------------------------------------
# site
# validator.php.
# ---------------------------------------------------------------

# ***************************************************
# * *
# * info *
# ***************************************************
# * *
# * , : *
# * id_info --> *
# * url --> *
# * title --> o *
# * encoding --> *
# * doctype --> Document Type Definition *
# * lang --> *
# ***************************************************

CREATE TABLE info(

id_info smallint(5) NOT NULL auto_increment,
url varchar(40) NOT NULL,
title varchar(30),
encoding varchar(30),
doctype varchar(50),
lang varchar(10),
PRIMARY KEY (id_info));

# ***************************************************
# * *
# * eikones *
# ***************************************************
# * *
# * . *
# * id_image --> *
# * src --> *
# * width --> *
# * height --> *
# * border --> *
# * hspace --> horizontal space *
# * vspace --> vertical space *
# * alt --> *
# * longdesc --> *
# ***************************************************

92
CREATE TABLE eikones(
id_image smallint(5) NOT NULL auto_increment,
src TEXT NOT NULL,
width varchar(4),
height varchar(4),
border varchar(3),
hspace varchar(4),
vspace varchar(4),
alt varchar(30) DEFAULT NULL,
longdesc TEXT DEFAULT NULL,
PRIMARY KEY (id_image));

# ***************************************************
# * *
# * epikefalides *
# ***************************************************
# * - *
# * . *
# * id_heading --> *
# * type --> o *
# * h1 1 *
# * keimeno --> *
# ***************************************************

CREATE TABLE epikefalides(

id_heading smallint(5) NOT NULL auto_increment,
type varchar(5) NOT NULL,
keimeno TEXT DEFAULT NULL,
PRIMARY KEY (id_heading));

# ***************************************************
# * *
# * applets *
# ***************************************************
# * applet *
# * . *
# * id_applet --> *
# * code --> applet *
# * keimeno --> *
# * <applet></applet> *
# * width --> applet *
# * height --> applet *
# * alt --> *
# ***************************************************

CREATE TABLE applets (

id_applet smallint(5) NOT NULL auto_increment,
code varchar(40) NOT NULL,
keimeno TEXT,
width varchar(4),
height varchar(4),
alt varchar(30) DEFAULT NULL,
PRIMARY KEY (id_applet) );

93
# ---------------------------------------------------------------
# site
# validator2.php.
# ---------------------------------------------------------------

# ***************************************************
# * *
# * objects *
# ***************************************************
# * object *
# * . *
# * id_object --> *
# * id --> object *
# * classid --> *
# * keimeno --> *
# * <object></object> *
# * codetype --> *
# * width --> object *
# * height --> object *
# * title --> object *
# * alt --> *
# ***************************************************

CREATE TABLE objects (

id_object smallint(5) NOT NULL auto_increment,
id varchar(20),
classid varchar(40) NOT NULL,
keimeno TEXT,
codetype varchar(40),
width varchar(4),
height varchar(4),
title varchar(40),
alt varchar(30) DEFAULT NULL,
PRIMARY KEY (id_object));

94


PHP

: pageInformation.php
<?php

// $file
//

// *****************************************************
// * : get_doc_title *
// *****************************************************
// * *
// * . *
// *****************************************************
function get_doc_title($file)
{
// pattern preg_match
// . :
// preg_match_all
$h1tags = preg_match('/<title> ?.* <\/title>/isx',$file,$patterns);
$res = array();
array_push($res,$patterns[0]);
array_push($res,count($patterns[0]));

//
return $res;
}

// ******************************************************
// * : get_doctype *
// ******************************************************
// * *
// * Document Type Definition . *
// ******************************************************
function get_doctype($file)
{
// dtd false
return preg_match('/"-
\/\/W3C\/\/DTD(.*?)\/\/(?:\w+?)"/is', $file, $matches) ? $matches[1] : false;
}

// *****************************************************
// * : get_encoding *
// *****************************************************
// * *
// * . *
// *****************************************************
function get_encoding($file)
{
// pattern matching charset
// UTF-8

95
 $charset = "";
$ncharset = preg_match("/\s?charset=\"?([A-Za-z0-9\-]*)\"?/i",$file,$matches);
if ($ncharset) $charset = $matches[1];

//
return $charset;

// *****************************************************
// * : get_a_href *
// *****************************************************
// * - *
// * . *
// *****************************************************
function get_a_href($file)
{
$h1count = preg_match_all('/(href=")(.*?)(")/i',$file,$patterns);
return $patterns[2];
}

// *****************************************************
// * : get_styles *
// *****************************************************
// * *
// * . *
// *****************************************************
function get_styles($file)
{
$h1count = preg_match_all('/(style=")(.*?)(")/is',$file,$patterns);
$res = array();
array_push($res,$patterns[2]);
array_push($res,count($patterns[2]));

return $res;
}

// *****************************************************
// * : get_classes *
// *****************************************************
// * *
// * () . *
// *****************************************************
function get_classes($file)
{
$h1count = preg_match_all('/(class="(\w*)")/is',$file,$patterns);
$res = array();
array_push($res,$patterns[2]);
array_push($res,count($patterns[2]));
return $res;
}

?>

96
 : saveimages.php
<?php
// file url
// url
$file = file_get_contents($url);

// matching pattern <img

preg_match_all ( '#(?:<img )([^>]*?)(?:/?>)#is', $file, $imgtags, PREG_PATTERN_O
RDER );
$imgcontents = array();

//

foreach ( (array) $imgtags[1] as $img )

{
preg_match_all ( '#([a-zA-
Z]*?)=[\'"]([^"\']*)["\']#i', $img, $attributes, PREG_PATTERN_ORDER );
$attrs = array();

foreach ( (array) $attributes[1] as $key => $attr )

{
$attrs[$attributes[1][$key]] = $attributes[2][$key];
}
$imgcontents[] = $attrs;
}

//
// key1
foreach($imgcontents as $img => $key1)
{
$id_image = $img;

// eikones
$query = "INSERT INTO eikones (id_image) VALUES ('" .$id_image. "')";
mysql_query($query);

foreach($key1 as $imgs => $key2)

{
// html
// src , string
// , path
if ($imgs == 'src')
{
$img = array_reverse(split('/', $key2));
$key2 = $img[0];
}

// update src
$query = "UPDATE eikones SET " .$imgs. " = '" .$key2. "' WHERE id_image =
'" .$id_image. "'";
mysql_query($query);

}
}

?>

97
 : saveheadings.php
<?php

//
$file=file_get_contents($url);

// matching
// h1 h2 h3 h4 h5 h6
$regex = '%<h([\d])[^>]*>(.+?)</h\1>%si';

//
$numMatches = preg_match_all( $regex, $file, $matches, PREG_SET_ORDER );

$key=1;

//
foreach( $matches as $headline)
{
$id_heading = $key;

// epikefalides
$query = "INSERT INTO epikefalides (id_heading,type,keimeno)
VALUES('" .$key. "','".$headline[1]."','" .$headline[2]. "')";
mysql_query($query);

// 1
$key=$key+1;
}

?>

98