Vortrag von Kai Laborenz auf dem Multimediatreff XXIII - Frameworks and CSS am 21.06.2008

1. pí~åÇ~êÇâçåÑçêãÉ=ìåÇ=Ä~êêáÉêÉÑêÉáÉ=tÉÄëáíÉë=ãáí=qvmlP
TYPO3 - barrierefrei!
h~á=i~ÄçêÉåòI=pìåÄÉ~ã=dãÄe

2. „...körperlich und physisch topfitt!“ <cite>Thomas Häßler</cite>

3. Worum geht es heute?
qvmlP
_~êêáÉêÉÑêÉáÜÉáí
dêìåÇäÉÖÉåÇÉ=j∏ÖäáÅÜâÉáíÉå
qçé=R=ÇÉê=cÉÜäÉê=ìåÇ=c~ääÉå
kΩíòäáÅÜÉ=bñíÉåëáçåë
eáäÑÉå=ÑΩê=oÉÇ~âíÉìêÉ
a~ë=_~êêáÉêÉÑêÉáÜÉáí=~ìÅÜ=áã=_~ÅâÉåÇ

4. Möglichkeiten und Probleme
dìíÉ=^åë®íòÉ mêçÄäÉãÉKKK

5. qvmlP=J=Ä~êêáÉêÉÑêÉá>=
Grundlagen TYPO3 /
Barrierefreiheit

6. Kurz etwas zu TYPO3
léÉåpçìêÅÉJ`jp=~ìÑ=_~ëáë=memLjópni
ëÉÜê=ã®ÅÜíáÖ=J=ëÉÜê=ÑäÉñáÄÉä=âçåÑáÖìêáÉêÄ~ê
Öêç≈É=^åò~Üä=bêïÉáíÉêìåÖÉå=EbñíÉåëáçåëF
îáÉäÉ=îçêÖÉÑÉêíáÖíÉ=i~óçìíâçãéçåÉåíÉå
ÜçÜÉ=iÉêåâìêîÉ
EáåòïáëÅÜÉåF=îÉê~äíÉíÉ=mêçÖê~ããëíêìâíìê=EqvmlP=R>F
Öêç≈É=^åò~Üä=bêïÉáíÉêìåÖÉå=îçå=ëÉÜê=
ìåíÉêëÅÜáÉÇäáÅÜÉê=nì~äáí®í
îáÉäÉ=îçêÖÉÑÉêíáÖíÉ=i~óçìíâçãéçåÉåíÉå

8. Barrierefreiheit - Grundlagen
k~ÅÜ=ÇÉê=âçããÉåÇÉå=t`^d=O=ãΩëëÉå=ÇáÉ=fåÜ~äíÉ==
ÉáåÉê=Ä~êêáÉêÉÑêÉáÉå=tÉÄëáíÉ=
=ï~ÜêåÉÜãÄ~êI
=ÄÉÇáÉåÄ~êI
=îÉêëí®åÇäáÅÜ=ìåÇ
=êçÄìëí=
ëÉáåK

9. Wahrnehmbar
^ääÉ=fåÜ~äíÉ=ìåÇ=_ÉÇáÉåã∏ÖäáÅÜâÉáíÉå=ãΩëëÉåKKK
ÖÉëÉÜÉåI==ÖÉÜ∏êí=çÇÉê=Éêí~ëíÉí=ïÉêÇÉå=ìåÇ=
áå=áÜêÉê=_ÉÇÉìíìåÖ=îÉêëí~åÇÉå=ïÉêÇÉåK

10. Bedienbar
^ääÉ=iáåâëI=_ìííçåë=ìåÇ=ëçåëíáÖÉ=~âíáîÉå=bäÉãÉåíÉ=
ãΩëëÉå=ÄÉÇáÉåÄ~ê=ëÉáå=J=ìåÇ=òï~ê
ãáí=ÇÉê=q~ëí~íìê=~ääÉáåI
ãáí=ëÅÜäÉÅÜíÉê=^ìÖÉåJe~åÇJhççêÇáå~íáçå
~ìÑ=ÉáåÉã=ëÉÜê=âäÉáåÉå=_áäÇëÅÜáêãE~ìëëÅÜåáííF
çÜåÉ=ìåÇ=ãáíE>F=g~î~ëÅêáéí=
^ìÅÜ=ÇáÉ=oÉ~âíáçå=ÇÉë=póëíÉãë=
ãìëë=ÇáÉëÉå=^åÑçêÇÉêìåÖÉå=ÖÉåΩÖÉå

11. Verständlich
fåÜ~äíÉ=ìåÇ=cìåâíáçåÉå=ãΩëëÉå=îÉêëí®åÇäáÅÜ=ëÉáå=
KKK=~ìÅÜ=ÑΩê=jÉåëÅÜÉå=ãáí=ÉáåÖÉëÅÜê®åâíÉå=
c®ÜáÖâÉáíÉåI=pÅÜêáÑíëéê~ÅÜÉ=òì=îÉêëíÉÜÉå
EsÉêëí®åÇäáÅÜâÉáí=ëÅÜ~ÇÉí=ÖêìåÇë®íòäáÅÜ=åáÅÜíF

12. Robust
fåÜ~äíÉ=ìåÇ=cìåâíáçåÉå=ãΩëëÉåKKK
~ìÑ=ã∏ÖäáÅÜëí=îáÉäÉå=_êçïëÉê=ìåÇ=ł~ëëáëíáîÉå=
dÉê®íÉå“=EpÅêÉÉåêÉ~ÇÉêI=ÉíÅKF=ÑìåâíáçåáÉêÉå
òìâìåÑíëâçãé~íáÄÉä=ëÉáå=Epí~åÇ~êÇë>F
ł~Äï®êíëâçãé~íáÄÉä“=ÄòïK=ł~ìÑï®êíëîÉêÄÉëëÉêí“=
ëÉáå=

13. Im Detail: Die Verordnungen
tP` J=Ç~ë=dêÉãáìã
t`^d=N= J=ÇÉê=hä~ëëáâÉê
_fqs J=ÇáÉ=ÇÉìíëÅÜÉ=båíëéêÉÅÜìåÖ
t`^d=OKM J=ÇÉê=âçããÉåÇÉ=pí~åÇ~êÇ
^q^d J=ÑΩê=^ìíçêÉå
^of^ J=ÑΩê=jìäíáãÉÇá~
_fhJ_fqsqÉëí
_fbkbJhêáíÉêáÉå
=
J[=ïïïKïÉÄâê~ìíëKÇÉ
J[=ïïïKÉáåÑ~ÅÜJÑìÉêJ~ääÉKÇÉ

14. Barrierefreiheit mit TYPO3 - die Herausforderungen
pÉã~åíáëÅÜÉê=ãçÇÉêåÉê=`çÇÉ
_~êêáÉêÉÑêÉáÉ=jÉåΩë
pâ~äáÉêÄ~êâÉáí=ÇÉë=qÉñíÉë
_ÉÇáÉåÄ~êâÉáí=ãáí=ÇÉê=q~ëí~íìê
^äíÉêå~íáîíÉñíÉ=L=JáåÜ~äíÉ
_~êêáÉêÉÑêÉáÉ=cçêãìä~êÉ
bñíÉåëáçåë=E~ÄÉê=Ç~òì=ëé®íÉê=ãÉÜêF

15. Semantischer moderner Code
s~äáÇÉë=ueqji=NKM= J=âÉáåÉ=mêçÄäÉãÉ=Eáã=`çêÉF
eqji=QKMN=ëíêáÅí= J=ëÅÜïÉê=ã∏ÖäáÅÜ
sÉêïÉåÇìåÖ=ÇÉê=bñíÉåëáçå=css styled content=
Epí~åÇ~êÇF
ÖÖÑK=sÉêïÉåÇìåÖ=îçå=qáÇó=~äë=qvmlPJjçÇìä
# xHTML-Konfiguration #
page.config.doctype = xhtml_trans
page.config.xmlprologue = none
page.config.htmlTag_langKey = de-DE
page.config.xhtml_cleaning = all
qvmlp`ofmq

16. Semantischer moderner Code
qvmlp`ofmq
# entfernt die DIVs um die <hx>s #
lib.stdheader.stdWrap.dataWrap =
# address-Tag zur Liste der Tags
hinzugefügt, die nicht automatisch mit <p>-
Tags umschlossen werden #
lib.parseFunc_RTE.nonTypoTagStdWrap.
encapsLines.encapsTagList =
div,p,pre,h1,h2,h3,h4,h5,h6,address

17. Semantischer moderner Code
qvmlp`ofmq
# entfernen von class="bodytext" <p>-Tags #
lib.parseFunc_RTE.nonTypoTagStdWrap.encapsL
ines.addAttributes.P >
# entfernen der HTML-Kommentare vor
Inhaltselementen #
tt_content.text.20.prefixComment =
tt_content.stdWrap.prefixComment =
tt_content.table.20.stdWrap.prefixComment =
lib.stdheader.stdWrap.prefixComment =
tt_content.image.20.stdWrap.prefixComment =
tt_content.html.prefixComment =

18. Barrierefreie Menüs
jÉåΩë=ëáåÇ=EìåÖÉçêÇåÉíÉI=îÉêëÅÜ~ÅÜíÉäíÉF=iáëíÉåK
wìê=hÉååòÉáÅÜåìåÖ=ÇÉê=eáÉê~êÅÜáÉ=â~åå=ÉáåÉ=
aÉÑáåáíáçåëåìããÉê=ÜÉäÑÉå=J[=ÉáåÑ~ÅÜJÑìÉêJ
~ääÉKÇÉL~êíáâÉäLãÉåìÉëL
få=qóéçpÅêáéí=ïÉêÇÉå=ëçäÅÜÉ=jÉåΩë=ΩÄÉê=ÇáÉ=
lÄàÉâíÉ=ejbkr=ìåÇ=qjbkr=êÉ~äáëáÉêí

19. Barrierefreie Menüs - die Umsetzung
qvmlp`ofmq
mainnavi = HMENU
mainnavi {
wrap = <hx>Hauptnavigation</hx>|
1 = TMENU
1 {
noBlur = 1
wrap = <ul>|</ul>
NO = 1
NO.allWrap = <li>|</li>
NO.ATagTitle.field = subtitle
...

20. Barrierefreie Menüs - die Umsetzung
qvmlp`ofmq
...
# ACT: Seite in der aktuellen Sektion #
ACT = 1
ACT.allWrap = <li class="activ">|</li>
# CUR: Seite wird gerade angezeigt #
CUR = 1
CUR.doNotLinkIt = 1
CUR.wrapItemAndSub = <li
class="current"><span>|</span></li>
}
# Zweite Ebene #
2 < .1
}

21. Der Rest geht mit CSS...
łpäáÇáåÖ=aççêë“=ëçêÖÉå=ÑΩê=ëâ~äáÉêÄ~êÉ=jÉåΩë
eáåíÉêÖêìåÇÖê~ÑáâÉå=ÑΩê=Yäá[=ìåÇ=Y~[

22. Skalierbarkeit? Fehlanzeige!
§ÄÉêä~ÖÉêìåÖÉå=
~ìÑÖêìåÇ=
ÑáñÉê=_êÉáíÉå=
ÇìêÅÜ=dê~ÑáâÉå

23. Flexibel ist besser...

24. Sinnvolle Dokumentstruktur
pÉã~åíáâ=áå=ÇÉå=§ÄÉêëÅÜêáÑíÉå=YÜN[=J=YÜñ[
açâìãÉåíëíêìâíìê=ÇìêÅÜ=§ÄÉêëÅÜêáÑíÉå=ÑÉëíäÉÖÉå
pÉáíÉåâçéÑ
k~îáÖ~íáçå
fåÜ~äí
KKK
sÉêïÉåÇìåÖ=åáÅÜí=ÖÉÉáÖåÉíÉê=§ÄÉêëÅÜêáÑíÉå=ÇìêÅÜ=
oÉÇ~âíÉìêÉ=îÉêÜáåÇÉêå=EÇ~òì=ëé®íÉê=ãÉÜêF

25. Sinnvolle Dokumentstruktur - die Umsetzung
§ÄÉêëÅÜêáÑíÉåÉÄÉåÉ=YÜN[=áã=qÉãéä~íÉ
§ÄÉêëÅÜêáÑíÉåÉÄÉåÉ=YÜO[=~ìë=pÉáíÉåíáíÉä=ìåÇ=ÖÖÑK=áã=
fåÜ~äíëÉäÉãÉåí=§ÄÉêëÅÜêáÑí=
§ÄÉêëÅÜêáÑíÉåÉÄÉåÉ=YÜP[=ÑΩê=^Äë®íòÉ=áã=
fåÜ~äíëÉäÉãÉåí=qÉñí=EqÉñíL_áäÇI=KKKF
§ÄÉêëÅÜêáÑíÉåÉÄÉåÉ=YÜQ[=Äáë=YÜS[=áã=bÇáíçê
=
tÉäÅÜÉ=§ÄÉêëÅÜêáÑíÉåÉÄÉåÉ=òìê=a~êëíÉääìåÖ=ÇÉê=
píêìâíìê=J[=ïÉÄâê~ìíëKÇÉLOMMTLNOLMOL=ëíêìâíìêJîçåJ
ìÉÄÉêëÅÜêáÑíÉåL=EhçããÉåí~êÉ=äÉëÉåF
J[=ÉáåÑ~ÅÜJÑìÉêJ~ääÉKÇÉL=ÄäçÖÉáåíê~ÉÖÉKéÜé
áÇZaUNO|M|N|M|`

26. Sinnvolle Dokumentstruktur - die Umsetzung
qvmlp`ofmq
# Überschrift aus Seitentitel setzen #
content = COA
content {
10 = TEXT
10.data = page:title
10.wrap = <h2>|</h2>
20 < styles.content.get
}
# Auf Startseite Seitentitel nicht im TITLE
ausgegeben #
config.noPageTitle = 1

27. Skalierbare Dokumente durch Verwendung von em oder %
qÉãéä~íÉë=eqji=J=qóéçëÅêáéí=J=mem=J=a~íÉåÄ~åâ
pí~åÇ~êÇ=Ej~êâÉê=éÉê=e~åÇ=ëÅÜêÉáÄÉåF
^ìíçíÉãéä~íÉé~êëÉê
qÉãéä~sçáä~
js`JhçãéçåÉåíÉ=äáÄLÇáî=Ebäã~ê=eáåòF

28. Alternativtexte aus dem Medienmanagemensystem DAM
^äíÉêå~íáîíÉñíÉ=â∏ååÉå=áã=a^j=îçêÖÉÖÉÄÉå=
ïÉêÇÉå
§ÄÉêå~ÜãÉ=áå=Ç~ë=oÉÇ~âíÉìêÄ~ÅâÉåÇ=ÖÉëÅÜáÉÜí=
~ìíçã~íáëÅÜ=çÇÉê=~ìÑ=tìåëÅÜ

29. Formulare
qvmlP=ÄáÉíÉí=Éáå=fåÜ~äíëÉäÉãÉåí=òìê=bêëíÉääìåÖ=
ÉáåÑ~ÅÜÉê=cçêãìä~ê=Es~äáÇáÉêìåÖ=ìåÇ=
cÉÜäÉêãÉäÇìåÖÉå=éÉê=g~î~ëÅêáéíF
bñíÉåëáçå=accessible_form_validation
_ÉëëÉê=ÖÉÉáÖåÉí=áëí=mailform_plusI=Ç~ë=Éáå=
eqjiJqÉãéä~íÉ=ÑΩê=ÇÉå=cçêãìä~êÅçÇÉ=ìåÇ=
ëÉêîÉêëÉáíáÖÉ=s~äáÇáÉêìåÖ=EáåâäK=báåÖêáÑÑëéìåâíÉ=
ÑΩê=ÉáÖÉåÉ=oçìíáåÉåF=ÄáÉíÉí=

30. #### Typo3 Standard Mailform
tt_content.mailform.20 {
accessibility = 1
noWrapAttr=1
formName = mailform
dontMd5FieldNames = 1
REQ = 1
layout = <div>###LABEL### ###FIELD###</div>
RADIO.layout = ...
labelWrap.wrap = |
radioWrap.wrap = |
REQ.labelWrap.wrap = |
stdWrap.wrap = <fieldset> | </fieldset>
params.radio = ..
params.submit = class=“submit"
}

31. Was man nicht (mehr) braucht...
^ÅÅÉëëâÉóë=ëáåÇ=ãÉáëí=åìíòäçëI=Ç~=~ääÉ=
q~ëí~íìêâΩêòÉä=ÄÉäÉÖí=ëáåÇ=ìåÇ=çÜåÉÜáå=åáÅÜí=
ÖÉãÉêâí=ïÉêÇÉå
q~ÄáåÇÉñ=â~åå=ãÉáëí=ÉåíÑ~ääÉåI=Ç~=ëáÅÜ=ÇìêÅÜ=
ÉáåÉ=ëÉã~åíáëÅÜÉ=píêìâíìê=áKÇKoK=ÉáåÉ=ëáååîçääÉ=
péêìåÖêÉáÜÉåÑçäÖÉ=ÉêÖáÄí=
cçåíJpïáíÅÜÉê=ëáåÇ=åìíòäçëI=Ç~=~ääÉ=_êçïëÉê=áå=
em=~åÖÉäÉÖíÉ=pÅÜêáÑíÉå=îÉêÖê∏≈Éêå=â∏ååÉå=ìåÇ=
ÄÉíêçÑÑÉåÉå=kìíòÉê=çÜåÉÜáå=ÇáÉ=póëíÉãëÅÜêáÑí=ìãëíÉääÉå=
ìåÇ=áå=ÇÉå=åÉìÉëíÉå=sÉêëáçåÉå=ëçÖ~ê=łÉÅÜíÉ“=wççãJcìåâíáçåÉå=
ÑΩê=ÇÉå=ÖÉë~ãíÉå=pÉáíÉåáåÜ~äí=ÄáÉíÉåKKK

32. Was man nicht (mehr) braucht... Teil II
a~ë=qáíäÉJ^ííêáÄìí=áëí=òï~ê=çÑí=ëáååîçääI=~ÄÉê=ïç=
Éáå=iáåâíÉñí=ÄÉêÉáíë=~ìëë~ÖÉâê®ÑíáÖ=áëíI=ëçääíÉ=Éë=
ïÉÖÑ~ääÉåK=tÉåáÖ=ëáååîçää=áëí=ÉëI=áå=dê~ÑáâÉå=~äí=
ìåÇ=íáíäÉ=òì=ÇìéäáòáÉêÉåK=
qáíäÉ=áëí=~ÄÉê=~ìÅÜ=âÉáåÉ=båíëÅÜìäÇáÖìåÖ=ÑΩê=
ëáååÑêÉáÉ=iáåâíÉñíÉ=EłâäáÅâÉå=ëáÉ=ÜáÉê“F
mìåâíÉ=~ã=båÇÉ=ÇÉê=jÉåΩäáåâë=áå=iáëíÉå=
E§ÄÉêÄäÉáÄëÉä=~ìë=_fqsF

33. qvmlP=J=Ä~êêáÉêÉÑêÉá>=
Die TOP 5 der Fallen

34. Platz 5: „Tag-Suppe“ durch den grafischen Editor
aÉê=Öê~ÑáëÅÜÉ=bÇáíçê=îçå=qvmlP=Eeqji~êÉ~F=ÄáÉíÉí=
îáÉäÉ=j∏ÖäáÅÜâÉáíÉåKKK

35. Platz 5: „Tag-Suppe“ durch den grafischen Editor
hçåÑáÖìê~íáçå=ÇÉë=oqb=áå=ÇÉê=bñíÉåëáçå=çÇÉê=
áåÇáîáÇìÉää
q~ÄÉääÉå=áã=bÇáíçê=~ÄëÅÜ~äíÉå=J=Ç~òì=ÖáÄí=Éë=Ç~ë=
bäÉãÉåí=q~ÄÉääÉ>
póãÄçäÉ=ìåÇ=qáíäÉJqÉñíÉ=ÑΩê=iáåâë

36. Platz 4: Menüs mit Javascript / grafische Menüs
aóå~ãáëÅÜÉ=jÉåΩë=ãáí=g~î~ëÅêáéí=â∏ååÉå=
Ä~êêáÉêÉÑêÉá=ëÉáå=EïÉåå=ëáÉ=~Äï®êíëâçãé~íáÄÉä=ëáåÇF
dê~ÑáëÅÜÉ=jÉåΩë=ëáåÇ=ÖêìåÇë®íòäáÅÜ=ÉáåÖÉëÅÜê®åâí=
òìÖ®åÖäáÅÜ=J=Ç~=åáÅÜí=ÉáåÑ~ÅÜ=ëâ~äáÉêÄ~ê
aáÉ=pí~åÇ~êÇÑìåâíáçåÉå=îçå=qvmlP=
GMENU_LAYERSI=IMGMENUI=GMENU_FOLDOUT=ìåÇ=
JSMENU=ëáåÇ=îÉê~äíÉí=ìåÇ=åáÅÜí=ÖÉÉáÖåÉíI=
òìÖ®åÖäáÅÜÉ=jÉåΩë=òì=ÉêòÉìÖÉå

37. Platz 4: Menüs mit Javascript / grafische Menüs
jÉåΩë=E~ìÅÜ=Öê~ÑáëÅÜ=~åëéêÉÅÜÉåÇÉF=â∏ååÉå=ãáí=
qÉñí=ìåÇ=`pp=ÉêòÉìÖí=ïÉêÇÉå=J=ÉáåÉ=ëáãéäÉ=iáëíÉ=
áëí=ÖÉåìÖ
a~ë=ÄÉå∏íáÖíÉ=qóéçëÅêáéíJlÄàÉâí=áëí=TMENU
aìêÅÜ=ÇáÉ=sÉêïÉåÇìåÖ=îçå=êÉáåÉå=iáëíÉå=
îÉêÄÉëëÉêí=ëáÅÜ=~ìÅÜ=ÇáÉ=táÉÇÉêîÉêïÉåÇÄ~êâÉáí=
ÇÉë=`çÇÉë

38. Platz 3: Unkritische Verwendung von Extensions
sáÉäÉ=bñíÉåëáçåë=äáÉÑÉêå=îçå=e~ìëÉ=~ìë=âÉáåÉå=
Ä~êêáÉêÉÑêÉáÉå=eqjiJ`çÇÉ=ãáí
=
ÉåíïÉÇÉê=áå=cçêã=îçå=eqji=áã=memJ`çÇÉ=çÇÉê=~äë=
qÉãéä~íÉë=EÇ~ë=áëí=ëÅÜçå=ÄÉëëÉêF
hêáíÉêáÉå=òìê=nì~äáí®í=îçå=bñíÉåëáçåëW
pí~íìë=L=sÉêëáçåëåìããÉê
^åò~Üä=ÇÉê=açïåäç~Çë
_ÉïÉêíìåÖÉå=LpÉÅìêáíó=oÉîáÉïë
a~íìã=ÇÉê=äÉíòíÉå=^âíì~äáëáÉêìåÖ

39. Platz 2: Indexsuche mit Javascript-Navigation
aáÉ=fåÇÉñëìÅÜÉ=Eindexed_searchF=ÄáÉíÉí=
ã®ÅÜíáÖÉ=pìÅÜã∏ÖäáÅÜâÉáíÉå=E~ìÅÜ=áå=a~íÉáÉå=
ìåÇ=ÉñíÉêåÉå=tÉÄëáíÉëF
eqji=ΩÄÉê=qÉãéä~íÉ=ìåÇ=qóéçëÅêáéí=ëíÉìÉêÄ~ê
k~îáÖ~íáçå=òïáëÅÜÉå=pÉáíÉå=ãáí=pìÅÜÉêÖÉÄåáëëÉå=
ÉêÑçäÖí=ΩÄÉê=g~î~ëÅêáéí

40. Platz 2: Indexsuche mit Javascript-Navigation

41. Platz 2: Indexsuche (jetzt nicht mehr) mit Javascript-Navigation
báåÄáåÇìåÖ=ÇÉê=bñíÉåëáçå=
accessible_is_browse_results
ÉêëÉíòí=g~î~ëÅêáéíJk~îáÖ~íáçå=ÇìêÅÜ=åçêã~äÉ=
iáåâë

42. Platz 1: Versteckter Focus
pí~åÇ~êÇáåëí~ää~íáçå=äáÉÑÉêí=g~î~ëÅêáéíI=Ç~ëë=ÇÉå=
cçÅìë=EÖÉëíêáÅÜÉäíÉ=iáåáÉF=ÄÉá=iáåâë=îÉêëíÉÅâí
báå=ëáÅÜíÄ~êÉê=cçâìë=áëí=ìåîÉêòáÅÜíÄ~ê=ÑΩê=ÉáåÉ=
Ä~êêáÉêÉÑêÉáÉ=tÉÄëáíÉ=
J[=ïïïKÉáåÑ~ÅÜJÑìÉêJ~ääÉKÇÉL~êíáâÉäLí~ëí~íìêÑçâìëL
_ÉëëÉê=~äë=ÇÉê=pí~åÇ~êÇÑçâìë=áëí=ΩÄêáÖÉåë=ÉáåÉ=
ÇÉìíäáÅÜÉêÉ=hÉååòÉáÅÜåìåÖ

44. Platz 1: Versteckter Focus
båíÑÉêåÉå=ÇÉë=łcçâìë=ÉåíÑÉêåÉå“Jg~î~ëÅêáéíëW=
fã=e~ìéííÉãéä~íÉ
qvmlp`ofmq
page.config.removeDefaultJS = 1
ëÅÜ~äíÉí=Ç~ë=g~î~ëÅêáéí=áã=pÉáíÉåâçéÑ=~ìë
ìåÇ=áå=ÇÉå=aÉÑáåáíáçåÉå=ÑΩê=qjbkrW
noblur = 1
ÉåíÑÉêåí=ÇáÉ=^ìÑêìÑÉ

45. qvmlP=J=Ä~êêáÉêÉÑêÉá>=
Hilfen für Redakteure

46. Hilfen für Redakteure
sçêÖ~ÄÉå=òìê=sÉêïÉåÇìåÖ=îçå=§ÄÉêëÅÜêáÑíÉå
^ìëÄäÉåÇÉå=åáÅÜí=ÄÉå∏íáÖíÉê=bäÉãÉåíÉ
hçåÑáÖìê~íáçå=ÇÉë=bÇáíçêë=oqb
^ìëòÉáÅÜåìåÖ=îçå=^ÄâΩêòìåÖÉå=ìåÇ=
péê~ÅÜïÉÅÜëÉäå
E_~êêáÉêÉÑêÉáÜÉáíëJF`ÜÉÅâ=áã=_~ÅâÉåÇ

47. Vorgaben zur Verwendung von Überschriften
YÜN[I=YÜO[=ïÉêÇÉå=áã=qÉãéä~íÉ=ÖÉëÉíòí
YÜP[=~äë=pí~åÇ~êÇΩÄÉêëÅÜêáÑí=ÑΩê=fåÜ~äíëÉäÉãÉåíÉ=
qvmlp`ofmq=`lkpq^kqp
content.defaultHeaderType = 3
fã=oqb=ïÉêÇÉå=YÜN[=J=YÜP[=~ìëÖÉÄäÉåÇÉíW
m~ÖÉqp=rëÉêqp
RTE.default {
proc {
hidePStyleItems = H1,H2,H3
}
}

48. Vorgaben zur Verwendung von Überschriften II
cΩê=Ç~ë=fåÜ~äíëÉäÉãÉåí=§ÄÉêëÅÜêáÑí=â~åå=<h2>=
ïáÉÇÉê=~âíáîáÉêí=ïÉêÇÉåW
qvmlp`ofmq
headlines = COA
headlines {
10 = TEXT
10 {
field = header
wrap = <h2>|</h2>
if {
value.field = CType
equals = header
}
}
...

49. ...
20 = COA
20 {
10 < tt_content
stdWrap.if {
value.field = CType
equals = header
negate = 1
}
}
}
page.20 = COA
page.20 {
10 < styles.content.get
10 {
renderObj < temp.headlines
}
} «=p~ëÅÜ~=sçêÄÉÅâ

50. Ausblenden nicht benötigter Elemente
a~ë=qvmlPJ_~ÅâÉåÇ=â~åå=à~=ã~åÅÜã~ä=Ö~åò=
ëÅÜ∏å=îçää=ïÉêÇÉåKKK

51. Ausblenden nicht benötigter Elemente (Redakteurs-Sicht)

52. RTE konfigurieren: nochmal zur Abschreckung...

53. Konfiguration des grafischen Editors
m~ÖÉqp rëÉêqp
# RTE-Buttons: #
RTE.default.showButtons = formatblock, bold,
italic, subscript, superscript, orderedlist,
unorderedlist, insertcharacter, link,
acronym, chMode
RTE.classesAnchor {
externalLink {
class = extlink
type = url
titleText = ...
}
externalLinkInNewWindow { ... }
...

54. Konfiguration des grafischen Editors II
m~ÖÉqp rëÉêqp
...
internalLink {
class >
type = page
titleText >
}
internalLinkInNewWindow {... }
download {
type = file
}
mail {
type = mail
}
}

55. Konfiguration des grafischen Editors III
m~ÖÉqp rëÉêqp
RTE.default {
proc.dontConvBRtoParagraph = 1
proc.allowedClasses ( ... )
hidePStyleItems = H1, H2, H3, PRE
contentCSS = rte.css
# Zusatzklassen für P einbauen
classesParagraph := addToList(wichtig)
# Klassen bei Transformation erlauben
proc.allowedClasses := addToList(wichtig)
}
RTE.classes.wichtig {
name = wichtig
value = ... ;
}

56. Auszeichnung von Abkürzungen und Sprachwechseln
bñíÉåëáçåë=Éêä~ìÄÉå=Ç~ë=báåÑΩÖÉå=îçå=
^ÄâΩêòìåÖÉå=áã=_~ÅâÉåÇI=ÇáÉ=~ìíçã~íáëÅÜ=áã=
cêçåíÉåÇ=ÉêëÉíòí=ïÉêÇÉå
_Éá=_ÉÇ~êÑ=ïáêÇ=~ìíçã~íáëÅÜ=Éáå=däçëë~ê=ÉêòÉìÖí
få=wïÉáÑÉäëÑ®ääÉå=ãΩëëÉå=^ìëòÉáÅÜåìåÖÉå=éÉê=
e~åÇ=~ìëÖÉÑΩÜêí=ïÉêÇÉå
sb_akronymmanager
a21_glossary

58. qvmlP=J=Ä~êêáÉêÉÑêÉá>=
Nützliche Extensions

59. tt_news qvmlPJkÉïëëóëíÉã
indexed_search/ fåÇÉñëìÅÜÉ
accessible_is_browse_results
mailformplus cçêãìä~êÉ
css_filelinks a~íÉáäáëíÉå
sb_acronymmanager, ^ìëòÉáÅÜåìåÖÉå
a21_glossary
sf_validator s~äáÇáÉêìåÖ

60. cron_accessiblemenus jÉåΩçéíáçåÉå
accessible_form_validation s~äáÇáÉêìåÖ=çÜåÉ=
g~î~ëÅêáéí
fb_accessiblecontent- aáîÉêëÉ
attributes báåëíÉääìåÖÉå
aw_antispambots `^mq`e^>
gov_accessibility hçãéäÉííÄÉáëéáÉä
EÉíï~ë=®äíÉêF
Abcsstidy qáÇó
oblady_accessibility_report

61. qvmlP=J=Ä~êêáÉêÉÑêÉá>=
Barrierefreiheit im Backend

62. Barrierefreiheit im Backend
t~êìã
oÉÇ~âíÉìêÉ=ãáí=_ÉÜáåÇÉêìåÖÉå
t~ë=ÑÉÜäí
pÉã~åíáëÅÜÉë=eqji
sÉêòáÅÜí=~ìÑ=cê~ãÉë
^ìëêÉáÅÜÉåÇÉ=hçåíê~ëíÉ
§ÄÉêëÅÜ~ìÄ~êâÉáí
táÉ=ÖÉÜíÛë
cÉÜäÉê=ÇÉë=îçêÜ~åÇÉåÉå=_~ÅâÉåÇ=~ìëê®ìãÉå
kÉìÉë=_~ÅâÉåÇ=Ä~ìÉå

63. Fehler im „normalen“ Backend beseitigen
kìê=áå=^åë®íòÉå=ã∏ÖäáÅÜ
cê~ãÉëíêìâíìê=êÉÇìòáÉêÉå
hçåíê~ëí=ÉêÜ∏ÜÉå
káÅÜí=ÄÉå∏íáÖíÉ=bäÉãÉåíÉ=~ìëÄäÉåÇÉå
eqji
oÉëíÑê~ãÉë
oÉëíJhçãéäÉñáí®í=

64. Backend neu bauen
wìÖêáÑÑ=~ìÑ=qvmlPJq~ÄÉääÉå=ìåÇ=cìåâíáçåÉå=ÇÉë=
_~ÅâÉåÇë=ΩÄÉê=Ç~ë=cêçåíÉåÇ
hçãé~íáÄáäáí®í=îçå=łåçêã~äÉã“=ìåÇ=
Ä~êêáÉêÉÑêÉáÉã=_~ÅâÉåÇ
sçêíÉáäW=ÑêÉáÉ=dÉëí~äíÄ~êâÉáí=ÇÉë=fåíÉêÑ~ÅÉë=Eléíáâ=
ìåÇ=eqjiF
k~ÅÜíÉáäW=~ääÉ=cìåâíáçåÉå=ãΩëëÉå=Éñéäáòáí=
ÉåíïáÅâÉäí=ïÉêÇÉå

65. Die Website des DBSV
_~êêáÉêÉÑêÉáÜÉáí=áã=cêçåíÉåÇ
_~êêáÉêÉÑêÉáÉ=báåÖ~ÄÉã∏ÖäáÅÜâÉáí=ÑΩê=ÄäáåÇÉ=ìåÇ=
ëÉÜÄÉÜáåÇÉêíÉ=oÉÇ~âíÉìêÉ=ÑΩê
eqjiI=qÉñíI=qÉñí=ãáí=_áäÇ
kÉïë
^åäÉÖÉå=îçå=cbJkìíòÉêå
eçÅÜä~ÇÉå=îçå=_áäÇÉêå=

72. §ÄÉêëÅÜêáÑíÉå
# Header 1 #
## Header 2 ##
###### Header 6 ######
råëçêíáÉêíÉ=iáëíÉ
* Listenpunkt 1
* Listenpunkt 2
pçêíáÉêíÉ=iáëíÉ
+ Listenpunkt 1
+ Listenpunkt 2
tçêíÑçêã~íáÉêìåÖÉå
Dieser Satz **enthält fette Worte**.
Dieser Satz *enthält kursive Worte*.
iáåâë
[linktext](linkadresse "link title")

73. Barrierefreies Backend ist eigentlich ein Frontendplugin

74. Frontend-User mit Backendrechten

75. Kai Laborenz
dÉëÅÜ®ÑíëÑΩÜêÉê=ÇÉê=pìåÄÉ~ã=dãÄe
_ÉêäáåÉê=^ÖÉåíìê=ÑΩê=hçããìåáâ~íáçå
E_~êêáÉêÉÑêÉáÉF=tÉÄÉåíïáÅâäìåÖ
aÉëáÖåI=ãçÇÉêåÉë=eqji=C=`ppI=pçÑíï~êÉÉåíïáÅâäìåÖ
péÉòá~äáí®íW=qvmlP=E`çåíÉåíJj~å~ÖÉãÉåíëóëíÉãF
^ìëëÉêÇÉã=âä~ëëáëÅÜÉ=mo=ìåÇ=hçããìåáâ~íáçëÇÉëáÖå

76. ä~ÄçêÉåò]ëìåÄÉ~ãJÄÉêäáåKÇÉ====
ïïïKëìåÄÉ~ãJÄÉêäáåKÇÉLããíMU