Webseiten sind keine Gemälde. Webstandards für ein besseres Web. Webstandards für ein besseres Web



Ähnliche Dokumente
Wir machen neue Politik für Baden-Württemberg

PHP - Projekt Personalverwaltung. Erstellt von James Schüpbach

Statuten in leichter Sprache

Anleitung über den Umgang mit Schildern

mysql - Clients MySQL - Abfragen eine serverbasierenden Datenbank

Lineargleichungssysteme: Additions-/ Subtraktionsverfahren

Migration von statischen HTML Seiten

Professionelle Seminare im Bereich MS-Office

Gambio GX2 FAQ. Inhaltsverzeichnis

Dokumentenverwaltung im Internet

Würfelt man dabei je genau 10 - mal eine 1, 2, 3, 4, 5 und 6, so beträgt die Anzahl. der verschiedenen Reihenfolgen, in denen man dies tun kann, 60!.

4 Aufzählungen und Listen erstellen

Glaube an die Existenz von Regeln für Vergleiche und Kenntnis der Regeln

Blog Camp Onlinekurs

Fotogalerie mit PWGallery in Joomla (3.4.0) erstellen

Denken und Träumen - Selbstreflexion zum Jahreswechsel

Widerrufsbelehrung der Free-Linked GmbH. Stand: Juni 2014

Kommentartext Medien sinnvoll nutzen

WEBSEITEN ENTWICKELN MIT ASP.NET

Sehr geehrter Herr Pfarrer, sehr geehrte pastorale Mitarbeiterin, sehr geehrter pastoraler Mitarbeiter!

Senioren ans Netz. schreiben kurze Texte. Lektion 9 in Themen aktuell 2, nach Übung 7

Webalizer HOWTO. Stand:

Benutzerhandbuch - Elterliche Kontrolle

Systemvoraussetzung < zurück weiter >

Informationen zum Ambulant Betreuten Wohnen in leichter Sprache

Geld Verdienen im Internet leicht gemacht

MARCANT - File Delivery System

Hilfedatei der Oden$-Börse Stand Juni 2014

Jeder ist ein Teil vom Ganzen Inklusion ändert den Blick

2.1 Präsentieren wozu eigentlich?

Erstellen der Barcode-Etiketten:

Dann zahlt die Regierung einen Teil der Kosten oder alle Kosten für den Dolmetscher.

Wie ist das Wissen von Jugendlichen über Verhütungsmethoden?

Regeln für das Qualitäts-Siegel

L10N-Manager 3. Netzwerktreffen der Hochschulübersetzer/i nnen Mannheim 10. Mai 2016

Downloadfehler in DEHSt-VPSMail. Workaround zum Umgang mit einem Downloadfehler

Welche Bereiche gibt es auf der Internetseite vom Bundes-Aufsichtsamt für Flugsicherung?

NODELOCKED LIZENZ generieren (ab ST4)

Lernaufgabe Industriekauffrau/Industriekaufmann Angebot und Auftrag: Arbeitsblatt I Auftragsbeschreibung

A. Ersetzung einer veralteten Govello-ID ( Absenderadresse )

Das sogenannte Beamen ist auch in EEP möglich ohne das Zusatzprogramm Beamer. Zwar etwas umständlicher aber es funktioniert

IINFO Storyboard

Netzwerkversion PVG.view

Holiday plans: ein Gespräch über Urlaubspläne

Selbst ist die Frau / der Mann: eine eigene Homepage erstellen!

Einrichten einer mehrsprachigen Webseite mit Joomla (3.3.6)

Qualität und Verlässlichkeit Das verstehen die Deutschen unter Geschäftsmoral!

Das Blabla des LiLi-Webteams. Browser. HTML-Dateien. Links & Webadressen. ROXEN.

Internet online Update (Mozilla Firefox)

Erfahrungen mit Hartz IV- Empfängern

Welche Gedanken wir uns für die Erstellung einer Präsentation machen, sollen Ihnen die folgende Folien zeigen.

Leit-Bild der Sonnenhofschule

Eine eigene Seite auf Facebook-Fanseiten einbinden und mit einem Tab verbinden.

BERECHNUNG DER FRIST ZUR STELLUNGNAHME DES BETRIEBSRATES BEI KÜNDIGUNG

Umgang mit Schaubildern am Beispiel Deutschland surft

Wir machen uns stark! Parlament der Ausgegrenzten

* Leichte Sprache * Leichte Sprache * Leichte Sprache *

Fotostammtisch-Schaumburg

Bedienungsanleitung: Onlineverifizierung von qualifiziert signierten PDF-Dateien

Tutorial Moodle 2 Rollenzuweisung

Wie benutzen Sie diese Internetseite?

In dem unterem Feld können Sie Ihre eintragen, wenn sie im System hinterlegt wurde. Dann wird Ihnen Ihr Passwort noch einmal zugeschickt.

Hinweise in Leichter Sprache zum Vertrag über das Betreute Wohnen

Was kann ich im Online-Portal alles tun?

Anlegen eines Twitter-Accounts für Buchhandlungen -- Stand Mai 2011

Das DAAD-PORTAL. Prozess der Antragstellung in dem SAPbasierten Bewerbungsportal des DAAD.

Bürgerhilfe Florstadt

Die Größe von Flächen vergleichen

Die Entwicklung eines Glossars (oder eines kontrollierten Vokabulars) für ein Unternehmen geht üblicherweise in 3 Schritten vor sich:

Dokumentation Schedulingverfahren

Es gibt nur eine Bilanz die zählt: Ihre Zufriedenheit.

Checkliste. zur Gesprächsvorbereitung Mitarbeitergespräch. Aktivität / Frage Handlungsbedarf erledigt

Version smarter mobile(zu finden unter Einstellungen, Siehe Bild) : Gerät/Typ(z.B. Panasonic Toughbook, Ipad Air, Handy Samsung S1):

Zum Lesen von News-Feeds unter Windows bieten sich diverse kostenlose bzw. kostenpflichtige Feed-Reader an:

Die SPD und die Grünen machen im Niedersächsischen Landtag. Alle Menschen sollen in der Politik mitmachen können.

Einstellen der Makrosicherheit in Microsoft Word

1. Laptop: Benutzen Sie die Anleitung ab Seite 2 2. Tablet / Smartphone: Benutzen Sie die Anleitung ab Seite 4. Seite 2 Seite 4

Webgestaltung - Jimdo 2.7

Abschlussprüfung Realschule Bayern II / III: 2009 Haupttermin B 1.0 B 1.1

Kurzanleitung für Verkäufer

Bedienungshinweise für das Smartboard. Basisfunktionen

Serienbrieferstellung in Word mit Kunden-Datenimport aus Excel

Deutsches Rotes Kreuz. Kopfschmerztagebuch von:

Shopz Zugang Neuanmeldung

Step by Step Webserver unter Windows Server von Christian Bartl

Flyer, Sharepics usw. mit LibreOffice oder OpenOffice erstellen

Sichere Anleitung Zertifikate / Schlüssel für Kunden der Sparkasse Germersheim-Kandel. Sichere . der

Tipps zur TV-Nutzung für Eltern

S Sparkasse Hohenlohekreis. Leitfaden zu Secure

Internet Explorer Version 6

Testament Muster, Testament Vorlage, Testament Vordruck kostenlos

- Tau-Office UNA - Setup Einzelplatzinstallation. * Der griechische Buchstabe T (sprich Tau ) steht für Perfektion. Idee und Copyright: rocom GmbH

GOtoSPORT.CH Internetplattform

Lichtbrechung an Linsen

Menü auf zwei Module verteilt (Joomla 3.4.0)

Leichte-Sprache-Bilder

Print2CAD 2017, 8th Generation. Netzwerkversionen

Positionierungsspiel. Statements und Fragen zu Werbung im Social Web

Unternehmens-Check (U.C.)

Transkript:

Webseiten sind keine Gemälde

Webkrauts Die Initiative für die Webkrauts ging von einem Blogeintrag im August 2005 aus. Nach dem Aufruf fanden sich innerhalb von etwa drei Tagen über 60 Interessierte zusammen. Die Webkrauts sind weder eine Organisation, noch ein Verein. Wir sind eine Initiative.

Webkrauts Die Webkrauts setzen sich dafür ein, die Vorteile der Webstandards auch im deutschsprachigen Raum stärker zur Geltung zu bringen. Webstandards bieten viele Vorteile für alle, die das Internet benutzen. Webdesigner und -entwickler unterstützen wir dabei, Standards einzusetzen und so ihre Arbeit zu verbessern. Wir leisten Aufklärungsarbeit durch Veröffentlichungen im Netz und in anderen Medien.

Webseiten sind keine Gemälde WWW als Oberfläche für den Austausch wissenschaftlicher Informationen entwickelt textorientiert wenige Elemente Content is King Kommerzialisierung ging schnell und ungeplant Tabellenlayout: der erste Hack im Web Analogie zu Altbekanntem

Am Anfang war... Die Aufbruchstimmung Jeder wollte mitmischen, alles mußte schnell gehen Browser krieg um Vorherrschaft im Web

Webseiten sind keine Gemälde Eine Webseite ist ein Dokument Es gibt Absätze, Listen, Überschriften... Es gibt keine Fussnoten, Anmerkungen, Subheadlines, Werbung... HTML ist leider semantisch schwach.

Webseiten sind keine Gemälde Vom Inhalt, nicht von der Gestaltung her denken! Webseiten sind Dokumente!

Was wissen wir über den Surfer? Nur daß er die Seite anschaut. Sonst nicht viel! Wichtige Fragen für die Entwicklung einer Webseite: Ist der Browser komplett geöffnet? Ist der Rechner auf Invertierung geschaltet? Wie schnell ist die Internetverbindung? Sind Plugins installiert und Javascript an? Wie ist Grundschriftgröße seines Systems? Welche Schriften sind installiert? u.v.m.

Standards? W3C XML SVG MathML CSS HTML WCAG WCAG (Web Content Accessibility Guidelines) SWF ECMA-Script XMLHttpRequest innerhtml

Was sollen Standards? Sie können helfen, daß ich früher nachhause gehe. Alle Browser haben eine gemeinsame Basis, die sie interpretieren und die ich kenne. Keine Sonderbehandlung notwendig. Es wird eine Seite entwickelt, nicht verschiedene Varianten. Standards sind zur Qualitätssicherung da.

Gegenfrage: was soll DAS? Besser wäre es so:

Ebenen einer Webseite Dynamik Layout Struktur Inhalt Business-Logik Javascript, DOM CSS (X)HTML MySQL, XML PHP, ASP, JAVA

Semantik Die Inhalte einer Webseite werden danach ausgezeichnet was sie sind, nicht wie sie aussehen sollen. Eine Überschrift wird mit <h1> bis <h6> umfaßt. Eine Liste wird mit <ul> oder <ol> und <li> gemacht, nicht einfach Absätze untereinander oder Zeilenumbrüche Das Aussehen kommt durch CSS.

Semantik und Layout Erst bestimmen, was es ist, dann das Aussehen bestimmen. Wenn die Überschrift die gleiche Schriftgröße wie der Absatz hat, kann man trotzdem nicht auf die Überschrift verzichten

Jeder Browser hat sein Stylesheet

Ein bischen CSS-Magic

Ein HTML, viele CSS: CSSZengarden

Das gleiche HTML, anderes CSS

Das gleiche HTML, anderes CSS

Das gleiche HTML, anderes CSS

Empfehlenswerte Bücher (1) http://www.amazon.de/dp/3898428370/

Empfehlenswerte Bücher (2) http://www.amazon.de/dp/3898428370/ http://www.amazon.de/dp/8790785754/ http://www.amazon.de/dp/3827324777/ http://www.amazon.de/dp/3827323797/ http://www.amazon.de/dp/382724224x/ http://www.amazon.de/dp/3815825989/ http://www.amazon.de/dp/3827323436/

Am Ende http://webkrauts.de Jens Grochtdreis http://blog.grochtdreis.de Diese Präsentation steht unter der Creative Commons Lizenz Attribution-ShareAlike 2.0 http://creativecommons.org/licenses/by-sa/2.0/de/