Mit Spaß und Teamwork zur goldenen BIENE

Mit Spaß & Teamwork zur goldenen BIENE Von einem Stammtisch, der auszog eine BIENE zu gewinnen Eric Eggert und Sandra Kallmeyer outlinewebdesign.comMittwoch, 1. Juni 2011

Was ist die BIENE? Barrierefreies Internet eröﬀnet neue EinsichtenMittwoch, 1. Juni 2011

Mittwoch, 1. Juni 2011

Was ist der BPSE? Best Practices Stammtisch Essen seit 2009Mittwoch, 1. Juni 2011

Im UnperfekthausMittwoch, 1. Juni 2011

Best Practices? • Workﬂow & Projektmanagement • Kommunikation (mit Kollegen und Kunden) • Aktuelle Webtechniken • UX & UI • BarrierefreiheitMittwoch, 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 CaspersMittwoch, 1. Juni 2011

Warum die Stiftung? • Bereits Kunde von Klaudia & Oliver • Barrierefreie Basis von Sandra • Kunde lässt uns freie Hand Klaudia Oliver • Non-ProﬁtMittwoch, 1. Juni 2011

Klaudia & Oliver • Bereits Kunde von Klaudia & Oliver • Barrierefreie Basis • Kunde lässt uns freie Hand • Non-Proﬁt Klaudia OliverMittwoch, 1. Juni 2011

Warum so ein Projekt? • Aufgabe für den Stammtisch • Spezialgebiete • Gegenseitiges Lernen und Verstehen • Externe Beurteilung der eigenen LeistungMittwoch, 1. Juni 2011

http://www.ﬂickr.com/photos/5mal5/393077325/MutMittwoch, 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.deMittwoch, 1. Juni 2011

Mut… • sich dem Wettbewerb zu stellen • scheitern zu können • Verantwortung abzugeben • Vertrauen zu haben • Kompetenzen anzuerkennenMittwoch, 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 PreiseMittwoch, 1. Juni 2011

http://www.ﬂickr.com/photos/botheredbybees/245215850 FleißMittwoch, 1. Juni 2011

Team-Organisation • Arbeitsteilung • Alle 2 Wochen: Treﬀen des BPSE • Dazwischen: + = U q I O P Q W { } E w R T Y Webstandards-Magazin 06/2010Mittwoch, 1. Juni 2011

Content • Inhalte waren vorhanden, mussten aber überarbeitet werden • Neu: „Kurz & gut“ • Leichte Sprache angestrebt • Auch hilfreich für ﬂüchtiges LesenMittwoch, 1. Juni 2011

(Gute) Alternativ-Texte …das Stiefkind der Barrierefreiheit MaxMittwoch, 1. Juni 2011

Alternativ-Texte MaxxMittwoch, 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 Ideenﬁndung • Ausfeilen des bisherigen Layouts • Spendenbutton • Fluide Grids Sandra DoroMittwoch, 1. Juni 2011

Design & Layout • Gemeinsame Ideenﬁndung • Ausfeilen des bisherigen Layouts • Spendenbutton Sandra DoroMittwoch, 1. Juni 2011

HTML • Neue HTML5-Elemente (article, section, nav, aside) • Microformats (hCard) • Versteckte Überschriften (Fallback für ARIA Landmark Roles) Sandra Eric • Komplett verlinkte Teaser • Keyboard-NavigationMittwoch, 1. Juni 2011

CSS • Hover/Focus • Selektoren • ::before und ::after • Rounded cornersMittwoch, 1. Juni 2011

Moderne Webtechniken: HTML • Neue HTML5-Elemente (article, section, nav, aside) • Microformats (hCard) • Zusätzlich versteckte Überschriften • Komplett verlinkte Teaser Sandra Eric • Keyboard-NavigationMittwoch, 1. Juni 2011

• Agentur • Spezialgebiet: Barrierefreiheit • Aktuelle Webtechniken • Kunden: Bildung und KMUMittwoch, 1. Juni 2011

WAI-ARIA • Landmark roles (auf HTML5-Elementen) • Autocomplete-Suche • SpendenformularMittwoch, 1. Juni 2011

WAI-ARIA • Landmark roles (auf HTML5-Elementen) • Autocomplete-Suche • Spendenformular Maik MarcoMittwoch, 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 • FormularMittwoch, 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 werdenMittwoch, 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 werdenMittwoch, 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.deMittwoch, 1. Juni 2011

Ende. @ScreenOrigami & @yatilMittwoch, 1. Juni 2011

Mit Spaß und Teamwork zur goldenen BIENE

by Sandra Kallmeyer on Jun 02, 2011

Accessibility

Categories

Tags

Upload Details

Usage Rights

Statistics

Mit Spaß und Teamwork zur goldenen BIENE — Presentation Transcript