DRUPAL FÜR FORTGESCHRITTENE
Fortgeschrittenenschulung – weiterführendes Arbeiten mit Drupal
Alexander Winterstein
INHALTE
Barrierefreiheit / SEO
Inhaltstypen
Mehrsprachigkeit
Weitere Funktionen
Übungen
Alexander Winterstein
BARRIEREFREIHEIT
„Barrierefreies Webdesign ist die Kunst, Webseiten so zu gestalten, dass jeder sie nutzen und lesen kann.“
Quelle: http://www.barrierefreies-webdesign.de/
Alexander Winterstein
BARRIEREARMES INTERNET . Schneller und unkomplizierter Zugriff . Zugänglichkeit für Menschen mit und ohne Behinderungen sowie Webcrawlern . Prinzipien: . Wahrnehmbarkeit . Verständlichkeit der Inhalte . Bedienbarkeit . Navigation der Website
Alexander Winterstein
BITV 2.0 = Barrierefreie-Informationstechnik-Verordnung
. Verordnung zur Schaffung barrierefreier Informationstechnik nach dem Behindertengleichstellungsgesetz
. Ergänzung des Behindertengleichstellungsgesetzes (BGG)
Zugang für behinderte Menschen (im Sinne des § 3 des Behindertengleichstellungs- gesetzes) ermöglichen/erleichtern
Gilt für alle Internetauftritte der Bundesverwaltung
Alexander Winterstein
BITV 2.0 . Sachsen ist BITV-freie Zone Gesetz zur Verbesserung der Integration von Menschen mit Behinderungen im Freistaat Sachsen (Sächsisches Integrationsgesetz – SächsIntegrG), gültig ab 2005.
§ 7 Barrierefreie Informationstechnik Die Behörden und sonstigen öffentlichen Stellen des Freistaates Sachsen gestalten ihre Internetauftritte und - angebote sowie die von ihnen zur Verfügung gestellten graphischen Programmoberflächen, die mit Mitteln der Informationstechnik dargestellt werden, schrittweise technisch so, dass sie auch von Menschen mit Behinderungen grundsätzlich uneingeschränkt genutzt werden können.
Alexander Winterstein
ÜBERSCHRIFTEN . BITV Bedingung 2.4.6 Beschreibungen
. Überschriften und Label (Beschriftungen) kennzeichnen das Thema oder den Zweck. . BITV Bedingung 2.4.10 Abschnittsüberschriften
. Es sind Abschnittsüberschriften zu verwenden, die den Inhalt weiter strukturieren. . HTML-Beispiel:
Überschrift der Größe 2
Überschrift der Größe 3
Alexander Winterstein
LISTEN . Anlage 2 der BITV 2.0, Teil 2
. Inhalte sind durch Absätze und Überschriften logisch zu strukturieren. Aufzählungen mit mehr als drei Punkten sind durch Listen zu gliedern.
. HTML-Beispiel: ungeordnete Liste
- Ein Aufzählungspunkt
- Noch ein Aufzählungpunkt
- Aller guten Dinge sind drei
Alexander Winterstein
TABELLEN . BITV Bedingung 1.3.2 Aussagekräftige Reihenfolge
. Wenn die Reihenfolge, in der der Inhalt präsentiert wird, Auswirkungen auf dessen Bedeutung hat, ist die richtige Lese-Reihenfolge durch Programme erkennbar.
. BITV Bedingung 1.3.3 Sensorische Merkmale
. Anweisungen zum Verständnis und zur Nutzung des Inhalts stützen sich nicht ausschließlich auf sensorische Merkmale der Elemente wie z. B. Form, Größe, visuelle Platzierung, Orientierung oder Ton.
Alexander Winterstein
TABELLEN . HTML-Beispiel: Spaltenüberschrift 1 Spaltenüberschrift 2
| Spaltenüberschrift 1 | Spaltenüberschrift 2 |
|---|---|
| Tabelleninhalt in Spalte 1 | Tabelleninhalt in Spalte 2 |
Alexander Winterstein
BILDER . BITV Bedingung 1.1.1 Nicht-Text-Inhalte
. Für jeden Nicht-Text-Inhalt, der dem Nutzer oder der Nutzerin präsentiert wird, ist eine Text-Alternative bereitzustellen, die den Zweck dieses Inhalts erfüllt.
. BITV Bedingung 1.4.9 Schriftgrafiken
. Schriftgrafiken werden ausschließlich zur Dekoration verwendet oder in Fällen, in denen eine bestimmte Textpräsentation eine wesentliche Voraussetzung für die Vermittlung der Informationen ist.
Alexander Winterstein
BILDER . HTML-Beispiel: Brailledisplay
Alexander Winterstein
LINKS . BITV Bedingung 2.4.9 Zweck eines Links
. Ziel und Zweck eines Links sind aus dem Linktext selbst ersichtlich.
. HTML-Beispiel:
Alexander Winterstein
SCREENREADER . Bildschirmleseprogramm für Blinde und Sehbehinderte Brailledisplay
. Zwei Arten:
. Akustisch [Lautsprecher]
. Taktil [Braillezeile]
Quelle: . Synthetische Sprache wirkt http://upload.wikimedia.org/wikipedia/commons/0/06/R monoton efreshable_Braille_display.jpg
Alexander Winterstein
SCREENREADER: FUNKTIONSWEISE . Alle dargestellten Elemente werden ausgegeben
. Menüs, Auswahlboxen, Überschriften, Hervorhebungen…
. Elemente werden interpretiert und sprachlich ausgegeben
. Z.B.
. Navigation zwischen Überschriften mittels H-Taste möglich
. Navigation zwischen Blöcken mittels Tab-Taste möglich
Alexander Winterstein
SCREENREADER: TABELLEN . Tabellen werden von links nach rechts und von oben nach unten gelesen; kein Hinweis beim Zeilenwechsel
Name Funktion Max Mustermann Otto Normalverbraucher Erika Mustermann Personalausweisbeauftragte Maria Musterfrau Führerscheinbeauftragte
(Überschrift 2) Name
Alexander Winterstein
SCREENREADER: VORLESEBEISPIEL
Screenshot von: http://de.wikipedia.org/wiki/Braillezeile
Alexander Winterstein Die Braillezeile, kurz Zeile, oder Brailledisplay ist ein Computer-Ausgabegerät für blinde Menschen, das Zeichen in Brailleschrift darstellt. Üblicherweise werden sie durch Screenreader angesteuert, die Zeichen in ausgewählten Bildschirmbereichen auslesen und in Computerbraille darstellen. Dadurch können Blinde große Teile der Standardsoftware benutzen und selbständig am Computer arbeiten. […]Braillzeile
SCREENREADER: VORLESEBEISPIEL
Alexander Winterstein
FRAGEN ZUR BARRIEREFREIHEIT? . Barrierearmes Internet
. BITV 2.0
. HTML-Elemente
. Screenreader
Alexander Winterstein
SUCHMASCHINENOPTIMIERUNG (SEO) . Optimierung des Seiteninhalts
. Formatierungen, Überschriften etc.
. Landing-Pages für Suchmaschinen optimiert
. Landing-Page stellt Angebot vor
. SEO-Landing-Page optimiert, um bestimmte Keywords ranken zu lassen
Alexander Winterstein
RANKINGFAKTOREN . Google-Ranking beinhaltet über 200 verschiedene Faktoren
1. Domain/Adresse: sollte Keyword enthalten
2. Seitentitel: aussagekräftig, sollte ebenfalls Keyword enthalten
3. Überschriften: klare, saubere Struktur auf Webseite, hierarchische Verwendung, Keywords
Alexander Winterstein
RANKINGFAKTOREN . Google-Ranking beinhaltet über 200 verschiedene Faktoren
4. Page-Speed: schnellere Seiten haben Ranking- Vorteil
5. SEO für Bilder: Keywords in Bildtiteln und Alt- Attributen
6. Backlinks: aufgrund hochwertiger Inhalte freiwillige Verlinkungen auf Landing-Page
Alexander Winterstein
WAS SIND META-TAGS? . Unsichtbare Hinweise im
-Bereich einer Website. Übermitteln diverse Informationen an Maschinen/Robots
. Technik aus den 90er Jahren
. Suchmaschinen und Websites reagieren noch auf einige meta-Tags
Beeinflussen das Ranking nur indirekt
Alexander Winterstein
RELEVANTE META-TAGS
Alexander Winterstein
RELEVANTE META-TAGS Attribut „description“
. Wird im Ranking nicht berücksichtigt
. Maßgeblich für Click-Through-Rate (CTR)
. Aufbau nach AIDA-Prinzip ratsam
. Attention, Interest, Desire, Action
. 160 Zeichen maximal [100 auf mobilen Endgeräten]
Alexander Winterstein
RELEVANTE META-TAGS Attribut „title“
. „title“ kein meta-Element
. Interpretation ausschließlich von Webbrowsern und Suchmaschinen
. Verwendung zur Berechnung des Google-Rankings
Alexander Winterstein
RELEVANTE META-TAGS Attribut „robots“
. "index,follow" erlauben aktuelle Seite zu indizieren
. "noindex" bzw, "nofollow" verhindern mehrfaches indizieren
. Redundante Inhalte Spam
PageRank kann verwässern
Alexander Winterstein
RELEVANTE META-TAGS Meta-Tags für Social Media
. Google+
Alexander Winterstein
VERFÜGBARE META-TAGS IN DRUPAL 6 . Title
. Description
. Abstract
. Keywords
. Revisit-after
. Robots
Alexander Winterstein
SEO IN ALLER KÜRZE . Spam vermeiden
. Zielgruppe kennen und bedienen
. Barrieren vermeiden
. Links [Off-Page-Optimierung]
. Keyword-Datenbank nutzen https://adwords.google.de/KeywordPlanner
Alexander Winterstein
FRAGEN ZUR SUCHMASCHINENOPTIMIERUNG? . Ranking-Faktoren
. Meta-Tags
. Suchmaschinenoptimierung (SEO)
Alexander Winterstein
INHALTSTYPEN . Bildergalerie
. Infoblock
. News
. Publikation
. Seite
. Veranstaltung
. Webform
Alexander Winterstein
BILDERGALERIE . Bildergalerie als Unterseite
. Aufbau: normale Seite
. Zusatz: Galeriebilder hochladen & auswählen
. Upload: Einzelbild oder Bulk- Upload
Alexander Winterstein
INFOBLOCK . Eintrag in rechten Spalte
. Sichtbarkeit auf allen Seiten des Bereichs
. Verwendung primär für Kontaktinformationen
Alexander Winterstein
VERANSTALTUNG . Veranstaltungskalender:
. Leben Veranstaltungen
. Veranstaltung hinzufügen
. Voraussetzung: zentrales Uni-Login . Hinweis:
. "Vorschau"-Button "Speichern"-Button . Kein nachträgliches Bearbeiten möglich
Alexander Winterstein
WEBFORM . Formular in Webseite einbinden
. Aufbau wie normale Seite
. Hinzufügen und Konfigurieren von Komponenten
. E-Mail-Versand
. Export der Ergebnisse [CSV]
Alexander Winterstein
MEHRSPRACHIGKEIT . Übersetzung für aktuelle Seite hinzufügen
. Hinweis: Inhalte werden dadurch nicht übersetzt!
. Vorgehen:
1. Sprache auswählen standardmäßig „Sprachneutral“
2. Seite speichern
3. Neuen Reiter „Übersetzen“ anklicken
4. Neue Sprachversion auswählen
5. Inhalte in der neuen Sprache einpflegen
Alexander Winterstein
MEHRSPRACHIGKEIT
Alexander Winterstein
SPRACHE ZUWEISEN
Alexander Winterstein
ÜBERSETZUNG HINZUFÜGEN
Alexander Winterstein
MENÜ BEARBEITEN
Alexander Winterstein
MENÜ BEARBEITEN
Alexander Winterstein
BERECHTIGUNGEN . Bereichsadministratoren verwalten Berechtigungen
. Meine Gruppen Mitglieder
. Redakteure hinzufügen/entfernen
. Redakteur zum Administrator ernennen/entfernen
. Erst nach erstem Login können Berechtigungen eingestellt werden!
Alexander Winterstein
ÜBUNGEN . Word-Dokument herunterladen
. „Fortgeschrittenenschulung – weiterführendes Arbeiten mit Drupal“
. http://drupal2.hrz.tu-freiberg.de/schulungsbereich
. Übungsaufgaben selbstständig bearbeiten
Alexander Winterstein
WEITERFÜHRENDE INFORMATIONEN . Webportal
. Informationen zum Webauftritt, Anleitungen und Support
. http://tu-freiberg.de/webportal/
. Fragen und Probleme
Alexander Winterstein