Ein Pfau in der Website

tempa wrote this 05:26:

Browser-Statistik

Dieses Template hat viel Spaß gemacht und war einmal von dem ausprobieren und dieser und jener Suche nach der idealen Form, relative schnell geskriptet, bis es zu dem Test im IE Mac kam und ich wieder den Frust bekam, denn bis zum Blick in den Mac, schien alles Perfekt. Das Design verwendet so gut wie keine Hacks, einmal von dem height: 100%; den man nun einmal für den IE braucht abgesehen.

Und dann kam der Mac-Test und es sah schon abenteuerlich aus. Ich hoffe, dass es sich nur um eine Vererbungsgeschichte handelt, wo keine Vererbung sein sollte, denn dann wäre mit der Anweisung im IE-Mac-Style auch schon wieder die Welt in Ordnung. Aber ich wollte doch mal wissen, wievielen Nutzern ich ca. eine Aufforderung schicke, endlich einen anderen Browser zu verwenden. Bitte.

Wie viel Mühe lohnt noch?

Browser-Statistik

Nach dieser Statistik vom Januar/Februar 2006 sind es ca. 0.3% der Nutzer.

In meiner Statistik tauchen Mac-User nicht auf. Nicht weil diese nicht auf meiner Site zu finden wären. Ihr Anteil ist nur zu gering, dass Sie es in die Top 15 schaffen. Wenn ich also Seiten lasse wie sie sind, so chaotisch und irgendwie kaputt, dann werden die 0.3% Mac IE Nutzer auch noch verschwinden.

Als den Netscape 4 dieses Schicksal traf, zählte ich auch zu den Nutzern, die noch lange, lange lange an diesem Browser klebten, aber als immer mehr Seiten auf mich und meine Browser-Präferenz pfiffen, da habe ich irgendwann gewechselt und nie mehr zurückgeblickt.

Irgendwann kommt die Zeit, da macht man nichts gut, wenn man noch Rücksicht nimmt. Es macht die Entwicklung teurer und da man ohnehin nicht alle Browser und alle Systemkonfigurationen berücksichtigen kann, ist es nur konsequent, wenn man eine Entscheidung trifft. Ich treffe diese Entscheidung von Template zu Template neu. So ganz den Mac IE zu ignorieren, kann ich mich nicht wirklich durchringen, obwohl alle Sites, die Struktur und Layout strikt trennen eh immer benutzbar sind. Also keiner in die Röhre schauen muss.

Die Vorteile liegen auf der Hand und im Fall des Pfaus, gibt es vieles, das positiv erwähnt werden kann, wie z.B. das das Design liquid ist, d.h. es passt sich seiner Umgebung an und ist sehr lange ein ausgewogenes Design. In eingen Bereichen ist das Design so simpel, dass eine Anpassung leicht möglich ist, sei es der Hintergrund oder die Zielelemente, die in der Diagonalen sich auf der Website befinden. Der Pfau geht mit der Site nach unten, während die Feder dort am Header hängen bleibt.

Das Design sieht auch drei Schritte vom Monitor entfernt noch bärenstark aus, d.h. Seiten, die nur einen kurzen Textblock haben, machen auch auf die Entfernung mächtig Eindruck und locken den Besucher an. Sitzt man mit der Nase am Bildschirm davor, erschlägt es trotzdem nicht. Die Reihenfolge ist in diesem Template mal wieder wie konventionell üblich, also die Links tatsächlich oben, doch rechne ich nicht mit einer exorbitanten Tiefe bei der wahrscheinlichen Klientel für eine solche Website und dann ist die Reihenfolge goldrichtig.

Ich bin nicht immer so zufrieden mit der Arbeit, wie in dieser, jetzt bin ich auf die Reaktion gespannt.

Das Template gibt es schon in der Templaterie zu kaufen. In den letzten Tagen ist in der Templaterie viel los. Fast täglich gibt es aktuell ein Update und der Trend schein noch eine Weile anzuhalten. Mal sehen, wie lange ich dieses Tempo durchhalte. Solange es so Spaß macht … No problem. Ich habe jetzt auch endlich die Template-Serie online, die anläßlich eines Wunsches eine Autohändlers entstand. Und weil ich es hier noch nicht geschrieben habe: Jutta Kemperle ist dem Team um die Templaterie zugestoßen. Ihr erstes Web-Template-Design spricht die Wellness- und Kosmetik-Branche an. Ich mag ihre frischen Farben in dem Design.

Weil ich gerade wegklickte

tempa wrote this 14:07:

Ich war auf der Suche noch einem Statistik-Script und surfte so hier und surfte so da und bin sicherlich gedultdige, wenn ich nicht nur rumdaddle. Aber wenn Ihre Seite mich auf der Startseite gefangen hält, weil Sie wollen, dass ich Ihr gesamtes Portfolio zur Kenntnis nehme, dann klicke ich das rote Kreuzchen neben der Lasche ihre Seite fliegt aus der engeren Auswahl, meist ist sind dort in meinem kleinen Firefox soviele Laschen sichbar, dass ich meine Ungeduld nicht bereue und etwas geeignetes finde.

Es ist ein Unfug zu glauben, dass der interessierte User die Geduld schon aufbringen wird. Vorallem der Firefox hat die unangenehme Eigenschaft, dass er sich beim Laden von großen Dateien auch bei DSL mit 1GB/s schon einmal für Sekunden eine Auszeit nimmt. Mein Zorn richtet sich dann nicht gegen Firefox, sondern gegen die Arroganz des Anbieters der Seite, der glaubt mit einem fetten Flash und Skip-Intro sei die Welt in Ordnung. Ich mag den FF aus verschiedenen Gründen benutzen. Die Flash-Intro verpasst die Chance mir zu zeigen, warum ein Besuch lohnt. Und Tschüss!

Zugegeben derjenige, der diese Intro-Seite, die mich zu diesem Beitrag veranlasst hat (nein einen Link gibt es nicht), ist eine Flasche, denn der Skip-Link hätte in jedem Fall also auch nach dem Start des Flashs funktionieren können.

Warum aber Anbieter überhaupt das Risiko eingehen, Besucher zu verlieren, nur weil diese nicht die Benutzervoraussetzungen an die Site erfüllen, wird mir ein Rätsel bleiben.

Ladezeiten – eine Überlebensfrage

tempa wrote this 00:13:

Webdesign in Bezug auf Dateigröße ist eine Frage von Leben und Tod.

Direktlink YouTube: Filesize matters

Überinterpretiert

tempa wrote this 00:19:
Rechte und linke Gehirnhaelfte
  • Körpersprache – Bildsprache
  • Intuition – Gefühl
  • Kreativität – Spontanität
  • Neugier – Spielen – Risiko
  • Synthese – Überblick
  • Kunst – Tanz – Musik…
  • Ganzheitlich
  • Zusammenhänge
  • Raumempfinden
  • Sprache – Lesen – Rechnen
  • Ratio – Logik
  • Regeln/Gesetze
  • Konzentration auf einen Punkt
  • Analyse – Details
  • Wissenschaft
  • Schritt für Schritt
  • Einzelheiten
  • Zeitempfinden
Sekundär-Quelle: Hispanoteca: Hirnhemisphären

Jetzt muss man sich noch vor Augen halten, dass wir alles über Kreuz sehen und dann kommt man auf upuauet.com zur der Auffassung, dass die Navigation Links sein muss, weil …

Gestaltungskonsequenzen

Nimmt man diese Erkenntnisse als Gestaltungsgrundlage, so ergeben sich daraus Notwendigkeiten für die Anordnung von Navigation, Bild und Text. Da wir in unserem Kulturkreis von links nach rechts lesen, beginnt die rechte Gehirnhälfte (linkes Auge) ihre Arbeit demnach zuerst. Da diese Gehirnhälfte für die Orientierung und Bilderkennung zuständig ist, sollten sich Navigationselemente auf der linken Seite befinden.

Da wir nicht gerade mit einem Tunnelblick (krankhaft- und altersbedingt vielleicht schon) auf eine Seite blicken, wobei man selbst bei einem Tunnelblick in den meisten Fällen die die Fläche eine Bildschirms überblicken kann, ist diese Theorie a bissl … naja!

Solange die Navigation als solche ins Gesamtbild passt, darf sie ruhig links, rechts, mitte unten und oben sein, eben so wie es passt. Aber nett, dass wir es mal wieder gewahr wurden.

Kollegenschelte — pffh! Old School

tempa wrote this 23:55:

In Fellbach, in dem Städtle knapp vor Stuttgart, was man noch als Nachbarschaft bezeichnen könnte, ist eine Website neu „gelauncht“ (also scharf gemacht / hochgeladen) worden. Gleich mal gucken woll’n. Aber nee, da haut man eine Pressemeldung raus und investiert ein wenig Asche, aber statt, dass man dem Kunden einen Link gönnt, … Dafür scheint es nicht gereicht zu haben. Als würde der Link extra kosten (Pffffh). Also gut, erst einmal recherchiert. Jaha. Und wer den selben Presseverteiler nutzt wie ich, kann ja gerne nachsehen, wen ich meine. Spezifischer werde ich an dieser Stelle nicht.

ReissackWie langweilig. Wieder eine Website mit Blähungen und das, obwohl es doch eigentlich schon sehr gut ohne geht. Naja. Noch ist das eben der Alltag. Und alles ist eine Presse- Meldung wert. (Was weiß, der Kunde schon? Der hat doch keine Ahnung, ne?)

Der Reissack, so wurde berichtet, sei mit einem dicken Plumps auf eine Ameise gefallen!

Also wenn Ihre neue Website zur Abnahme im Netz steht, dann schauen Sie in den Quelltext. Wenn Sie eine Tabelle (erkennbar am <table>-Marker) in einer Tabelle in einer Tabelle sehen (zu erkennen, wenn der Marker drei Mal hinter einander folgt ohne, dass zwischen rein einmal ein / vor dem table in der spitzen Klammer steht.), wie z.B. hier in der niegelnagel neuen Website, dann monieren Sie.
3-fache Schachtelung der Tabelle

Wenn Sie an anderer Stelle ein <P><SPAN class=headline> entdecken, lassen Sie nachprogrammieren. Wenn das CMS keine echten Überschriften (erkennbar an <h1> bzw. h2, h3, h4, h5 oder h6 in spitzen Klammern) beherrscht, nutzen Sie es nicht. Alles was eine Überschrift ist, sollte auch als solche ausgezeichnet werden. Übrigens: Überschriften nicht als Überschriften auszuzeichnen, war schon vor zehn Jahren ein sehr schlechter Stil.

Jeder Konkurrent, der Ihnen das und mehr voraus hat, wird besser gefunden. Tja. Das Leben ist hart, wenn man nicht auf dem Laufenden ist und der betreuenden Agentur blind vertrauen muss. Dann kommt eine Meldung raus, die im nächsten Moment im Blog aufgegriffen wird und die schöne Meldung nicht gerade im schönsten Licht erscheinen lässt.

Apropos: A List apart und das Thema barrierefreies Webdesign

tempa wrote this 00:53:

Die Suchmaschine ist wie eine virtuelle Stadt mit verschiedenen Zentren. Wie in der Einkaufspassage in der Großstadt ziehen große und kleine Scharen von Passanten durch. Einige Bummeln rein aus Vergnügen andere verfolgen konkrete Vorhaben. Hierbei kommen sie an Schaufenstern vorbei und nehmen eine Vielzahl von Eindrücken mit. Soweit zur Realität — übertragen wir dieses Verhalten in den virtuellen Raum des Internet: Die Straßen der Städte werden im Netz von den Suchmaschinen gebaut. Die Schaufenster der Suchmaschinen-Passagen sind die Textausschnitte aus Ihrer Website und die im im Quelltext eingebetteten Bilder, welche die Sucher per Suchbegriff aus dem Datenbankindex der Suchmaschine abrufen.

Kommen Kunden in den Laden — respektive auf die Site, ist Design, Text und der Grad der Eineindeutigkeit in den Aufforderungen entscheidend für den Erfolg der Site.

Neben dem Inhalt einer Seite selbst sind Suchmaschinen die Helfer schlechthin, um möglichst zahlreiche Gäste auf der eigenen Site begrüßen zu dürfen. Die Zahl der Besucher, die über die Suchmaschine auf Ihre Website stoßen, nennt man Konversionsrate. Je höher die Konversionsrate, desto größer auch die Zahl derer, die auf Ihrer Website das Gesuchte finden und Ihre Waren und Leistungen kaufen.

Suchmaschinen verarbeiten ausschließlich den Quelltext.

Schnell wird hierbei vergessen, dass Suchmaschinen nur den Quelltext einer Seite verarbeiten und davon primär die HTML-Teile verarbeiten. Es macht daher Sinn eine Seite mit den Augen einer Suchmaschine auf seine Lesbar- und vorallem Verwertbarkeit hin zu überprüfen. Diesem Thema widmet sich nun auch A List apart aktuell in einem Beitrag (Engl.).

Ein herrlicher Anlaß noch einmal an meinen Beitrag vom Mai 2005 😉 zum Thema zu erinnern: Barrierearmut: Optimieren mit Fang
Mit der Firefox-Erweiterung Fang können Sie jede Seite bequem über das Kontextmenü mit den Augen der Suchmaschine betrachten. Die Erweiterung für Ihren Firefox ist schnell und einfach installiert.

Die Optimierung auf Barrierearmut hilft gleichzeitig die Site schneller zu machen. Achten Sie bei der Seite auch auf Alt und Title bei Bildern, da Google Bilder nicht interpretieren kann und daher auf ALT-Texte angewiesen ist. Fehlen diese werden Bilder nach ihrem Dateinamen und dem umgebenden Text bewertet. Je weniger Grafiken, die dem reinen Layout dienen, in dem Quelltext eingebettet sind desto besser für die Bewertung des Inhaltes ihrer Seite. Diesbezüglich hat der Disney Store UK jetzt vor dem Weihnachtsgeschäft ganz frisch eine bittere Lehre ziehen müssen, als dieser kürzlich zu den veralteten Layouttabellen zurückkehrte und eine mehr als überflüssige Layoutgrafik namens „Image Spacer“ zum wichtigsten Begriff der Website vom Google-Index gekürt wurde.

Der weitere Vorteil mit CSS-Design ist, dass Textergebnisse mit verschiedenen Layouts schnell umgesetzt werden können und so der Erfolg auf allen Ebenen systematisch erreicht werden kann.

Herzlichen Dank an Robert Basic, der mit seinem Link zum Beitrag hilft, die Bedeutung barrierearmer Seiten bekannt zu machen. Man kann es gar nicht oft genug sagen.

Weiterhin möchte ich die Lektüre bei Google empfehlen: Richtlinien für Webmaster

ANZEIGE

Gute Websites — stark im Onlinemarketing, barrierearm und rasend schnell — erhalten Sie in der Templaterie (Deutschland) und von creisi productions (Schweiz)

Anmerkung: Barrierefreiheit ist eine Illusion, weswegen ich barrierearm dem Begriff barrierefrei vorziehe.

Wie der Validator denkt

Claudia Reiser wrote this 10:37:

Manuel Bieh hat einen Workshop zum Umgang mit dem Validator vom W3C gemacht. Erklärt werden darin, was die Fehlermeldungen des Validators bedeuten und wie solche Fehler behoben werden können. Nützlich für alle, die öfter mal rätseln, was der Validator denn jetzt mit den teils cryptischen Fehlermeldungen überhaupt sagen will.

Nicht mehr wichtig?

tempa wrote this 21:17:

Summing up

We have tried hard to make this site the best that it can be for as many different people as possible. We hope that you enjoy visiting it. We would love to know what you think of our site and would welcome your comments.

Happy shopping,

The web development team.

Quelle: Aus dem Archiv.org das
Missionstatement des Webdeveloperteam von
Disney Store UK vor dem Relaunch

Siehe auch: Fallstudie Disney

Es hat sich mit dem Relaunch des Disney Stores UK einiges verändert. Unter anderem ist die Seite aus dem Webarchiv heute ein 404. Und dieser Anspruch dürfte auch nicht mehr gültig sein. Denn wenn man den Stimmen des Netzes lauscht zum Thema Relaunch, wird klar, dass es nicht um Qualität ging. Diese blieb auf der Strecke.

Jens Grochtdreis über den Relaunch:
„Eine Maus lehrt mich das Fürchten“

Unbedingt auch die Links im Artikel von Jens Grotdreis verfolgen.

Und noch eins, das man beim Design beachten sollte:
Google meldet was relevant im Disney Store UK ist. Weihnachten 2005 ist es das Spacer Image
via malarkey of mice and men — no coment

Genau: Google-Engines werten die Seite aus und geben das Ergebnis nach seiner Relevanz aus und das heißeste Thema im Disney Store UK ist das Spacer Image, das bewirkt, dass die Tabellenzellen korrekt angezeigt werden können. Das finde ich göttlich. Besser kann man eigentlich nicht mehr demonstrieren, warum Design immer auch eine Frage des Quelltextes ist.

Qualitätsprüfung für eine Website

tempa wrote this 14:42:

Haessliche Website
Im Netz begegnen uns viele Websites. Manche sind einfach unbeschreiblich schön und andere sind einfach unbeschreiblich häßlich. Naja vielleicht nicht ganzso unbeschreiblich. Aktuell überarbeite ich für eine Online-Studie einen Excel-Prüfbogen und da ist mir ein sehr schönes Exemplar von einer häßlichen Website begegnet. Wer nun die Website kennt, möchte bitte schweigen und nicht verlinken. Es geht ums Prinzip und nicht um diese Website im speziellen. (mehr …)

Screendesign von Printdesignern

tempa wrote this 20:21:

Printdesigner Layout

Viele Unternehmer nehmen ihre Werbeagentur, um auch die Gestaltungsaufgaben im Web zu leiten. Als Webagentur steht man nun vor der Aufgabe, diese für Print eineindeutige Vorlage, auf die Variabilität des Screens umzusetzen. (mehr …)

Recent Comments:

  • Silke schümann { Du warst auf dieser Seite: Step1 zur Archiv-Thumbgalerie via Custom fields Marke Eigenbau http://templaterie.de/blog/931/step1-zur-archiv-thumbgalerie-via-custom-fields-marke-eigenbau/ Hier war ich noch am Basteln. Ich fürchte meine PHP-Kenntnisse sind... } – Aug 26, 9:29 AM
  • Andreas { Hey, ich habe den Code wie oben benutzt und auch $dgal = get_posts('category=1′); on der richtigen Zeile eingesetzt nur bei mir läufts immernoch nicht. Kann... } – Aug 26, 3:20 AM
  • Fred { "wer Smarty lernt, kann tatsächlich gleich auch PHP mitmachen, ich hatte es eine zeitlang auch eingesetzt, aber jetzt mach ich es wieder auf meine art... } – Jan 06, 7:14 PM
  • Silke Schümann { Das klingt nach einem Syntaxfehler in der ersten Zeile. Anführungszeichen korrekt? Und das Plugin funktioniert nur innerhalb von Editland. Die index.php ausserhalb von Editland aufzurufen... } – Jun 18, 3:40 PM
  • Jörg { Hallo, ich habe die index.php im ersten Abschitt Nr. 3 beschrieben, angelegt. Beim Aufruf der Seite wird folgende Fehlermeldung angezeigt: Parse error: parse error, unexpected... } – Jun 18, 3:14 PM
  • Michael { Gern geschehen 😉 } – Mai 29, 2:31 PM
  • Silke Schümann { Jepp. Das war's: ES tut! Lösung ist nun in einem eigenen Beitrag: Step1 zur Archiv-Thumbgalerie via Custom fields Marke Eigenbau Fertig und betriebstüchtig! 🙂 } – Mai 29, 1:25 PM
  • Michael { Wie wäre es, wenn Du die Zeile $dgal = get_posts('category=1'); auslagerst und den Rest in eine Funktion packts, der Du $dgal übergibst. Das wäre auch... } – Mai 29, 12:45 PM
  • Silke Schümann { Ich ziehe diees Variante ebenfalls vor, dovh wenn ich Code übernehmen, dann ändere ich hierfür nicht extra. Es dürfte gehzpft wei gesprungen sein, welche man... } – Mai 29, 2:00 AM
  • Ulf { ich würde bei der Syntax für Schleifen konsequent die C-ähnliche Variante mit geschweiften klammern nehmen, nicht die alternative mit Doppelpunkt und "endwhile" bzw. "endforeach". } – Mai 29, 12:00 AM
  • Silke Schümann { Ich habe ich http://franchie.de die Thumbs in der Sidebar erfolgreich ausgelesen. Ansonsten ist die Test-Umgebung unter 1a-test dot de / blog Ich will diese Adresse... } – Mai 28, 11:37 PM