Treecat Design - Webdesign und Webentwicklung
startseite | projekte | leistungen | referenzen | kontakt

Leistungen und Philosophie von Treecat Design

Die Design-Philosophie von Treecat Design folgt drei Prinzipien: Minimalismus, Barrierefreiheit und Validität.
Viel Text auf dieser Seite – nicht erschrecken, es ist alles ganz harmlos, wir werden alles erklären.

Minimalistische Websites sind cool!

Minimalismus im Webdesign bringt eine Reihe von Vorteilen - und keine Nachteile.
Durch den Verzicht auf viele Grafiken wird die Datenmenge kleiner, die heruntergeladen werden muss, um die Seite aufzubauen. Der Besucher freut sich, weil die Seite schneller angezeigt wird. Nicht jeder hat eine superschnelle Verbindung zum Internet, viele Internetnutzer sind mit einem langsamen Modem unterwegs. Früher galt noch, dass eine Seite nach zehn Sekunden zu sehen sein musste, sonst war der Besucher weg – und kam nie wieder!
Durch die Verbreitung von schnellen Internetzugängen ist diese Zahl abgesunken auf weniger als einer Sekunde. Ist nach einer Sekunde nichts zu sehen wird der Besucher eine der vielen anderen Seiten im Netz aufsuchen.

Minimalismus in der Gestaltung tut Webseiten gut. Genauer, dem Besucher tut es gut. Klare Seitenlayouts ohne Schnörkel, die direkt zur gesuchten Information führen, verwöhnen das Gehirn. Die einzelnen Seiten sind durch ein minimalistisches Layout übersichtlicher.

Moderne minimalistische Webseiten werden bei uns mit CSS (cascading style sheets) gebaut und haben ein besseres Verhältnis von Code-Text zu Inhaltstext. Solche Seiten werden von Suchmaschinen geliebt, weil offenbar mehr drin steht – Inhalt wird belohnt. Seiten, deren Layouts zum Beispiel mit verschachtelten Tabellen realisiert werden, haben viel Quelltext, der nichts mit dem Inhalt zu tun hat, und deshalb ein ganz schlechtes Verhältnis von Code zu Inhalt.

Durch die fast vollständige Trennung von Layout (CSS) und Markup (HTML) sind Webseiten leichter zu warten. Wer etwas HTML beherrscht, aber kein Stylesheet-Guru werden will, kann Änderungen selbst vornehmen ohne im Codesumpf zu versinken.

Barrierefreiheit macht es Besuchern einfacher gesuchte Information zu finden

Barrierefreies Webdesign bedeutet, dass die Implementierung und Programmierung der Webseiten es gestatten, den Inhalt mit möglichst jedem Browser und unabhängig vom Betriebssystem zu erhalten – technische Barrierefreiheit. Auch Blinde Internetnutzer können dann den Seiteninhalt lesen. Bilder sollten einen beschreibenden Text haben. Nutzer von Textbrowsern, die keine Grafiken anzeigen, und solche, die das Laden von Grafiken aus Performance-Gründen abgestellt haben, werden nicht ausgesperrt.

Die Seiteninhalte sollen ohne zusätzliche Plug-Ins abrufbar sein. Zwar gibt es für die meisten Browser zum Beispiel ein Flash-Plug-In, die Akzeptanz und Bereitschaft sich dieses herunterzuladen, um eine bestimmte Seite zu besuchen, ist jedoch fast nicht vorhanden. Es gibt ja viele andere Seiten im Netz …

Neben den technischen Barrieren gibt es auch inhaltliche: Die gewünschten Informationen müssen vom Besucher gefunden werden können. Ein einfach gestaltetes User-Interface, eine Navigation mit trennscharfen Begriffen, hilft dabei.
Keiner liest gerne am Bildschirm. Webseiten, die sofort zur Sache kommen sind besser. Wichtiges sollte auf der Seite möglichst weit oben erscheinen – am besten schon in der Überschrift. Eine karge, kurze Sprache hilft beim Verstehen.

Barrierefreiheit ist ein Ideal, dass man anstreben, aber niemals wirklich erreichen kann. Schon dass man einen Computer und eine Internetverbindung benötigt, um das Internet überhaupt nutzen zu können, stellt eine Barriere dar. Und manche Menschen haben Angst vor Computern. Allerdings kann man sich bemühen, die Barrieren möglichst niedrig zu gestalten.

Validität – überprüfbares Qualitätskriterium für Webseiten.

Validität ist ein Kriterium für die Qualität der technischen Umsetzung von HTML- und CSS-Dateien. Einzelne Webseiten lassen sich online auf Fehler überprüfen. Es gibt nur zwei Klassen von Webseiten: Entweder „Herzlichen Glückwunsch!“ oder „Durchgefallen!“. „Ein bisschen falsch“ gibt es nicht.

Das W3-Consortium, welches die Standards im Internet festlegt, bietet einen HTML-Online-Validator unter der Adresse http://validator.w3.org. Jeder kann hier seine Lieblingsseiten im Internet auf Validität überprüfen. Auch lassen sich kleine unauffällige Links auf einer Webseite positionieren, die auf Wunsch des Besuchers die jeweilige Seite vom Validator testen lassen – auf unserer Website finden Sie diese kleinen Links in der Fußzeile der einzelnen Webseiten („XHTML“ und „CSS“).

Jede HTML-Datei und jedes Stylesheet, die von Treecat Design erstellt werden, werden gründlich validiert und getestet. Valide Websites sind immer noch eine Rarität im Internet. Sicher könnte man auch argumentieren, dass die Standards des W3C Luftschlösser aus dem akademischen Elfenbeinturm (oberste Etage) seien und die Realität des Webdesigns ganz anders sei: Neue Techniken werden ausprobiert, Experimente werden gemacht, tolle Features nutzen Implementierungen, von denen in den Web-Standards noch nie die Rede war. Das entschuldigt aber keine Fehler die durch Nachlässigkeit und mangelnde Sorgfalt entstanden sind. Die meisten Websites haben ja gar keinen experimentellen Charakter.

Leistungen von Treecat – Webdesign, Optimierung, Wartung

Treecat Design bietet minimalistisches Webdesign von der Planung bis zum Start der Webpräsenz in das World Wide Web. Wir entwerfen die Informations-Architektur Ihrer Website und programmieren und gestalten die einzelnen Webseiten Ihres Online-Angebots. Außerdem pflegen und überarbeiten wir schon bestehende Webseiten, ein gelegentlicher Tapetenwechsel signalisiert Aktualität, neue Inhalte sind immer gut und eine Optimierung der Performance einer Webseite ist nie schlecht.

Website-Optimierung

Die Optimierung von Webseiten ist in der Regel kein Prozess, der nach einer einzigen Änderung abgeschlossen ist. Erst die Zeit zeigt, ob und in welchem Ausmaß die Änderungen zum Ziel geführt haben. Es ist auch nicht ausreichend nur Optimierung für Suchmaschinen zu betreiben. Besucher-Optimierung ist ein besseres Ziel, denn Suchmaschinen kaufen beispielsweise in Online-Shops nicht ein und bestellen auch keinen Newsletter. Ein Besucher hingegen freut sich über klare Informationen und leichte Bedienbarkeit.

Bei Websites lassen sich optimieren:

Preise für unsere Leistungen

Wir arbeiten nicht umsonst. Eine vollständige Website zu planen und gut umzusetzen ist mühsam und zeitintensiv, oft ist es eine monotone und repetitive Beschäftigung. Akribie und Ausdauer sind nötig, Schlamperei darf nicht sein. Durch unsere Erfahrung machen wir alte Fehler nicht wieder, wir verteidigen keine Techniken, die nicht funktioniert haben.

Der Preis für die Erstellung einer neuen Website hängt ganz von den gewünschten Eigenschaften ab. Aufwändige Programmierung oder arbeitszeit-intensive Grafiken kosten mehr Geld.

Die Wartung und Überarbeitung bestehender Websites bedeutet ebenfalls Arbeit, der Preis für Änderungen wird nach benötigten Stunden berechnet zu einem Stundensatz von 30 Euro pro Stunde ohne Mehrwertsteuer.

Features einer Treecat-Website

Folgende Eigenschaften machen eine Treecat-Seite aus:

Technologien: XHTML und CSS

Bei der Umsetzung einer Webseite wird der Text semantisch gegliedert und die einzelnen Sinneinheiten in einer Markup-Sprache kodiert: das ist HTML, die Hypertext Markup Language, oder XHTML, die über XML neu definierte, strengere Version davon, die von Treecat bevorzugt eingesetzt wird.

Wie die einzelnen Einheiten dann im Browser aussehen entscheidet eine Formatvorlage, das Cascading Style Sheet (CSS) oder Stylesheet. Somit sind der Inhalt der Webseite und das Layout fast vollständig getrennt – das ist sehr nützlich. Änderungen am Layout betreffen nun nur noch wenige zentrale Dateien, in welchen die Informationen, die der Webbrowser zur grafischen Darstellung der Seite verwendet, gespeichert sind. Zudem werden die HTML-Dateien durch die Auslagerung der Layoutinformationen in eine CSS-Datei enorm verkleinert. Das wirkt sich sehr positiv auf die Ladezeit aus.

HTML- und CSS-Dateien lassen sich auf Fehler prüfen. Fehlerfreiheit der HTML-Dateien ist ein sehr wichtiges Qualitätskriterium und zeichnet eine gut gemachte Website aus.

Die Verwendung von Stylesheets ist inzwischen eine übliche Methode zur Erstellung von Layouts, obwohl es CSS auch schon 10 Jahre lang gibt – manchmal dauert es eben etwas, bis sich solche Techniken durchsetzen. Tabellen-Layouts sind kompliziert und out.

Alle HTML-Dateien und Stylesheets werden von Hand geschrieben und nicht mit einem grafischen Editor erstellt, wir sprechen diese „Sprachen“ fließend. Jede Webpräsenz ist ein Unikat, Massenware gibt es bei Treecat nicht.

Die Layoutinformationen aus Stylesheets (CSS) werden von verschiedenen Browsern unterschiedlich interpretiert. Deshalb kann die gleiche Webseite anders dargestellt werden. Manche Browser verstehen kein CSS, hier erscheint das reine Markup, was etwas puristisch wirken kann.

HTML ist keine richtige Programmiersprache und wird oft als einfach verkannt. Es ist hier tatsächlich möglich schon nach wenigen Minuten selber eine Ausgabe auf dem Bildschirm zu erreichen. Aber erst lange Erfahrung mit HTML und Beobachtungen an lebenden Websites machen einen zu einem guten HTML-Autor. HTML ist sehr tiergründig.

Technologien: Perl, JavaScript, PHP, MySQL, …

Treecat bietet auch viele anderen Technologien, die man nutzen kann, um einen glanzvollen Webauftritt zu machen. Perl ist eine Scriptsprache, wie PHP, die traditionell im Bereich CGI-Programmierung eingesetzt wird. JavaScript ist inzwischen fast überall vorhanden und auch fast überall wieder aktiviert. Die Funktionsfähigkeit der Webseite darf nur nicht von JavaScript abhängig sein, sonst sperrt man einige Besucher aus – das ist schlecht.

PHP ist eine Programmiersprache, die zur Erzeugung dynamischer Webseiten eigesetzt wird und immer beliebter wird. Hier kann der Besucher mit einer Webseite oder einer Webanwendung interagieren. Zum Beispiel lassen sich Formular-Daten, die von einem Besucher eingegeben wurde, per E-Mail verschicken oder vorher auf Plausibilität prüfen.

Domainnamen und Webhosting

Der Domainname ist Bestandteil der URL-Adresse einer Website oder einer E-Mail-Adresse. Ein Beispiel:
Der URL dieser Webseite: http://treecat.de/leistungen/leistungen.html
Der Name unserer Domain: treecat.de

Wir helfen Ihnen dabei, einen schönen Domainnamen zu (er-)finden und diesen bei einem Registrar oder bei einem Webhoster zu registrieren. Man sollte nicht traurig sein, wenn ein Name, der einem gut gefällt, schon vergeben ist – es gibt noch viele andere!

Auch sollte man die Suchmaschinentauglichkeit des Domainnamens nicht überbewerten, die erfolgreichsten Websites im Netz befinden sich auf Domains, deren Namen eher exotisch wirken und in keinem Wortschatz der Welt vorkommen.

Demnächst wird auf unserer Website ein Artikel abrufbar sein, der dem Thema „Domainnamen“ gewidmet ist. Dort werden Sie nützliche Informationen finden, welche Top-Level-Domains (z.B. .com, .de, oder .net) für einen guten, seriösen Webauftritt geeignet sind und unter welchen sich eher zwielichtige Gestalten herumtreiben.

Um dann eine Website zu betreiben benötigt man noch Webspace – Festplattenplatz auf einem Webserver. Wir haben Erfahrung mit der Einrichtung von Websites bei den bekannten und auch bei kleineren, weniger bekannten Providern, die Webspace vermieten, also Webhosting betreiben.

Planung einer Webpräsenz

Die Planung einer Website ist essentiell. Der Verzeichnisbaum und die Navigation müssen gut und konsistent strukturiert sein, damit später nichts mehr daran geändert werden muss – Änderungen an der Grundstruktur einer Website sind nicht gut und aufwändig. Durch eine Trennung von Layout und Inhalt lässt sich die Gestaltung einer Website gut modifizieren, der Inhalt einzelner Seiten auch, das Hinzufügen neuer Seiten und Inhalte ist kein Problem – eine gute Planung der Informations-Architektur führt zu skalierbaren Webprojekten.
Es gibt Situationen, in denen es gerechtfertigt ist, eine Website komplett abzureißen und neu anzufangen – Augen zu und durch.

Grafik: High-End-3D ist unsere Passion

Ein 3D-Würfel aus grünem Glas

Wir machen alle unsere Grafiken selbst. Wir benutzen High-End-3D-Programme, die auch für Spezialeffekte im Film eingesetzt werden. Auch aufwändige Grafiken sind möglich, ob photorealistisch oder in kühler 3D-Computer-Ästhetik.
Eine Vielzahl an guten 2D-Programmen wird für die übrigen Grafiken verwendet. Insgesamt allerdings sind minimalistische Seiten nicht sehr grafikintensiv. Der Wert von Grafiken in Websites wird oft überschätzt.

Demnächst wird auf dieser Website vielleicht auch eine kleine Galerie von 2D- und 3D-Computer-Grafiken zu finden sein.

Eigene Fehlerseiten

„404- File not found, die angegebene Datei existiert gar nicht, usw…“ – Das ist doch so trist! Alle Treecat-Seiten erhalten eigene Fehlermeldungen im seiteneigenen Layout, im eigenen corporate design, mit Navigationsmenü. Kein Besucher, der das Missgeschick einer Fehlermeldung erleidet, geht dann noch verloren.

Eigenen Fehlerseiten sind keine Selbstverständlichkeit, viele Webpräsenzen großer Firmen und Unternehmen haben so etwas nicht. Wir wissen, wie es geht - wir machen das gerne.

Speed-Optimierung

Bei Webseiten, deren Inhalt nicht grafikbasiert ist, holen wir alles aus der Seite heraus, um die Ladezeit zu senken. Logo-Grafiken werden so weit wie möglich optimiert und Markup-Ballast, der den Quelltext aufbläht, wird entsorgt. Eine Ladezeit von unter einer Sekunde bei einer schnellen Verbindung ist ein gutes Ziel. Bei Modemverbindungen streben wir eine Ladezeit von unter 5 Sekunden an. Das funktioniert bei textlastigen Seiten sehr gut, eine Bildergalerie kleinzuknautschen ist natürlich weniger gut möglich, da die Bildqualität unter starker Kompression leiden kann.

XML-Sitemap für die Suchmaschinen

Die „großen drei“ Suchmaschinen haben sich auf einen gemeinsamen Standard für Sitemaps geeinigt. Eine Sitemap ist eine XML-Datei, die alle Seiten eines Webangebots auflistet. Die Crawler der Suchmaschinen, die im Internet unterwegs sind und neue Webseiten finden möchten, haben durch diese Datei die Möglichkeit alle Webseiten einer Online-Präsenz zu erreichen. In der Sitemap können auch weitere Daten aufgelistet werden: Wann eine betreffende Seite zuletzt überarbeitet wurde, wie häufig es zu Änderungen kommt und wie wichtig eine einzelne Seite in Relation zum restlichen Online-Angebot ist.

Webgeographie: Geo-Daten

Durch das Einbinden von geographischen Daten werden Websites für eine lokale Suche erschlossen: Wer einen Handwerker in München sucht wird an Kontaktdaten eines Handwerkers in Hannover nicht interessiert sein. Die lokale Suche wird in Zukunft möglicherweise dabei sehr behilflich sein genau die richtige Website zu finden, wenn es um Bedürfnisse geht, die ortsabhängig sind. Es ist noch alles sehr neu, was aber kein Grund ist nicht jetzt schon dabei zu sein.

Mikroformate: semantic web lite

Ebenfalls noch wenig unterstützt werden die sogenannten microformats oder Mikroformate. Der Quelltext einer Webseite kann semantisch angereichert werden, Adressen von Firmen oder Personen können als solche ausgezeichnet werden. Solche Inhalte sind dann sehr gut maschinenlesbar und mit bestimmten Browsern und Erweiterungen lassen sich solche Daten dann in elektronische Adressbücher übertragen. Noch ist die Unterstützung alles andere als breit, aber cool ist diese Lite-Version des Semantic Web schon!

Testen der fertigen Webseiten

Fehlerfreies HTML ist Pflicht. Alle HTML-Dokumente werden „validiert“, auf Fehlerfreiheit geprüft. Ebenso werden die Stylesheets auf syntaktische Korrektheit geprüft. Bei erfolgreichem Test gibt es sogar einen Orden: kleine Grafiken vom W3-Consortium. Sie signalisieren, dass man sich um Fehlerfreiheit bemüht hat.

Ein anderer Aspekt ist das Testen der fertigen HTML-Dokumente in verschiedenen Webbrowsern. Zu diesem Zweck haben wir einen Browser-Zoo: Wir haben ALLES, vom ur-uralten Heuler bis zur neuesten Alpha-Version von Sachen, die es noch gar nicht gibt! Wir testen jede neue Website in klassischen (wenn man das so nennen will) und zeitgenössischen Webbrowsern. Dabei ist der entscheidende Punkt, dass der Seiteninhalt in jedem Fall abrufbar ist. Ein absolut gleiches Aussehen der Seite, rein optisch, in allen Browsern ist nicht erreichbar, da sich die einzelnen Programme schon hinsichtlich der Darstellung von Schrift zum Teil sehr unterscheiden (zum Beispiel mit und ohne Kantenglättung). Sehr alte Browser verstehen kein CSS, die Seiten werden ihrer semantischen Struktur entsprechend angezeigt und der Inhalt ist zugänglich.

Die Existenz verschiedener Betriebssysteme wird berücksichtigt. Es ist nicht gut eine Seite so zu bauen, dass nur Benutzer des zur Zeit marktführenden Betriebssystems etwas damit anfangen können. Webseiten sollten vielleicht nicht für die Ewigkeit, aber doch für lange Zeit geplant werden. Wer heute Marktführer ist, ist das vielleicht morgen nicht mehr.

Wir haben Testbereiche, eigene Test-Domains, wo Seiten probehalber laufen können. Sie können, wenn Sie wollen, den Fortschritt Ihres Webprojekts mitverfolgen. Die Testbereiche finden Sie auf der Startseite, wenn etwas getestet wird.

Anmeldung bei Suchmaschinen

Bei manchen Suchmaschinen ist es auch möglich neue Websites für eine Aufnahme in den Index der Suchmaschine vorzuschlagen. Der Webcrawler der Suchmaschine wird dann eventuell irgendwann die neu angemeldete Webseite abrufen und gefundene Dateien werden möglicherweise in den Index aufgenommen. Ob eine neue Webseite tatsächlich aufgenommen wird hängt von vielen Faktoren ab, die bei den einzelnen Suchmaschinen unterschiedlich sind. Die meisten Suchmaschinen versprechen übrigens nicht, dass man auch wirklich gefunden und indexiert wird. Gute Chancen haben Websites, die fehlerfrei und maschinenlesbar implementiert sind und einzigartigen Textinhalt bieten, eine hundertprozentige Garantie kann aber niemand geben.

Favicons – Das Tüpfelchen auf dem „i“

Eigentlich nicht mehr wegzudenken sind die kleinen Grafiken, die in der Adresszeile vieler Browser angezeigt werden und auch in der Favoriten-Liste auftauchen. Alle Treecat-Seiten bekommen eine dieser kleinen Grafiken, Favicon genannt.
Alle Treecat-Favicons, die für Webprojekte erstellt wurden, sind hier in einer Galerie versammelt.