Webstandards und Kundenansprache
13. Juli 2007 von Nils PookerEine Argumentationshilfe für ein besseres Web
Wie sag ich’s meinem Kunden?
Immer wieder stellt sich die leidige Frage, wie man dem Kunden die Vorteile von Webstandards nahebringen soll. Als Verfechter von Webstandards unterliegt man bekanntlich schnell der Versuchung, die "allein selig machende Wahrheit" über gutes Webdesign mit missionarischem Eifer und viel technischem Know-how zu kommunizieren. Dass so etwas nicht funktionieren kann, wissen wir alle: Der technische Hintergrund zu seiner Website interessiert den Kunden ebenso wenig wie die Fertigungstechnik seines schönen Parkettfußbodens.
Als Kunde hat man jedoch bezüglich der Brauchbarkeit eines Produktes konkrete Anforderungen und Vorstellungen.
Bei dem Parkettfußboden bedeutet das zum Beispiel: soll gut aussehen, eine echte Holzoberfläche haben, soll lange halten, abriebfest sein, soll pflegeleicht und gut verarbeitet sein.
Brauchbarkeit und Funktionalität
Bei einer Website sieht das ähnlich aus, auch hier setzen die Kunden Prioritäten und haben konkrete Vorstellung von der Brauchbarkeit und der grundsätzlichen Funktionalität. Das sieht dann oft folgendermaßen aus:
Die Website soll
- gut aussehen
- bei Google oben stehen
- möglichst wenig Geld kosten
- sich schnell laden
- gut und schnell erfassbar sein
- nützliche Features haben
- investitionssicher sein
Hier steht also nichts zur Technik, wie "semantisch korrektes HTML", "CSS-Layout ohne Tabellen", "Trennung von Inhalt und Design" oder "em statt Pixel". Nur wenn eine Technik die Qualität der Brauchbarkeit verbessert, ist das auch für den Kunden ein wichtiges Argument. Parketthersteller verschaffen sich ja Wettbewerbsvorteile mit Argumenten wie "hohe Abriebgruppe", "2 Jahre abgelagertes Holz" oder "vierfach versiegelt". Diese Argumente entsprechen nämlich exakt den Kundenanforderungen. Wie die Parketthersteller diese Ziele technisch erreichen, interessiert den Kunden nicht.
Was ist zu beachten?
Eine Argumentation für Webstandards funktioniert ebenfalls ausschließlich in Bezug auf die Brauchbarkeit einer Website. Dabei muss man nicht einmal Begriffe wie W3C, CSS, HTML, Quellcode oder Semantik in den Mund nehmen.
Erstens: viel zeigen, wenig reden. Wer mich kennt, weiß, wie schwer mir das fallen muss. Trotzdem ist es die wichtigste Voraussetzung überhaupt: man muss dem Kunden die Vorteile direkt am Rechner zeigen. Nehmen Sie auch Ihren Laptop mit, auf dem Sie Kundenprojekte und Ihre favorisierten Editoren installiert haben.
Zweitens: mit Bekanntem vergleichen. Versetzen Sie sich in die Lage Ihres Kunden: was ist ihm geläufig, was kennt er? Sicher ist z. B. immer ein Vergleich der HTML-Struktur mit der Formatierungspalette von MS Word. Ist Ihr Kunde etwas bewandert in HTML oder einer Programmiersprache, können Sie gezielt etwas im (X)HTML-Code zeigen. Kennt er sich ein wenig mit Grafik oder Gestaltung aus, finden Sie im Thema CSS genügend Anknüpfungspunkte.
Drittens: keine Fachmonologe. Wenn Ihr Kunde nicht selbst aus dem IT-Bereich kommt, wird er keine Ahnung von dem haben, was Sie ihm als Standardista alles erzählen möchten. Strapazieren Sie nicht die Geduld und noch weniger die Intelligenz Ihres Kunden, indem Sie ihn mit einem Fachwissen zumüllen, das er nicht wirklich braucht und von dem er sowieso die Hälfte vergessen hat, sobald Sie wieder in Ihrem Büro sitzen. Der Kunde lädt Sie zum Gespräch, der Kunde nimmt sich die Zeit, der Kunde konsultiert Sie als Profi. Es ist Ihr Job, das Beste daraus zu machen.
Betrachten wir uns nun die Kundenanforderungen und gehen konkret darauf ein:
Erster Punkt: "Die Website soll gut aussehen"
Hintergrund: Im Moment der Veröffentlichung einer freigegebenen Website gibt es kaum noch relevante visuelle Unterschiede mehr zwischen Tabellenlayout und Webstandards. Unschlagbare Vorteile gibt es dagegen in allen Projektphasen von der Grundkonzeption bis zum Launch: Die ständig realisierbare Modifizierung des Designs bleibt immer klar kalkulierbar, unabhängig vom Umfang und den Inhalten bereits fertiggestellter HTML-Dokumente. Bei einem Tabellenlayout steigt ja der Aufwand mit dem Projektablauf progressiv an.
Die Argumente des Webworkers: "Sie sehen hier eine Testseite / die Startseite und einige Musterseiten / die komplett verlinkte Struktur der Internetpräsenz / die Website / im Internet. Wenn Sie unabhängig von den eigentlichen Inhalten der Einzelseiten noch Änderungen an den Farben, an den Hintergrundgrafiken, an den Navigationspunkten mit den einzelnen Mauseffekten oder an den Schriften haben, ist das jederzeit möglich, der Aufwand bleibt überschaubar und immer gleich. Sie können entsprechende Wünsche selbstverständlich auch nach Online-Stellung formulieren. Das ist deshalb kein Problem, da das komplette Design Ihrer Internetpräsenz von einer externen Datei gesteuert wird, und nur in dieser Datei muss ich die Änderungen vornehmen."
Praxis: Öffnen Sie die Website (oder ein entsprechendes Vorzeige-Projekt) und demonstrieren Sie anhand der CSS-Änderungen die Vorteile. Ändern Sie Schriftfamilie, die Farbe des Seitenhintergrundes (Gelb, Grün, Pink…) und die für Überschriften. Zeigen Sie parallel, dass sich alle Seiten der Website umgehend geändert haben. Zusätzlich können Sie eine Seite aufrufen, die mit mehreren Stilen arbeitet. Ich selbst habe deshalb meine alte Website (2005) noch online, auf die ich trotz Mängel auch ohne Kundenbesuch verweisen kann (www.pookerart.de/pookerart2005).
Zweiter Punkt: "Die Website soll bei Google oben stehen"
Hintergrund: Alter der URL, die Querverlinkungen von Dritten und eine XML-Sitemap sind wichtige Voraussetzungen für das Rating bei Google. Auch die für jede Seite separaten Descriptions und Keywords sind sinnvoll. Trotzdem führt schon der semantisch korrekte Aufbau von HTML-Seiten nachweisbar zu vergleichsweise guten Ergebnissen in der Platzierung.
Die Argumente des Webworkers: "Google kann keine Bilder, Fotos und Grafiken sehen. Die Suchmaschine ist also auf den reinen Text der Internetseiten angewiesen. Bei professionellen Internetseiten werden die Texte wie bei einem Word-Dokument logisch strukturiert: es gibt Überschriften, ungeordnete Listen mit Punkt, geordnete Listen mit Zahlen oder Buchstaben und normale Absatztexte. Wie das am Monitor aussieht, bestimmt die externe Datei, die für das Design zuständig ist. Wichtig ist nur, dass eine Überschrift auch tatsächlich als Überschrift 1, 2, 3 oder 4 gekennzeichnet ist und nicht als optisch vergrößerter Absatztext oder gar als Bilddatei. Die Ergebnisse von Google folgen der Hierarchie der Überschriften. Wie in Word könnte man ja den Schriftgrad eines Absatzes so verändern, dass er wie eine Überschrift aussieht. Aber Google indiziert dann nur einen eher unwichtigen Absatztext. Genauso wichtig ist es, allen Fotos und Bildern, die zum Inhalt gehören, einen kurzen Text zu geben."
Praxis: Öffnen in einem Browserfenster einen Tabellenverhau (Hardcore: mit Frames), Font-Tags und Grafik-H1 und in einem anderen Browserfenster eine standardkonforme, gut temperierte, sorgfältig strukturierte Seite aus Ihrem Portfolio. Dann schalten Sie CSS und Bildausgabe ab und kommentieren die sichtbaren Ergebnisse mit den Worten: "Google findet genau das, was auch Sie jetzt sehen."
Tipp: Man kann in einem Testcase auch ein kleines Script einbauen, das die Stylesheets mit Mausklick abschaltet: http://dorward.me.uk/software/disablecss/. Dazu für die Kunden eine "hidden H1" mit dem Link "Zurück zur normalen Darstellung" ("normal" ist für jeden Kunden logischerweise die grafische Darstellung).
Dritter Punkt: "Die Website soll möglichst wenig Geld kosten"
Hintergrund: Natürlich steht diese Vorgabe oft genug an erster Stelle. Was fällt leicher, als sogar dem Pfennigfuchser – wenn man denn will – eine günstige Website anzubieten. Webstandards bedeuten ja nicht nur Potential in der Tiefe, sondern auch ein flexibles Handling. Es gibt das YAML-Framework und es gibt eigene, bewährte Projektvorlagen, denen man mit überschaubarem Aufwand ein völlig neues Gewand verpassen kann.
Die Argumente des Webworkers: "Sie können sich die kleinen Internetpräsenzen von X und Y ansehen. Ich kann das Layout Ihren Vorstellungen entsprechend verändern. Das Grundkonzept bleibt erhalten, aber Sie bekommen dennoch ein vollständig individuelles Design mit Ihrem Logo, Ihren Farben und Ihren Inhalten."
Praxis: Kalkulieren Sie mit einem bewährten Grundlayout, dass Sie für den Kunden individualisieren. Sofern Sie das wollen, können Sie auf diese Art selbst kleine Budgets mit einem ansehnlichen Projekt bedienen.
Vierter Punkt: "Die Website soll sich schnell laden"
Hintergrund: Auch hier kann man die Vorteile des schlanken, tabellenlosen Quellcodes ganz praktisch demonstrieren. Sinnvoll ist es auch, wenn Sie als Webworker oder Ihr Webdesigner die Grundsätze schlanker Bilddateien kennen. Eine sinnvolle und raffinierte Technik ist beispielsweise die Wiederholung von Hintergrundgrafiken in unterschiedlichen Bereichen der Website.
Die Argumente des Webworkers: "Professionelle Websites sind sehr schlank programmiert (sparen Sie sich gegenüber dem Kunden die Differenzierung von Auszeichnungs- und Programmiersprache). Das Design wird von einer Datei gesteuert, die sich zusammen mit allen wiederholenden Grafiken einmal beim Aufrufen der Internetpräsenz lädt und dann im internen Speicher Ihres Browsers bleibt. Dadurch lädt sich die gesamte Website automatisch sehr schnell. Grundsätzlich gilt, je mehr Grafiken und Bilder erscheinen sollen, desto länger dauert die Ladezeit einer Seite. Für Animationen gilt das noch viel mehr. Schlechte Internetseiten werden mit unsichtbaren Tabellen erstellt, diese Tabellen werden erst vollständig geladen, bevor Sie die Inhalte sehen. Was Sie nicht verhindern können, sind längere Ladezeiten bei so genannten Redaktionssystemen, das liegt jedoch an der Art der Technik, dort müssen die Inhalte aus einer separaten Datenbank geladen werden."
Praxis: Öffnen Sie zwei Browserfenster. Im ersten Fenster öffnen Sie eine grafiklastige Tabellen-Website mit Flash-Animation. Danach (also mit kurzem Vorsprung für die Tabellen) öffnen Sie Ihre standardkonforme Seite. Auch mit DSL überholt die standardkonforme Site meistens deutlich den Tabellenverhau. Wenn Ihr Kunde an der Technik interessiert ist, zeigen Sie ihm die Funktion der Quelltextanzeige und weisen ihn auf die typischen table-Tags hin. Im Vergleich wird selbst eine umfangreich strukturierte, barrierefreie Seite nur halb so lang sein wie eine tabellenbasierte.
Fünfter Punkt: "Die Website soll gut und schnell erfassbar sein"
Hintergrund: Genau, eigentlich geht es hier um gutes Webdesign bezüglich Usability. Aber dazu gehört auch die Positionierung und Auszeichnung von Navigationslisten mittels CSS.
Die Argumente des Webworkers: "Die Navigation ist das Rückgrat und damit die Voraussetzung für eine klare Orientierung auf einer Internetseite. Die Menüpunkte sind eigentlich normale Listen. Sie werden aber mit Hilfe der externen Datei, die das Design steuert, nicht als einfache Listen, sondern als prominente Menüpunkte gezeigt. Die Hauptmenüpunkte sind größer und Kontrastreicher als die Untermenüpunkte. Man kann dann die Hierarchien einer Navigation so gestalten, dass der Besucher sofort erkennt, wo er sich befindet. Die externe Datei steuert auch das Aussehen der Menüpunkte, wenn Sie mit Ihrer Maus darüberfahren, und eine weitere Optik, wenn Sie mit der Maus auf den Menüpunkt klicken. Der Menüpunkt, der mit dem Standort übereinstimmt, ist zum Beispiel nicht anklickbar und optisch von den anderen Punkten abgehoben. Trotzdem verbergen sich hinter den Menüs nur einfache Listen, die dadurch schnell zu ändern sind, sich sehr schnell laden und von Google vollständig erfasst werden. Auf schlechten Internetseiten wird das oft mit unzähligen Grafiken gelöst, was nicht nur unflexibel und aufwendiger ist, sondern auch zu erheblichen Ladezeiten und unnötigem Daten-Ballast führt."
Praxis: Vielleicht zeigen Sie Ihrem Kunden noch ein paar gelungene Beispiele aus der CSS-Library von DynamicDrive.
Sechster Punkt: "Die Website soll nützliche Features haben"
Hintergrund: Stichworte hier: skalierbare Inhalte/Elemente, eventuell flexibles/liquides Design und Schriftgrößenänderung und – ganz wichtig – die Druckversion. Vielleicht als Nachtisch: ein Fruchtcocktail aus Web 2.0, garniert mit süßem AJAX.
Die Argumente des Webworkers: "Wenn Sie die Schrift vergrößern (eingebaut oder über den Browser zu zeigen), bezieht sich das nicht nur auf einige Inhaltstexte, sondern auf alle Textelemente der Seite. Das gilt also auch für die Navigation und (eventuell) den Slogan/Titel in der Kopfzeile. Sie können jede Seite (über einen Link) ausdrucken. Das Ergebnis sieht aus wie der schwarz-weiß-Text eines Word-Dokuments mit Überschriften, Absätzen, Listen und Bildern. Dabei wird eine externe Datei aktiviert, die ist nur die Druckausgabe steuert. Dabei wird der Text als Times-Schrift ausgegeben, die auf Papier besser lesbar ist. Alle Inhalte und Farben der Seite, die für den Ausdruck unnötig sind, werden in dieser Datei, also für den Druck, ausgeblendet: Hintergrundfarben, Hintergrundgrafiken, Navigationsmenüs und andere Inhalte wie der Link zum Anfang der Seite, die nur für die Nutzung am Monitor wichtig sind."
Praxis: Öffnen Sie eine farbkräftige oder zumindest grafiklastige Seite und drucken Sie die Seite aus.
Siebter Punkt: "Die Website soll investitionssicher sein"
Hintergrund: Hier geht es erstens um die Trennung des Designs vom Inhalt. Der heutige Designtrend wird in drei Jahren nur noch ein müdes Lächeln erzeugen. Eine CSS anzupassen ist nicht nur ein "l’art pour l’art"-Thema (auf deutsch und ganz neu: "CSS Neustart"), sondern auch die Möglichkeit, angemessen auf sinnvolle Designtrends im Interesse des Kunden zu reagieren. Hier geht es außerdem um die Spezifikationen des W3C: in drei Jahren werden wir überall HTML 5 im Web vorfinden, so wie wir heute ja überall validierte Websites nach HTML 4.01 und XHTML 1.0 … ok, kleiner Scherz, konnte ich mir nicht verkneifen. CSS jedenfalls wird wie die (X)HTML-Struktur auch von den zukünftigen Browsern unterstützt. Also keine zepflückten Layouts und wahrscheinlich auch keine Script-Leichen. Das wichtigste Argument für den Kunden ist aber die durch Standards gesicherte Transparenz der (X)HTML- und CSS-Dateien. Webworker sollten gerade diesen Vorteil oft genug betonen: Viele haben Angst, die "Kontrolle" über das Projekt zu verlieren, doch der Kunde zahlt für eine erbrachte Leistung, nicht für ewige Abhängigkeit und Leibeigenschaft. Und was jedem guten Handwerker recht ist, der mit DIN-Normen arbeitet und dessen Arbeit theoretisch immer von einem Kollegen fertiggestellt werden könnte, sollte einem professionell tätigen Webworker billig sein.
Die Argumente des Webworkers: "Wenn sich Ihr Corporate Design in den nächsten Jahren ändern sollte, ist es kein Problem, das komplette Layout, alle Farben und alle Hintergrundgrafiken zu modifizieren. Was während der Konzeption Ihrer Website jederzeit machbar ist, ist aufgrund der technischen Umsetzung genauso in mehreren Jahren machbar. Das gilt natürlich auch für bestimmte Trends und Neuerungen im Internet (vermeiden Sie "Web"). Wenn Sie einmal etwas finden sollten, was Ihnen gefällt, fragen Sie einfach danach, ich werde Ihnen dann sagen, ob das sinnvoll und gut ist und ob das zu den Anforderungen Ihrer Website passt.
Eine professionelle Website hält sich an feste technische Standards, die es auch im Internet gibt. Dazu gehört zum Beispiel die schnelle Anpassbarkeit des Designs über eine externe Datei und die logische Struktur der Inhalte. Standards und Normen sorgen ja allgemein dafür, dass zum Beispiel Ihre auf Vorrat gekauften Energiesparlampen von Aldi auch noch in fünf Jahren in eine neue Luxus-Stehlampe passen. Und im Internet sorgen so genannte Webstandards dafür, dass Ihre Website auch noch in fünf Jahren auf Ihrem vielleicht in das Ceran-Kochfeld Ihres Herdes eingefassten Monitor genauso aussieht und funktioniert wie jetzt, auch wenn Sie nicht mit mehr dem Firefox, sondern vielleicht mit einem Browser namens HotRabbit im Internet surfen.
Das wichtigste an diesen Standards ist allerdings die für jeden professionellen Internetdienstleister nachvollziehbare Struktur der Internetseiten. Alles ist transparent, und wenn ich nicht mehr für Sie zur Verfügung stehe oder zur Verfügung stehen soll, gehen Sie einfach zu einem anderen professionellen Anbieter/Webdesigner/Webentwickler/Agentur. Warum dieser Vorteil für Sie so wichtig ist, möchte ich etwas ausführlicher erläutern. Ich erwähnte ja, dass schlechte Internetseiten mit unsichtbar gemachten Tabellen erstellt werden. Mit dieser alten Methode machen Sie sich vollkommen abhängig von demjenigen, der sie Seite erstellt hat, denn es ist für einen dritten schier unmöglich, die Struktur von verschachtelten Tabellen zu durchblicken. Ein Beispiel: Ihre Musterbriefe sind in Word verfasst, es gibt eine Fußzeile und eine Kopfzeile, alles ist standardisiert und klar strukturiert, dass Sie morgen jede Aushilfssekretärin bitten könnten, eine Änderung an den Dokumenten vorzunehmen. Und wenn die Dokumente wie bei einer nach Webstandards erstellten Internetseite auch noch miteinander über eine Mustervorlage verknüpft sind, muss nur diese Vorlage einmal verändert werden, und alle anderen Briefe übernehmen diese Änderung automatisch. Stellen Sie sich vor, Ihre frühere Sekretärin hätte in wochenlanger Arbeit 20 verschiedene Musterbriefe in Excel mit jeweils dutzenden von ineinander verschachtelten und unsichtbar gemachten Tabellen erstellt. Briefe mit Adressfeld, Absenderzeile, Textfelder, Fußzeile und Kopfzeile. Für die neue Sekretärin wäre es doch nahezu unmöglich gewesen, auch nur kleinste Änderungen an diesem Tabellenchaos vorzunehmen, ohne dabei einen Musterbrief zu zerschiessen. Und: sie hätte diese Änderung ja in allen 20 Briefen vornehmen müssen. Genau so geht es einem Webdesigner, wenn er gebeten wird, eine tabellenbasierte Internetseite nur ein bisschen zu verändern. Als Kosten-Nutzen-Rechnung ist das dann eigentlich immer ökonomischer Wahnsinn. Auch aus diesem Grund gibt es die so genannten Webstandards und aus diesem Grund steht es Ihnen nach Fertigstellung Ihrer Internetpräsenz frei, jederzeit den Dienstleister zu wechseln."
Praxis kann man sich hier sparen.
Schlußwort
Es ist mal wieder ein elendig langer Text für ein Weblog geworden, aber das war es mir wert. Webstandards kann man erfolgreich kommunizieren, ich habe das als "One-Man-Show" neben Konzeption, Codierung, Textkreation, Fotoarbeit und Grafikdesign immer mit dem oben beschriebenen Weg geschafft. Es geht eben doch, und die Kunden sehen die Vorteile, auch wenn sie den technischen Hintergrund nicht nachvollziehen können.
Update 05.09.2007:
Einen hervorragenden Artikel zum Thema Kundenkommunikation findet der geneigte Leser übrigens auch bei Stefan Nitzsche: "Management: Vom Umgang mit Kunden". Lesen!
Kategorie: Webstandards 44 Kommentare »
Ein weiteres Verkaufsargument wird ein statistischer Vergleich sein. Jeder mag Statistiken, besonders die Deutschen. So kann neben den Ladezeiten auch die Renderzeiten (also die Zeit, die der Webbrowser zum Darstellen einer Webseite benötigt) und die Ladevolumen gegenübergestellt werden.
Besonders eine Verbesserung des letzteren wird den Auftraggeber sicherlich freuen, wenn ihm dazu eine Hochrechnung präsentiert wird, in der die monatlichen Kosten gegenübergestellt und möglichen Ersparnisse der standardkonformen Version verdeutlicht werden.
Clientseitiges Caching und Datenkompression sind dabei zwei weitere Punkte, die genannt werden können, um die Ladezeiten zu verringern.
[...] Pooker widmet sich in einem umfassenden Artikel dieses Problems. Herausgekommen ist eine "Argumentationshilfe für ein besseres Web". Von [...]
[...] zum Thema: Webstandards und Kundenansprache Tags: training, W3CBeitrag tauschen:Diese Symbole sind verlinkt zu Internetseiten die das Tauschen [...]
Sehr schön! Vielen Dank für die Gegenüberstellungen , ich werde das beim nächsten Mal auf jeden Fall umsetzen.
Ich gehöre leider zu der Fraktion, die sich schnell in Fachmonologe reinsteigert, die eh niemand versteht. Dazu kommt noch, dass ich dann sinngemäß oft ins Negative abdrifte wie, “98% der Seiten sind Schwachsinn, hören Sie doch auf mich” oder so ähnlich.
Deswegen finde ich Artikel wie Deinen, erfrischend, aufmunternd, von denen ich auch viel für meine Verhaltensweisen mitnehmen kann.
Eine kritische Anmerkung habe ich aber zur Argumentation des Nachvollziehbaren:
Ab mittleren Projekten gibt es dann schon mal mehrere CSS-Dateien mit mehreren KB und mehr, die ineinander spielen.
Ohne sinnvoller Dokumentation, kann kein neu hinzugekommener diese CSS-Dateien so “im Drübergehen” entschlüsseln. Natürlich ist das immer noch ein mächtiger Vorteil gegenüber althergebrachtem Tabellen, wenn ich denn mal die Logik der CSS-Konstrukte der Vorgänger/innen kapiert habe.
@ Markus:
Die Rolle des Traffic-Aufkommens ist bei kleineren und mittleren Präsenzen nicht relevant genug. Traffic gibt es für kleineren Präsenzen bei einigen Provider schon als Flat, wenn die Seite nur über wenige MB verfügt, was ja oft kein Problem darstellt. Anders sieht es nur bei stark frequentierten Sites aus, da gebe ich dir recht: Solange Lokalredaktionen oder Stadtportale noch auf kompliziert verwurstete Tabellen setzen, ist das schon unangenehm. Richtig weh tut es erst bei Tageszeitungen, Banken und dergleichen.
@Gerald:
Du hast recht, mehrere CSS-Dateien machen Sinn – Für den Webworker. Das ist aber genau der Punkt: Bis du einem Kunden auch noch die Hierarchie und Struktur der externen CSS-Bibliothek erklärt hast, kann er sich schon nicht mehr an die Bedeutung der “externen Datei, die das Design steuert” erinnern. Das ist unnötige Verwirrung, der Kunde wird nicht die CSS öffnen und bearbeiten. Man könnte sonst auch noch auf die Einbindung der CSS per @import eingehen, aber dann hat man den Kunden wieder da, wo man ihn nie haben wollte: heulend am Rechner, oder kurz im Flur, um dir deinen Mantel zu bringen…
Saugut! Endlich mal eine umfangreiche und vernünftige Argumentationshilfe. Danke!
@Gerald: Wenn man auf semantisches Markup setzt, also auch Klassennamen und IDs nicht nach ihrer visuellen Präsentation, sondern nach ihrer Bedeutung auswählt, dann werden die CSS Files erstaunlich selbstdokumentierend. Natürlich schadet zusätzliche Dokumentation nicht, aber wichtiger ist tatsächlich die Semantik, die das Meiste ganz intuitiv von jedem Webworker erfassbar macht.
Bedauerlicherweise ist es auch mit CSS möglich, unverständliche und unwartbare Monster zu erzeugen.
[...] » Website besuchen… [...]
Was Mann/Frau dem Kunden ans Herz legen sollte und was m.E. auch ins Kundengespräch gehört:
Es macht wenig Sinn, wenn innerhalb des Webangebotes ein Unternehmen die Qualität seiner Produkte/Leistungen hervorhebt, das Qualitätsmanagement aber beim Webauftritt aufhört.
Dazu gehört auch, dass ein Webangebot ein gewisses Maß an “Sicherheit” gewährleisten sollte.
Kontakt- oder sonstige Formulare, die völlig unkontrolliert jede Eingabe schlucken oder sich auch leer absenden lassen, sind aus vielerlei Sicht unakzeptabel.
Zum Einen können sie der spam-Verbreitung Vorschub leisten, zum Anderen sind sie unter dem Aspekt des Qualitätsmanagements im Bereich des Kunden problematisch – siehe oben.
Es sollte dem Kunden erklärt werden, welche Auswirkungen ein “offenes” Formular haben kann und dass es zur Vermeidung dieser Probleme auch sinnvoll ist, einen kleinen finanziellen Mehraufwand für ein abgesichertes und gut durchdachtes Formularscript zu akzeptieren.
Nun sollte man annehmen, dass dieser Hinweis nicht n̦tig sein sollte Рweit gefehlt.
Der überwiegende Teil im Netz befindlicher Formulare ist wirklich “räudig”. Pflichtfelder, die sich auch leer (oder mit Leerzeichen) absenden lassen, mögliche Datumsangaben fern jeglicher Realität, fehlende oder mangelhafte Syntaxprüfung bei e-mail-Angaben oder (eigentlich) numerischen Feldern und andere Dinge mehr, sind neben der häufig unzugänglichen Gestaltung der Formulare selbst, leider fast Normalität.
“Formular-Vandalismus” ist aber nur die eine Seite der Medaille. Unbemerkte Tippfehler können dazu führen, dass der Empfänger der Formulardaten nicht reagieren oder antworten kann, oder sich umständliche Nachfragen erforderlich machen.
All diese Dinge kann (und muß) der Kunde nicht überblicken – daher sollte man es ihm erklären…
[...] sehr guter, ausführlicher Artikel und eine Argumentationshilfe zum Thema, die nicht nur für Webdesigner von Interesse sein [...]
Formulare sind ein gutes Stichwort (und vor allem die damit verbunde korrekte Implementierung).
Peter hat Recht mit seiner Aussage, dass die meisten Formulare schlecht umgesetzt sind – das Hineinzwängen in Tabellen ist nur die Spitze des Eisberges. Aber solange Sprachen wie PHP die Validierung so umständlich machen und die clientseitige Validierung als _die_ Möglichkeit zur Ãœberprüfung der Benutzereingaben propagiert wird (Javascript z. B.) wird sich da nichts Wesentliches ändern.
@ Peter,
Ja, Moin und Hallo nach Brandenburg!
Peter hat absolut recht, und aufgrund einer super Zusammenarbeit hat er mir gezeigt, was überall im Web so schiefgeht.
Mir ging es hier erstmal um nur das Thema “Webstandards für Kunden”. Klar, in der nächsten Gesprächsrunde Formularproblematik, dann Hosting (da gibt es auch Romane zu schreben…), dann Konzeption und dann PR und Marketing.
@ Frank
Peter hat da wirklich ganz feine Sachen gemacht zu Sicherheit, Spam-Vermeidung und Handling bei Formularen und Such-Routinen…
[...] Nils Pooker hat in seinem pooker.blog einen sehr langen aber in vollem Umfang lesenswerten Artikel veröffentlicht, der wirkungsvolle Argumentationshilfen für Webworker gegenüber ihren [...]
Toller und sehr hilfreicher Artikel; danke, Nils.
Ich freue mich schon auf deine nächsten »Romane«.
@ Stefan
vielen Dank für die Blumen
Vielleicht schaffe ich es beim nächsten mal in Essay-Länge.
Naja, vielleicht auch nicht…
[...] bei der Präsentation. Wie man trotzdem mit Webstandards auftrumpfen kann, hat Nils Pooker in einer Argumentationshilfe für ein besseres Web ausführlich aufgelistet. Definitiv eine sinnvolle [...]
[...] standardkonforme Webseite eine gute Sache sind – sie sind es – arbeitet Nils Pooker aus Sicht der Projektakquise [...]
[...] Webstandards und Kundenansprache – pooker.blog (tags: webstandards webdesign xhtml css deutsch job kunden artickel) [...]
Hallo Nils, schöner Text, aber verwechsle bitte nicht Brauchbarkeit mit dem (Nutz)Wert einer Seite. Nicht alles Brauchbare rechnet sich (für deinen Kunden). Dein Kunde macht das z.B. mit der Forderung nach niedrigen Produktionskosten und einer entsprechenden Renditeerwartung deutlich.
Sogesehen scheint der wichtigste Punkt (unter den genannten sieben) zu fehlen: Warum soll die Seite bei Google oben stehen, wenig kosten, schnell laden, nützliche Features haben usw. Das sind alles keine Selbstzwecke.
Will der Kunde eine Seite oder will er damit etwas anderes: Verkaufen, Leute in Aktion setzen, Herumprollen, …
http://de.wikipedia.org/wiki/Klassisches_Wertparadoxon
[...] Pooker hat in seiner sehr ausführlichen “Argumentationshilfe für ein besseres Web” viele interessante Tipps und Denkanstöße zusammengestellt. Er listet dabei auch [...]
Hinsichtlich Tabellen für Design bin mit vielen Sachen d’accord. Allerdings nicht undebingt bei Formularen. Formulare teilen mit Tabellen m.E. mehr Semantik als meinetwegen mit Divs (hat ja keine) oder Listen, wie es z.B. A List Apart vorschlägt. Feldnamen (th), Feldwerte (td), Köpfe usw. Fieldset und label etc. sind damit kombinierbar. Schaut man sich Formulare aus dem echten Leben an, erkennt man Tabellenstrukturen. Die puristische CSS-Umsetzung eines aufwändigen Formulars wird zuweilen Sadomaso mit zweifelhaftem Nutzen, wenn man ehrlich ist.
Ich finde das Tabellenbashing also insgesamt stark überzogen. E s gibt mittlerweile Leute die HTML-Tabellen komplett für ein Ãœbel halten – ja schon selbst da, wo sie tats. mit tabellarischem Inhalt zu tun haben. Ich kann es verstehen, wenn Leute Tabellen für Seitendesign verwenden. Gründe gibt es derzeit noch einige dafür. 3 Divs nebeneinander auf gleiche dynamische (vom Inhalt-abhängende) Höhe? Das wird mit CSS manchmal ein ziemliches Geeier – außer man simuliert auf CSS-Seite wieder Tabellen. Da stößt die Cross-Browser-Problematik dazu.
An anderer Stelle ist CSS natürlich wunderbar. Es bezweifelt keiner den Nutzen. Ich bezweifel aber den echten (Nicht-Techi-) Nutzen eines No-Tables-At-All-Purismus. Und bei Formularen bin ich noch unentschieden.
Vielleicht noch als Ergänzung: Ich meine schon ‘richtige’ Formulare. Nicht 5 Felder, die untereinander dargestellt werden, label links, feld rechts, kommentar rechts. Das ist in der Tat mit CSS einfacher zu realisieren.
@ sto
Ich bin mir nicht sicher, was du da kommunizieren willst. Im ersten Absatz schreibst du, Tabellen für Design sind gut, außer für Formulare. Im zweiten Absatz sind DIVs wg. Höhen und Cross-Over doch nicht so gut. Also wie bei den “Blues Brothers”: Zigarettenanzünder geht nicht: scheiß Auto. Sei’s drum.
Komplexe Formulare mit CSS sind ein Problem, korrekt. Aber: erstens sind auch komplexe Formulare lösbar , zweitens geht es auch um die Linearität und Zugänglichkeit der Inhalte, die in diesem Text nicht die ihr zustehende Rolle spielt (Thema Barrierefreiheit). Mal eben eine Tabelle aus dem Editor aufziehen, alles reinfeuern und fertig, dafür sind Tabellen tatsächlich “einfacher”. Wo steht denn ein halbwegs ernst zu nehmender Text von “Leute die HTML-Tabellen komplett für ein Ãœbel halten – ja schon selbst da, wo sie tats. mit tabellarischem Inhalt zu tun haben” ?
Tabellen sind für Daten, das war 1995 so, dass ist heute auch so.
Und so ein “Geeier” ist das Handling von CSS nun wirklich nicht mehr. Das Web quilt förmlich über mit Datenbanken, vorgefertigten Code/CSS-Schnipseln, Tutorials für Anfänger, Template-Sammlungen, Baukastensysteme, Frameworks, und oft alles inklusive der IE-Hacks.
Also: wenn Tabelle, dann für Daten. Komplexe Formulare in Tabellen (wenn die Tabelle denn wenigstens korrekt aufgebaut ist), wird dir auch keiner um die Ohren fegen. Für Tabellen als Designkrücke gibt es definitiv keinen ernsthaften Grund mehr. Wir schreiben das Jahr 2007.
@ Erdnah
Danke für den Hinweis, ich weiß, was Du meinst. Ich habe damals auf dem Wirtschaftsgymnasium (kurz vor dem letzten Krieg) über die Gossenschen Gesetze eine 15-Punkte-Klausur geschrieben und die ganzen Arien auch im abgebrochenen Werbewirtschafts-Studium gehabt…
Den Begriff “Brauchbarkeit” habe ich absichtlich gewählt, stammt aber nicht aus einem Wirtschaftslexikon, auch nicht aus dem nostalgischen “Kapital”, sondern aus dem Tao Te King von LaoTse:
“Dreißig Speichen enden in einer Nabe; doch erst das Loch in der Nabe bewirkt des Rades Brauchbarkeit.
Ton knetend bildet man Gefäße; doch erst ihr Hohlraum gibt ihnen Brauchbarkeit.
Mauern, von Fenstern und Türen durchbrochen, bilden Räume; doch erst die Leere des Raums gibt ihnen Brauchbarkeit.
So gibt das Stoffliche zwar Eignung, das Unstoffliche aber erst den Wert.”
“Im ersten Absatz schreibst du, Tabellen für Design sind gut, außer für Formulare.”
Ich merke schon, da gibt es ein Missverständnis. Es ist nämlich genau umgekehrt. Ich bin einverstanden mit den Sachen hins. Tabellen als Designkrücke, also mit deinem Text. Zweifel habe ich dort, wo ich bei Formularen aus Prinzip auf Tabellen verzichten sollte. Technisch gesehen, kann ich dir auch zustimmen. Aber in der Prinzipfrage wird die Notwendigkeit verabsolutiert. Dann macht man es, weil man es macht und nicht weil man es braucht. Purismus ist schön und gut, aber nicht immer zweckdienlich, zumindest wenn der Zweck nicht der Purismus ist, den man sich dann noch mit vom eigentlich Problem losgelösten “Pauschal”-argumenten schön redet. Man macht’s halt heute so.
Naja und dass wir 2007 schreiben, ist kein Argument. Dadurch, dass etwas nicht zeitgemäß (alt) ist, wird es nicht falsch oder richtig. Das Moderne ist nicht immer unbedingt gut. Das Gute nicht immer modern.
@ sto
ja, da hatte ich tatsächlich einen Dreher:
Es sollte natürlich heißen “Im ersten Absatz schreibst du, Tabellen für Design sind schlecht, außer für Formulare.”
Zu allem anderen ist genug gesagt.
[...] sehr guter, ausführlicher Artikel und eine Argumentationshilfe zum Thema, die nicht nur für Webdesigner von Interesse sein [...]
[...] Webstandards und Kundenansprache – Webstandards auch Unbeteiligten [...]
Ein sehr gelungener Artikel, Gratuliere.
Sehr guter Artikel. Vielen Dank! Leider ist ein Großteil der Kunden völlig beratungsresistent. Trotz allem liefert der Beitrag gute Argumente.
[...] Nils Poker herrvorragenden Artikel über “Webstandards und Kundenansprache” weist er darauf hin, wie man die Vorteile [...]
[...] dem Lineal am MonitorWebstandards und KundenanspracheFiaker-Boliden auf dem NürburgringDas Internet – ein [...]
Als qualitätsbewusster Webworker ist man ja fast in Webstandards verliebt und möchte der jeden gerne sagen, wie toll Standards doch sind.
Ich würde vor dem Kunden aber nicht zu techniklastig argumentieren. Für die meisten Kunden sind das eh böhmische Dörfer, vorausgesetzt man spricht mit einem Kunden, der ein gewissen Background mitbringt. Das viele Webseiten einer Katastrophe gleichkommen, kann man ja immer wieder sehen.
Aus meiner Sicht sollte man den Kunden nicht zu sehr zutexten. Lieber dem Kunden zuhören und erzählen lassen, was er möchte und welche Wünsche er hat. In den richtigen Momenten nachharken und Lösungen skizzieren.
Was nutzt es wenn ich dem Kunden die ganzen Vorteile standardkonformer Webeentwicklung erklärt hat, er das aber gar nicht hören wollte. Ich bin der Meinung lieber den Kunden sprechen lassen als selber zu viel quasseln.
Kunden sind ja oft so verschieden und manchesmal auch schwer zu berechnen. Kunden möchten doch eher das man sich in Ihre Lage versetzen kann.
@Erdnah
Die Frage ist doch was will der Kunde !?
@ Peter,
Nochmal: Es geht ja darum, den Kunden anhand seiner Anforderungen und Wünsche die Vorteile von Webstandards zu erklären, nicht darum, ihm zu erklären, dass Webstandards toll sind oder gar, was das bedeutet. Du hast ja selbst geschlossen mit dem Hinweis “Die Frage ist doch was will der Kunde?”
Natürlich sollte man so professionell in der Kommunikation vorgehen, dass man seinen Kunden nicht “volltextet”. Das setze ich allerdings bei den Webentwicklern und -designern als Leserschaft dieses Beitrages voraus.
Tatsächlich gibt es situationsbedingte und kundenspezifische Voraussetzungen, die technische Erklärungen und Argumentationshilfen notwendig machen.
Situationsbedingt ist z. B. das parallele Angebot eines Tabellenfricklers, das auf den ersten Blick günstig erscheint, aber aufgrund Umsetzung, Technik und Qualität im Vergleich zur standardkonformen Website vollkommen überteuert ist. Kundenspezifische Voraussetzungen sind dagegen die konkreten Nachfragen zum eigenen Angebot. An diesen Punkten ist gerade die Kommunikationsschnittstelle, an der sich dann viele Webdesigner eben doch in der Technikverliebtheit ihrer Argumentation verlieren.
@Nils
Vielleicht habe ich mich eine wenig missverständlich ausgedrückt.
Ausführungen wie toll Webstandards sind machen nur begrenzt Sinn, ganz klar.
Ich erlebe es halt immer wieder das Kunden mit technischen Details “zugetextet” wurden und letztlich nicht viel verstanden haben. Du sagst ja selber, viele Webdesigner verlieben sich in die Technikverliebtheit ihrer Argumentation.
Deine Argumente sind auf jeden Fall brauchbar und hilfreich. Wichtig ist, dem Kunden vermittlen zu können, welchen (Nutz) Wert die Seite für ihn hat.
Einen Punkt hast du aus meiner Sicht noch in deiner Liste vergessen. Hintergrund Informationen zum Kunden und seinem Business einholen. Wie sieht z. B. die Wettbewerbslage aus, vielleicht hat er einen Geschäftsbericht veröffentlicht. Ein paar Angaben seitens der IHK zum Standort. Welche Mitbewerber hat er.
Kunden fühlen sich verstanden, wenn Sie merken, man hat sich mit Ihrem Geschäftsfeld beschäftigt und kennt vielleicht auch ein wenig die Probleme in der Branche.
Hallo Peter,
Du hast recht, zu einem ausführlichen Kundengespräch gehören noch zahlreiche Checklisten, Fragen und Hintergrundinfos, die alle für den erfolgreichen Abschluss weitaus wichtiger sind als die technischen Hintergründe zur Umsetzung einer Website, um die es in diesem Beitrag ausschließlich ging.
Danke, das ist wirklich einiges an Lesestoff! Bzgl. der Kundenansprache gibt es wirklich einiges zu beachten, deshalb vielen Dank für die gute & sinnvolle Aufbereitung!
Ich kann nur zitieren, was ich bei Webkrauts.de schon gemeint habe, undzwar, dass andere Branchen schon längst umgedacht haben. Nur viele Programmierer haben einfach das Problem, dass Sie schlechte Verkäufer sind.
Welcher Porsche Händler macht schon den Motor auf und erklärt? Da werden Emotionen verkauft.
[...] machen. Was eine Lektion ist, die nicht nur Webdesigner und Programmierer oft zu wenig beherzigen. Webstandards und Kundenansprache hat den Untertitel Eine Argumentationshilfe für ein besseres Web und wird hoffentlich von ganz, [...]
[...] Pooker widmet sich in einem umfassenden Artikel dieses Problems. Herausgekommen ist eine “Argumentationshilfe für ein besseres Web”. [...]
[...] pooker.blog habe ich einen interessanten Artikel gefunden, der sich mit Kunden und dem Thema Webstandards auseinandersetzt. Leider denken immer noch viel zu viel Kunden, dass dies kein wichtiges Thema ist und nur unnötig [...]
Standardisierung zum Thema Website, das ist ein interessanter Ansatz. Mich würde dazu interessieren, warum es gerade diese Kriterien sind. Ist das eine Art allgemeiner Kanon?
[...] einem sehr ausführlichem Artikel nimmt sich Nils Pooker dieser Problematik [...]
[...] so ist, wie …“ Ansatzweise hatte ich diese Möglichkeiten schon in einem älteren Blogbeitrag „Webstandards und Kundenansprache“. Wenn wir von HTML-Dokumenten sprechen, ist zum Beispiel der Vergleich mit Textdokumenten [...]