Webagentur Themen wie Webdesign, Suchmaschinenoptimierung und CMS

Bereit für HTML5?

Oliver Schmid — Tue, 22 Mar 2011 10:03:40 +0000

Es ist soweit, ab sofort setzt Webgarten alle Kundenprojekte mit HTML5 um, sofern nicht explizit etwas anderes gewünscht wird.
Offiziell empfiehlt das W3C zwar noch XHTML, allerdings gibt es keinen wirklichen Grund dafür. Der W3C Validator kann bereits sehr gut mit HTML5 umgehen. Als Vertrauensbeweis habe ich die eigene Website bereits mit HTML5 umgesetzt. Ein weiterer Vertrauensbeweis erbringt niemand geringerer als Google. Hier wird HTML5 schon länger eingesetzt, was ein Blick in den Quellcode von Google beweist. Und da Google selber HTML5 verwendet dürfte das Unternehmen auch nicht abgeneigt sein, HTML5 Dokumente gut positioniert im Suchresultat anzuzeigen. Die semantische Auszeichnung könnte Google bei der Einschätzung sogar helfen.

Anwender zeitgemässer Browser sollen von neuen Funktionen profitieren, sofern diese bei alten Browsern keine Probleme verursachen.

So sieht ein HTML5 Dokument aus:

`Ich bin supersexy HTML5 Code`
`Und verzichte auf unnötige Dinge`
`Weniger ist mehr!`

Die End-Tags braucht es nicht mehr und beim body kann sogar das Start-Tag weggelassen werden.

Die Vorteile von HTML5

Schlanker Code und schnellere Ladezeiten

Semantische Auszeichnung (Neue Selektoren wie: nav, head, aside, menu, article usw.)

Zahlreiche neue Funktionen, welche teilweise schon genutzt werden können

Für die Zukunft gerüstet, es braucht künftig keine Umstellung mehr da HTML5 fliessend wächst

Lesetipp zu HTML5

Das HTML5 Buch kann ich empfehlen. Es hat mir als Vorbereitung für das Redesign von Webgarten gedient und mich definitv von HTML5 überzeugt.

Nachtrag: HTML5 versus XHTML

Speed Optimierung für Websites

Oliver Schmid — Fri, 18 Mar 2011 13:10:32 +0000

Google hat längst bestätigt, dass die Geschwindigkeit einer Webseite nun auch ein Faktor für die Platzierung einer Website im Suchergebnis ist. Zudem hat Google eine eigene Firefox Erweiterung (Google Page Speed) für Firebug herausgegeben, welche den Programmierer bei der Optimierung helfen soll. Gut möglich, dass dieser Faktor noch an Einfluss gewinnen wird. Gemäss dem Chef Technicker der Firma Blaze Software sei Google bezüglich Geschwindigkeit absolut fanatisch.
Auch wenn der Geschwindigkeitsunterschied vielleicht nicht direkt bemerkt wird, so bleibt einem eine schnelle Website unbewusst doch in besserer Erinnerung und man besucht sie gerne wieder. Technisch gesehen braucht eine optimierte Website weniger Server Ressourcen und verursacht weniger Traffic.

Meine Erfahrung mit Speed Optimierung?

Kürzlich habe ich die Website der Webagentur Webgarten (ruhig mal testen) neu erstellt. Da Design und Inhalt übernommen wurden konnte ich mich voll auf einen sauberen, zeitgemässen und speed optimierten Code konzentrieren. Danach war die Website 2x schneller beim ersten Aufruf und 20x schneller beim zweiten Aufruf (gemessen mit PageTest). Am Server wurde nichts verändert. Hier meine Tipps:

Geschwindigkeit hängt nicht vom CMS ab. Wer eine wirklich schnelle Website will muss eine Cache Erweiterung verwenden. Diese produziert regelmässig ein statisches HTML File aller Seiten. Dieses wird dann beim Aufruf der Webseite angezeigt. Dadurch wird das langsame “on the fly zusammenbauen” der Website verhindert. Die Website wird massiv schneller und benötigt weniger Rechnerleistung.
Progressive Enhancement: Nutzer neuer Browser sollen von neuen Funktionen profitieren können solange diese auf alten Browsern keine funktionalen Probleme verursachen. Ich verwende HTML5, welches einige kürzere Tags zulässt.
Um unnötige Requests zu vermeiden verwende nur je ein JavaScript und CSS File. Im HTML Code sollen alle Kommentare und Umbrüche entfernt werden. Zudem sollte man das CSS komprimieren.
JavaScript und CSS sollten auf der Seite nur eingebunden werden, wenn diese wirklich benötigt werden. Es macht keinen Sinn, wegen eines Formulars die ganzen CSS Anweisungen auf allen Seiten zu laden. Auch ein JS Framework wie jQuery muss nur dann geladen werden, wenn es auch gebraucht wird!
Optimierung mit Google Page Speed. Einfach die Seite mit dem Plugin testen und den Anweisungen folgen. Hier kann einiger Aufwand anfallen. Alle Punkte müssen am Ende grün sein!
Testen mit PageTest
Überwachen mit Google Webmasters Tools

Werden die Kunden für all den Aufwand bezahlen?

Bei meiner Site habe ich wohl etwa 2 Tage für Speed Optimierung eingesetzt. Bei komplexeren Projekten kann der Aufwand sogar noch wesentlich grösser werden. Insbesondere die Cache Erweiterung kann in Kombination mit anderen Erweiterungen Probleme verursachen.
Oft findet der Kunde seine eigene Website bereits schnell, denn diese ist intern längst gecached oder die Website liegt sogar auf einem Server innerhalb des eigenen Firmennetzwerk.
Soll man den Aufwand trotzdem betreiben? Ja, ich denke man sollte es dem Kunden als Option offerieren. Will er über die Website Umsatz generieren wird er wohl künftig darum nicht herumkommen. Ist die Website nur da um die Adresse nachzuschlagen benötigt er sicher keine Speed Optimierung. Was denkt ihr darüber?

Es ist wie wenn ein Formel1 Fahrer vor dem Rennen nochmals das letzte Staubkorn entfernt. Es mag überflüssig erscheinen, aber es kann am Ende zwischen Sieg und Niederlage entscheiden.

TYPO3 versus Joomla

Oliver Schmid — Thu, 23 Sep 2010 09:32:25 +0000

Vergleiche zwischen dem CMS TYPO3 und Joomla sind meist recht einseitig. Viele arbeiten nur mit einem CMS und schauen das andere nur oberflächlich an. Ich habe zahlreiche Joomla Projekte umgesetzt. Nun habe ich ein Buch über TYPO3 gelesen und ein kleineres Projekt damit umgesetzt. Hier möchte ich meine Erfahrungen wiedergeben.

Das TYPO3 Backend

Das Joomla! Backend

Was das Design des Backends betrifft hat sich bei den letzten TYPO3 Updates einiges getan. Das typische “Programmierer” Design wurde überarbeitet und die Usability verbessert. Heute macht die Oberfläche einen äusserst soliden Eindruck auf mich.
Was bei Joomla auffällt ist der fehlende Seitenbaum. Joomla trennt Artikel von der Navigation komplett was bei Anwendern zu Usability Problemen führen kann. Die Inhalte sucht man über die Tabelle nach Titelbezeichnung mittels Filter.
Die Inhalte sind bei TYPO3 in Blöcke aufgeteilt welche flexibel zugeordnet werden können und sich vom Typ unterscheiden. Diese können auch referenziert werden, so dass der gleiche Block mehrmals vorkommen kann. Joomla! kennt nur einen Artikel “Block” pro Seite. Dafür können jeder Seite Module zugewiesen werden. Dafür muss man allerdings in den Modul Manager wechseln.

Vergleich: TYPO3 Funktionen versus Joomla Funktionen

Selbstverständlich können alle Funktionen praktisch immer durch Erweiterungen hergestellt werden. Allerdings führt dies zu zusätzlichem Aufwand. Zudem erschwert es künftige Updates. Folgende Funktionen sind in der Grundausstattung dabei:

Funktion	Joomla!	Typo3
Zufalls Modul	Ja	Nein
Umfrage Modul	Ja	Nein
Verschlüsselung Email Adressen (Anti-Spam)	Ja	Ja
Editieren über das Frontend	Ja	Ja
Suchfunktion	Ja	Ja
Cache System	Ja	Ja
Zeitgesteuertes Verwalten von Inhalten	Jein	Ja
Vorschau Entwurfsansicht (Draft)	Nein	Ja
Internes Backup System	Nein	Ja
Verwaltung mehrerer Webseiten	Nein	Ja
Mehrsprachiges Frontend	Nein	Ja
Mehrsprachiger Adminbereich pro Nutzer einstellbar	Nein	Ja
Differenzierte Benutzergruppen-Definition und Rechtevergabe	Nein	Ja
Anbinden verschiedener Datenbanken	Nein	Ja
Versionierung	Nein	Ja
Automatisch skalieren, schärfen und komprimieren von Bildern	Nein	Ja
Automatisch umwandeln von Bildformaten	Nein	Ja
Automatisch schreiben von Bildtexten	Nein	Ja
Inhalte in modulare Blöcke unterteilt	Nein	Ja
iPhone App zur Newsverwaltung	Nein	Ja

Bezüglich Funktionen macht TYPO3 niemand was vor. Hier ist TYPO3 unter allen Open Source CMS Lösungen der klare Leader.

Vergleich des Aufwands für die Umsetzung eines Projekts

Eine TYPO3 Installation ist aufwändiger als eine Joomla Installation. Zudem sind beim Erstellen von Templates TypoScript Kenntnisse notwendig. Das macht auch die Einarbeitung schwieriger. Der Aufwand relativiert sich dadurch, dass weniger Erweiterungen installiert werden müssen.

Verbreitung des CMS

Beide CMS gehören zu den am weitesten verbreiteten Open Source Lösungen. Allerdings wird TYPO3 von Joomla bei weitem übertroffen. Aktuell findet Google 5’890’000 Ergebnisse zum Wort TYPO3. Zum Wort Joomla sind es gar 65’500’000. Damit haben beide CMS eine gesicherte Zukunft vor sich. Der Vorsprung von Joomla! erklärt sich teilweise dadurch, dass es oft bei kleinen Websites (Vereine, Privat) zum Einsatz kommt. Interessant ist auch die Grafik von Google Trend: Joomla! versus TYPO3.
Auch bei der Anzahl der Erweiterungen hat Joomla die Nase vorn. Bei Joomla! sollen es ungefähr 5’000 sein während es bei Typo3 nur 4’696 sind. Google findet für die Suche nach Joomla Extension 8 Mio. Treffer, für die Suche nach Typo3 Extension nur 5 Mio. Treffer.

Sicherheit

Seit 2006 arbeite ich mit Joomla und habe in dieser Zeit etwa 30 Webseiten damit umgesetzt. Dabei wurde einmal eine Seite gehacked. Gemäss meinem Hoster soll dies allerdings sehr häufig vorkommen. Mit TYPO3 habe ich noch nicht genügend Erfahrung. Allerdings gehe ich davon aus, dass es wesentlich sicherer ist.

Wer arbeitet mit TYPO3 bzw. Joomla?

Mit TYPO3 arbeiten hauptsächlich grössere Webagenturen. Als klassisches Enterprise Content Management (ECMS) kommt es hauptsächlich bei Firmenwebsites zum Einsatz. Joomla hingegen wird von selbstständigen Entwicklern meist für kleinere bis mittlere Websites eingesetzt. Zudem kommt es häufig bei Vereinen und privaten Sites zum Einsatz, da mit fertigen Templates sehr einfach eine kleine Webseite erstellt werden kann.

Fazit

Beide CMS Lösungen haben ihr Vor- und Nachteile. Es gibt keinen Gewinner. Je nach Anforderung macht das eine oder andere CMS Sinn.

Es gibt kein entweder-oder sondern ein sowohl-als-auch.

Was ist eure Meinung und was habt ihr für Erfahrungen mit CMS Lösungen gemacht?

Der Magento Online Shop

Oliver Schmid — Mon, 02 Aug 2010 09:00:06 +0000

Zum Wein Online Shop

Ausgangslage des Projektes

Die Bricker Weinimport GmbH beauftragte uns mit der Erstellung eines Online Shops für Weine. Dieser sollte über ein kleines Sortiment auserwählter Weine mit hervorragendem Preis Leistungsverhältnis verfügen.
Der Shop soll sich auch an Personen richten, welche wenig über Wein wissen. Entsprechend haben wir den Shop nach Essen und Anlässen strukturiert. Zu jedem Wein wurden die wichtigsten Informationen sorgfälltig erfasst. Hier wird nur verkauft, was der Anbieter selber degustiert hat und auch selber sehr gerne trinkt. Qualität statt Quantität ist das Motto.

Design des Online Shops

Eine Flasche Wein kauft man auch mit dem Auge. Der Wein sollte also ins Zentrum gestellt werden. Möglichst wenig andere Elemente sollten die Wirkung der Flasche stören. Darum wurde der Flasche bereits in der Voransicht sehr viel Platz eingeräumt. Da Weine vor allem auch von älteren Personen gekauft werden sollte zudem die Schrift genügend gross sein.

Weine Übersicht

Detailansicht der Weinflaschen

Startseite

Magento als richtig Lösung

Die Joomla Komponente VirtueMart wäre eine mögliche Lösung gewesen. Allerdings würden wir diese eher als Ergänzung zu einer vorhandenen Joomla! Webseite einsetzen. Hier war der Online Shop das Kerngeschäft und es existierte noch keine Webseite. Es galt die bestmögliche Lösung für einen Online Shop einzusetzen. Hier machte Magento das Rennen.

Suchmaschinenoptimierung mit Magento

Zu jeder Seite, Kategorie, Artikel kann man den Titel und die Meta-Description sowie die Bezeichnung der URL eingeben. Magento erstellt einem automatisch auch die Google-Sitemap und stellt einem zudem in der Konfiguration ein Feld zur Verfügung, um Google-Analytics einzubauen.
All diese Möglichkeiten wurden voll ausgeschöpft: Die On Page Optimierung am Shop wurde bestmöglich umgesetzt. Es bleibt abzuwarten wie lange es dauert bis Google die noch junge Domain ausreichend bedient.

Technische Erfahrung mit Magento

Anders als beim Joomla! CMS ist die Grundversion des Magento Online Shops bereits mit praktisch allen möglichen Funktionen ausgestattet. Nur wenige Erweiterungen müssen installiert werden.
Man definiert zuerst ein Shop-Template. Alle Files die vom normalen Theme abweichen kopiert man ins eigene Template. Man macht Anpassungen an XML und phtml Files sowie natürlich am CSS. Mit intelligenten Attributen kann man sich die Produktseite frei konfigurieren. Hier lässt Magento keine Wünsche offen.
Ziemlich aufwändig gestaltet sich hingegen das Erstellen der E-Mail HMTL-Templates. Magento versendet Versandinformation, Bestellung, Bestellaktualisierung, Rechnung, Rechnungsaktualisierung und normale Mitteilungen. Alle mit einem eigenen Template und diese muss
man doppelt anpassen weil für Gäste und registrierte Nutzer unterschiedliche Vorlagen verwendet werden. Da Header und Footer meist gleich bleiben könnte man zumindest diese auslagern.

Zum Wein Online Shop

“Magento scheint im Moment die mit Abstand beste Lösung für einen Online Shop”

Die besten Zitate für Webdesigner

Oliver Schmid — Tue, 11 May 2010 08:11:50 +0000

Die Bedeutung von Zitaten

Die Bedeutung einzelner Zitate wurde mir während des Schreibens dieses Blogs bewusst. Zitate beschreiben einen komplexen Sachverhalt auf einfache verständliche Weise und bleiben in Erinnerung.

Mit wenigen Worten bringen es gute Zitate exakt auf den Punkt.

Neue Website mit Zitaten für Webdesigner

Um diese wertvollen Aussagen angemessen zu präsentieren habe ich nun eine eigene Website erstellt. Wichtig war mir dass das Zitat im Vordergrund steht und als einzelne Seite per Link versendet werden kann. Keine Elemente sollten das Zitat stören und von ihm ablenken. Dazu habe ich den Titel und den Autor des Zitats beim Aufruf der Site verborgen. Erst nach einer Mausbewegung erscheinen diese dezent. Um auf einen “Weiter” Knopf verzichten zu können habe ich einen Tooltip eingesetzt sowie den Link auf die ganze Fläche gelegt. Dabei kam das Javascript Framework RightsJS zum Einsatz.

Habe ich wichtige Zitate vergessen oder habt ihr eigene Zitate? Ich freue mich über eure Vorschläge.

Nachtrag: Mit dem gleichen Template habe ich eine Sammlung von Warren Buffett Zitaten aufgebaut.

Die Zauberformel für Designer

Oliver Schmid — Wed, 21 Apr 2010 07:11:36 +0000

Das Buch Visual Display of Quantitiv Information von Edward Tufte ist definitv ein Muss für jeden Webdesigner und Programmierer. Es bestätigt meine Überzeugung, dass der Design Grundsatz “Form Follows Function” zu Schönheit führt. Edward Tufte hat die Zauberformel (data-ink ratio) für Designer erfunden. Für den intelligenten Designer durchaus zu vergleichen mit der Relativitätstheorie von Albert Einstein.

Der “data-ink ratio” bei Chart Grafiken sollte möglichst hoch sein. Also das Verhältnis von Informationen welche Daten enthalten (data-ink) zu Informationen ohne Daten (data-junk). Erstrebenswert ist ein möglichst grosser Anteil an data-ink. Das ist die Fläche die sich verändert wenn die Daten sich ändern, es ist die nicht entfernbare Core Grafik.

Alle Elemente ohne Daten nehmen den Daten die Aufmerksamkeit. Sie lenken ab wie Tufte in zahlreichen Beispielen aufzeigt.

Ein weiteres Beispiel sah ich in einer Präsentation von Ryan Singer, ich habe es hier nachgestellt:

Schlecht: Fokussierung auf den Rahmen, lästiges Flimmern
Gut: Fokussierung auf die Nummern (Inhalt)

Einige Statements aus dem Buch von Tufte:

Graphical excellence is that which gives to the viewer the greatest number of ideas in the shortest time with the least ink in the smallest space
Above all else show the data
Maximize the data-ink ratio
Erease non-data-ink and redundant data-ink
Induce the viewer to think about the substance rather than about methodology, graphic design, the technology of graphic production, or something else
As the art bureaucracy grows, style replace content

Every bit of ink on a graphic requires a reason. And nearly always that reason should be that the ink presents new information.

Redesign einer Chart Grafik

- 1
- 2
- 3
- 4
- 5
- 6
Hier haben wir eine durchschnittliche Chart Grafik,
so wie wir diese häufig antreffen.
Die Box kann entfernt werden.
Die vertikale Achse kann entfernt werden.
Sogar ein Teil der Balken kann entfernt werden,
um eine weisse Linie erscheinen zu lassen.
Nun können auch die schwarzen Markierungen weggelassen werden.
Die Zahlen schieben wir näher an die Balken.
Die horizontale Line kann auch weggelassen werden,
da das Ende der Balken den Abschluss markieren.

Der content-pixel ratio für Webdesigner

Das Buch wurde vor 35 Jahren geschrieben. Können Webdesigner daraus etwas lernen? Ja, sehr viel sogar! Die Grundregeln sind noch immer gültig, vielleicht mehr denn je.

Für uns Webdesigner gilt aber der “content-pixel ratio”. Ink wurde zu Pixeln und Daten zu Content. Somit ist es also erstrebenswert, wenn die Fläche an Inhalt möglichst wenig “inhaltsloser” Fläche (Dekorations Elemente) gegenüber steht. Denn jedes unnötige Element nimmt dem Inhalt die Aufmerksamkeit. Für uns heisst die Formel also:

Folgende Webdesig Regeln können wir daraus ableiten:

Jeder Pixel braucht einen Grund um am entsprechenden Ort zu sein. Und dieser Grund sollte immer die Darstellung neuer Information sein.
Lösche alle unnötigen Elemente
Es gibt keine gleich wichtigen Elemente. Weniger wichtige Elemente müssen schwächer dargestellt oder entfernt werden.
Die Inhalte müssen bereits vor der Erstellung des Designvorschlages existieren
Schönheit entsteht durch das attraktive Verhältnis verschieden langer Abstände. Man beachte den Goldenen Schnitt.
Ist man mit den Design nicht zufrieden beginnt man besser neu als dass man unnötige Dekorationselemente zufügt
Mache das Design für den Nutzer, nicht zu deiner Selbstverwirklichung
Verzichte auf unnötige Verpackungen (Boxen, Container)

Gestalte den Inhalt und nicht das “Rund um den Inhalt”

Praktische Anwendung im Webdesign Bereich

Für die Website meiner eigenen Webagentur konnte ich diese Philosphy 2005 konsequent umsetzen. Technisch zwar bereits veraltet (Table Layout), das Design jedoch zeitlos und immer noch aktuell und ich sehe keinen Grund daran etwas zu ändern. Man beachte den Data-Pixel ratio auf den Subseiten wie dieser.

Leider ist solch eine radikale Umsetzung bei Kundenprojekten selten möglich. Der Kunde denkt man spare mit einem minimalen Design Aufwand oder man könne mit Rahmen, Schatten und Boxen den schwachen Inhalt kaschieren. In 90% der Fälle liegt der Inhalt aber noch gar nicht vor. Statt auf den Inhalt konzentriert man sich dann auf das “Rund um den Inhalt”.

Weitere Informationen

Bitte beachte auch meinen Blogbeitrag zur Typografie sowie meine Kurse zum Thema Webdesign & Usability. Und wer das Buch von Edward Tufte jetzt noch immer nicht bestellt hat ist selber Schuld.

Say no to nofollow

Oliver Schmid — Wed, 14 Apr 2010 08:38:29 +0000

Gemäss Wikipedia hat Google das nofollow Tag 2005 selber eingeführt. Ziel war es, Link-Spam in Foren und Blogs zu verhindern.

Sinnvoll wäre es allenfalls um innerhalb der eigenen Website auf Seiten wie Kontakt oder Impressum zu verweisen. Leider wird es kaum so angewendet. Stattdessen wird es von fast allen verbreiteten Blog Systemen, Foren und Wikis automatisch gesetzt. Dadurch wird das Tag über kurz oder lang nichtig.

Wenn Webseitenbetreiber das Ranking bei Suchmaschinen selber zu beeinflussen versuchen kommt nichts Gutes dabei raus!

Kommentare unerwünscht

In Blogs soll das Tag die Spamer abschrecken. Nur – der durchschnittliche “schöner Beitrag” Spamer weiss davon meist gar nichts. Somit wird kein Spam verhindert.

Was spricht gegen das nofollow Tag in Blogs?

Spam wird damit nicht verhindert!
Kommentare unerwünscht! Wer aktiv in Blogs kommentiert hat sich das bisschen “Link Juice” verdient.
Das Tag nimmt guten Einträgen die verdiente Aufmerksamkeit
Die starke Verbreitung macht das Tag über kurz oder lang überflüssig

Leider kommt auch WordPress mit aktiviertem nofollow Tag daher. Ich hatte fast eine Stunde gebastelt um dies mittels Plugin bei diesem WordPress Blog zu verhindern.

Was mich in meiner Meinung gegen das nofollow Tag bestärkt ist die Tatsache dass die meisten erfolgreichen Blogs wie derjenige der INM AG, Wordweb oder Website Boosting dieses Tag nicht verwenden.

Linktipp

Mit der Firefox Erweiterung Quick SearchStatus lassen sich unter anderem die Links mit nofollow Tag hervorheben.

Was ist gute Typografie?

Oliver Schmid — Wed, 07 Apr 2010 08:51:00 +0000

Die beiden Grundpfeiler guter Typografie

Schrift und vor allem Anordnung nannte der Typograf Jan Tschichold einst die Grundpfeiler guter Typografie. Er schrieb:

“Gute Typografie ist wesentlich ein Ergebnis wohlüberlegter Anordnung. Einer ungeschickten Anordnung helfen selbst die allerschönsten Schriften nichts, aber selbst mit mittelmässig guten Schriften kann man eine gefällige Anordnung treffen.”

Heute kann dank Computer jeder typografisch tätig sein. Der Beruf Typograf ist verschwunden und damit eine Jahrhunderte alte Ausbildung. Wer heute im Bereich Typografie lernen will muss Bücher lesen!

Fehlendes Wissen

Webdesigner und Grafiker haben in der Regel hunderte von Schriften auf ihren Rechnern installiert. Oft fehlt aber das notwendige Grundwissen zu deren Anwendung.

Dies zeigt Beispielhaft die häufig unbedachte Anwendung der Schrift “Frutiger”. Diese Schrift hatte Adrian Frutiger für die optimale Lesbarkeit aus weiter Distanz entwickelt. Also ideal für Plakate und Schilder! Trotzdem wird sie immer wieder in langen Fliesstexten verwendet, ja ganzen Bücher wurden damit geschrieben. Dafür hatte Adrian Frutiger eigentlich die Univers entwickelt. Diese war die erste Schrift ohne Serifen, welche in Fliesstexten annähernd so gut lesbar war wie eine Serifenschrift.

Weitere Fehler sind unter anderem:

Erzwungenem Blocksatz, welcher riesige Löcher zwischen den Wörtern verursacht, und die gute Lesbarkeit behindert
Zahlreichen Schriften auf ein und der selben Website
Alles Fett geschrieben
Alles viel zu klein geschrieben
Experimente an Buchstabenabständen

Buchstaben dürfen nirgendwo beliebig dicht oder weit auseinander gesetzt werden. Niemals dürfen Kleinbuchsteaben gesperrt werden. Grossbuchstaben müssen hingegen leicht gesperrt werden.

Gute Typografie ist gutem Benehmen verwandt

Alles schreit, alles ist hervorgehoben, alles Fett! Während sich im normalen Leben gewisse Anstandsregel durchgesetzt haben herrscht gestalterische Anarchie. Optischer Lärm wohin das Auge blickt. Oft will Typografie anders aussehen als der Durchschnitt. Ungewöhnliche Anordnungen erfordern viel Können. Der Versuch, etwas zu machen, das man nicht kann, ergibt Kitsch. Typografie ist nicht geeignet für kreative Selbstverwirklichung! Sie dient einzig und allein der Lesbarkeit.

„Die Augen sind hungrig, aber oft schon vor dem Sehen satt.“
– Otl Aicher

Jan Tschichold schrieb: “Die Nachbarn stets mit fetten und “noch grösseren” Schriften zu übertrumpfen, ist einfach unmöglich, da Grösse der Schrift natürliche Grenzen in Fläche der Anzeigen gesetzt sind und solche Wünsche der Auftraggeber noch schlimmere Schriftgrössen der Konkurrenten in der nächsten Nummer hervorrufen. Wenn alle Inserenten so lebhaft gestikulieren, sieht man keines mehr, und selbst ein wenig empfindlicher Leser wird durch ungezügelte Anzeigen abgestossen.”

Was er wohl heute über das Internet sagen würde? Es gilt: Weniger ist mehr!

“Da keiner leiser reden will als der Nachbar, schreien nun fast alle. Wünschbar ist aber, dass man nur mit Zimmerlautstärke rede, typografisch gesprochen: dass auf fast alle Halbfette verzichtet werde.” – Jan Tschichold

Buchtipp: Jan Tschichold

Es empfiehlt sich folgendes Buch: Erfreuliche Drucksachen durch gute Typografie.

Webdesigner wie Alljahresreifen?

Oliver Schmid — Tue, 30 Mar 2010 10:20:47 +0000

Alleskönner Webdesigner

Webdesigner Skills sehen meist etwa so aus: “Photoshop, Illustrator, Indesign, Flash, CSS, Ajax, XHTML, ActionScript, JavaScript, PHP, ASP, CFM…..”

Wer alles macht, macht nichts richtig. Es wäre sicher besser, sich auf die eigene Stärke zu fokussieren. Nur so kann man richtig gut werden. Dass ein guter Webdesigner gleichzeitig auch ein guter Programmierer ist kommt in der Praxis äusserst selten vor.

“Viele Webdesigner sind wie Alljahresreifen, sie können zwar alles ein wenig – aber eben nichts so richtig!”

Webagenturen ohne Fokussierung

Sie verkaufen einfach alles: Web-Publishing, Hosting, Texten, Programmierung, Logodesign, Print, Fotografie, SEO, Social Media Marketing usw.

Besonders unglaubwürdig ist dies bei kleinen Firmen. Webdesigner, System Administrator, Texter, Programmierer, Grafiker und Fotograf sind unterschiedliche Berufe. Um dies alles zu beherschen müsste man eine Genie sein!

Aber auch grössere Firmen tun sich schwer damit. Wir erinnern uns an die alteingesessenen grossen Druckereien, welche trotz riesiger Kundenstämmen mit ihrem Internet Angebot gescheitert sind.

“Schuster bleib bei deinen Leisten!”

Diversifikation ist falsch!

Bei voller Konzentration auf eine Sache wird das Risiko, dass sie scheitert, kleiner.

Die 500 reichsten Menschen (Forbes) wurden ohne Diversifikation reich. Bill Gates mit Microsoft, Sergey Brin und Larry Page mit Google, Carlo Slim mit einem Telekommunikations-Unternehmen und und und…

Zitat Warren Buffett, drittreichster Mensch und bekennender Diversifikations-Gegner:

“Konzentrieren Sie Ihre Investments. Wenn Sie über einen Harem mit vierzig Frauen verfügen, lernen Sie keine richtig kennen.”

“Warum soll ich die zweitbeste Aktie kaufen, wenn ich die beste haben kann?”

Meetings are toxic

Oliver Schmid — Thu, 25 Mar 2010 07:01:20 +0000

Vor kurzem ist das neue Buch REWORK von 37Signals erschienen. Die Firma 37Signals beschreibt sich im ersten Kapitel so:

“Some people consider us an internet company, but that makes us cringe. Internet companies are known for hiring compulsively, spending sidly, and failing spectacularly. That’s not us. We’re small, frual, and profitable.”

In den weiteren Kapitel folgen wichtige unternehmerische Grundsätze welche mit Bildern ergänzt wurden:

Planning is guessing
Grow grow grow grow grow – why?
Avoid long-term contracts, excess staff, meetings…
Less is a good thing
Focus on what won’t change
Meetings are toxic
Don’t be a hero
Go to sleep
Don’t copy
Say no by default
Hire when it hurts
Forget about formal education
The best are everywhere
Send people home at five
ASAP is poison

Ich kann sämtlichen Punkten nur zustimmen, wobei ich selber am “Say no by default” noch arbeiten muss.

Ich hatte bereits das Buch Getting Real von 37Signals gelesen. Eine auf dem iPhone gut lesbare kostenlose Browser-Version findet sich hier. Ich kann auch dieses Buch absolut empfehlen.