mit spaß und teamwork zur goldenen biene
DESCRIPTION
Von einem Stammtisch, der auszog eine BIENE zu gewinnenTRANSCRIPT
Mit Spaß & Teamwork zur goldenen BIENE
Eric Eggert und Sandra Kallmeyeroutlinewebdesign.com
Von einem Stammtisch, der auszog eine BIENE zu gewinnen
Mittwoch, 1. Juni 2011
Was ist die BIENE?
Barrierefreies Internet eröffnet neue Einsichten
Mittwoch, 1. Juni 2011
Mittwoch, 1. Juni 2011
Mittwoch, 1. Juni 2011
Mittwoch, 1. Juni 2011
Was ist der BPSE?
Best Practices Stammtisch Essenseit 2009
Mittwoch, 1. Juni 2011
Mittwoch, 1. Juni 2011
Mittwoch, 1. Juni 2011
Mittwoch, 1. Juni 2011
Mittwoch, 1. Juni 2011
Mittwoch, 1. Juni 2011
Mittwoch, 1. Juni 2011
Im Unperfekthaus
Mittwoch, 1. Juni 2011
Mittwoch, 1. Juni 2011
Mittwoch, 1. Juni 2011
Mittwoch, 1. Juni 2011
Mittwoch, 1. Juni 2011
Mittwoch, 1. Juni 2011
Mittwoch, 1. Juni 2011
• Workflow & Projektmanagement
• Kommunikation (mit Kollegen und Kunden)
• Aktuelle Webtechniken
• UX & UI
• Barrierefreiheit
Best Practices?
Mittwoch, 1. Juni 2011
BIENE 2009
• Interesse: Wie läuft so eine Preisverleihung ab?
• Diskussion: Wie kommen die Preisträger zustande? Für uns waren die Entscheidungen teilweise schwer nachvollziehbar.
Mittwoch, 1. Juni 2011
„Reicht doch selber mal
was ein!“
— Tomas Caspers
Mittwoch, 1. Juni 2011
Mittwoch, 1. Juni 2011
Mittwoch, 1. Juni 2011
Warum die Stiftung?• Bereits Kunde von
Klaudia & Oliver
• Barrierefreie Basis vonSandra
• Kunde lässt uns freie Hand
• Non-Profit
Klaudia Oliver
Mittwoch, 1. Juni 2011
Klaudia & Oliver• Bereits Kunde von
Klaudia & Oliver
• Barrierefreie Basis
• Kunde lässt uns freie Hand
• Non-ProfitKlaudia Oliver
Mittwoch, 1. Juni 2011
Warum so ein Projekt?• Aufgabe für den Stammtisch
• Spezialgebiete
• Gegenseitiges Lernen und Verstehen
• Externe Beurteilung der eigenen Leistung
Mittwoch, 1. Juni 2011
Mut
http://www.flickr.com/photos/5mal5/393077325/
Mittwoch, 1. Juni 2011
„Grundlage […] sind u.a. die BITV sowie weitere international anerkannte Richtlinien wie z.B. die WCAG2. Preiswürdig […] sind Angebote, die die Wettbewerbskriterien erfüllen und darüber hinaus innovative und kreative Lösungen bieten.“
BIENE, biene-wettbewerb.de
Mittwoch, 1. Juni 2011
Mut…• sich dem Wettbewerb zu stellen
• scheitern zu können
• Verantwortung abzugeben
• Vertrauen zu haben
• Kompetenzen anzuerkennen
Mittwoch, 1. Juni 2011
Herausforderung BIENE
• Das Team muss das Ziel Barrierefreiheit ständig vor Augen haben
• Prüfkriterien gehen über WCAG2 hinaus
• Vorauswahl und Feintests durch behinderte Nutzer
• Jury ohne Vorkenntnisse zum Thema Barrierefreiheit vergibt letztendlich Preise
Mittwoch, 1. Juni 2011
Fleiß
http://www.flickr.com/photos/botheredbybees/245215850
Mittwoch, 1. Juni 2011
Team-Organisation
• Arbeitsteilung
• Alle 2 Wochen: Treffen des BPSE
• Dazwischen:
+ = Q
W
E
RT
Y
U
I
O
P
{
}
q
w
Webstandards-Magazin 06/2010
Mittwoch, 1. Juni 2011
Content
• Inhalte waren vorhanden, mussten aber überarbeitet werden
• Neu: „Kurz & gut“
• Leichte Sprache angestrebt
• Auch hilfreich für flüchtiges Lesen
Mittwoch, 1. Juni 2011
…das Stiefkind der Barrierefreiheit
(Gute) Alternativ-Texte
Max
Mittwoch, 1. Juni 2011
Alternativ-Texte
Maxx
Mittwoch, 1. Juni 2011
„karger Spielplatz vor dem Umbau“
Mittwoch, 1. Juni 2011
„Beine eines hüpfenden Kindes, barfuß auf einem mit kleinen Bällen bedeckten Trampolin“
Mittwoch, 1. Juni 2011
Design & Layout
• Gemeinsame Ideenfindung
• Ausfeilen des bisherigen Layouts
• Spendenbutton
• Fluide Grids
DoroSandra
Mittwoch, 1. Juni 2011
Design & Layout
• Gemeinsame Ideenfindung
• Ausfeilen des bisherigen Layouts
• Spendenbutton
DoroSandra
Mittwoch, 1. Juni 2011
Mittwoch, 1. Juni 2011
HTML
• Neue HTML5-Elemente (article, section, nav, aside)
• Microformats (hCard)
• Versteckte Überschriften (Fallback für ARIA Landmark Roles)
• Komplett verlinkte Teaser
• Keyboard-Navigation
Sandra Eric
Mittwoch, 1. Juni 2011
CSS
• Hover/Focus
• Selektoren
• ::before und ::after
• Rounded corners
Mittwoch, 1. Juni 2011
Moderne Webtechniken:HTML
• Neue HTML5-Elemente (article, section, nav, aside)
• Microformats (hCard)
• Zusätzlich versteckte Überschriften
• Komplett verlinkte Teaser
• Keyboard-Navigation
Sandra Eric
Mittwoch, 1. Juni 2011
• Agentur
• Spezialgebiet: Barrierefreiheit
• Aktuelle Webtechniken
• Kunden: Bildung und KMU
Mittwoch, 1. Juni 2011
WAI-ARIA
• Landmark roles (auf HTML5-Elementen)
• Autocomplete-Suche
• Spendenformular
Mittwoch, 1. Juni 2011
WAI-ARIA
• Landmark roles (auf HTML5-Elementen)
• Autocomplete-Suche
• Spendenformular
Mittwoch, 1. Juni 2011
WAI-ARIA• Landmark roles
(auf HTML5-Elementen)
• Autocomplete-Suche
• Spendenformular
Maik Marco
Mittwoch, 1. Juni 2011
<header role="banner"> <h1><a href="//">Stiftung Lebenshilfe Duisburg e.V.</a> <span>für Menschen mit<br />geistiger Behinderung</span></h1> <form id="suche" action="//" method="get" role="search"> <div> <label for="suchen">Suche</label> <input name="keywords" id="suchen" class="suggest" type="text" value="" /> <input type="submit" value="Suchen" /> </div> </form></header><div id="wrapper"> <nav role="navigation"> <h1 id="navigation">Navigation</h1> <ul> (…) </ul> </nav> <section id="content" role="main">
Mittwoch, 1. Juni 2011
JavaScript
• JavaScript-Animationen mit jQuery
• Autocomplete-Suche
• Formular
Mittwoch, 1. Juni 2011
Barrierefreiheit fängt im Backend an
• CMS: on-page.de
• Entwickelt von Oliver
• Der HTML-Code muss wie angeliefert vom CMS generiert werden
Mittwoch, 1. Juni 2011
Barrierefreiheit fängt im Backend an
• CMS: on-page.de
• Entwickelt von Oliver
• Der generierte HTML-Code muss wie angeliefert vom CMS ausgegeben werden
Mittwoch, 1. Juni 2011
Mittwoch, 1. Juni 2011
KampfgeistMittwoch, 1. Juni 2011
Kampfgeist?
• Standpunkte diskutieren! Barrierefreiheit ist nicht immer eindeutig bestimmbar.
• Durchhalten! Tagesgeschäft muss weiterlaufen.
• Regeländerung! Nur noch interaktive Websites zugelassen.
Mittwoch, 1. Juni 2011
„Die Seite ist nicht nur technisch hervorragend umgesetzt, sondern war auch eine der Lieblingsseiten der Jury. Schön, intuitiv bedienbar und bis in die Details liebevoll gestaltet. […] Für den gelungenen Webauftritt der Stiftung Lebenshilfe Duisburg nehmen die Stammtischler heute Abend eine BIENE in Gold mit nach Hause. Gut gemacht.“
Robert Stulle, edenspiekermann.de
Mittwoch, 1. Juni 2011
Mittwoch, 1. Juni 2011
Mittwoch, 1. Juni 2011
Mittwoch, 1. Juni 2011
Mittwoch, 1. Juni 2011
Mittwoch, 1. Juni 2011
Mittwoch, 1. Juni 2011
Ende.
@ScreenOrigami & @yatil
Mittwoch, 1. Juni 2011