die digitale Küche des stillen Bastlers

Toaststapel für den Tag ‘Webdesign’

Webdesigner Buffet

Nein. Nicht zum Essen, sondern ein Bündel Werkzeug und Inspiration, das ich heute zu Tische tragen möchte. Interessante Dinge, die ich gefunden habe und teilen möchte. Das Buffet ist eröffnet.

Zum Basteln

ecsstender

ecsstender verspricht moderne CSS Eigenschaften für jeden Browser zugänglich zu machen

Wordpress Typografie Plugins

20 Typografie Plugins für Wordpress

jQuery Einstieg

jQuery Einstieg: Selektoren, Filter und Traversing

Typografie Techniken für Webdesigns

Eine Liste mit Tools rund um Typografie im Webdesign

psdtohtml

Von Photoshop zu HTML: Das ultimative Guide

Mozilla und WOFF

Mozilla und das Web Open Font Format WOFF

Wordpress Custom Write Panels

Eigene Formularfelder im Wordpress Backend

MooTools Floom

Mootools Floom: Der etwas andere Bilder Slide Effekt

Tools

googlechrome

Google Chrome: Jetzt auch für Mac erhältlich. Developer Release


Tags: , , , , , , , | In der Kategorie Webdesign

An welchem Brot ich kaue

Was macht der Nachtmeister eigentlich während er sein Blog vernachlässigt? Richtig. Ich eifere meinen Projekten nach. Theoretisch. Praktisch verliere ich nämlich gerade ein wenig die Geduld.

Free Templates und Goodies

Ich habe mittlerweile ein mehr oder weniger grösseres Webseitenprojekt von Griechenland übernommen. Dieses nimmt enorm viel Zeit in Anspruch und lässt mich langsam daran zweifeln, dass Webdesign im Auftrag von Anderen wirklich das Ding ist, was ich immer wollte.

Ich habe mich somit entschlossen mich eine Weile aus diesem Geschäft zurück zu ziehen, sobald ich zu einem abschliessenden Punkt bekommen bin. Statt dessen werde ich mal versuchen, in den Markt von CMS Templating einzusteigen und in Zukunft sowohl kostenlose Templates für diverse CMS und Blog Software, als auch etwas wertvollere Gewänder in einem kleinen Preisradius anzubieten.

Kreativquelle: eyesberg

Wie auch immer. Es sind noch andere Projekte, welche ich verwirklichen will/wollte. Eins davon nennt sich eyesberg und soll sozusagen ein deutschsprachiger Knoten zu den vielen englischsprachigen Seiten, welche qualitative Tutorials, Tipps und Ressourcen anbieten darstellen. Da mir aber eben aufgrund des aktuellen Kundenprojekt schlichtweg die Zeit fehlt, diesen Blog aufzusetzen, habe ich vorab eine Facebook Seite erstellt. Dort sind vorallem meine täglichen Netzfundstücke zu finden, die ich gerne mit euch teile, sofern ihr daran interessiert seid etwas mehr über die Kreativen der Welt zu erfahren.

eyesberg-facebook

Fazit: Ihr profitiert

Wenn ich erstmal wieder auf den Geschmack gekommen bin, werdet ihr alle in irgendeiner Weise profitieren, sei es anhand der geteilten Links oder der Dinge, die ich in Zukunft anbiete. Bis dahin: Stay tuned.


Tags: , , , | In der Kategorie Nachtmeister.ch

Die Geldgier im Web 2.0

Das schöne Web 2.0 und seine Darstellung mag jedem gerne mal die Augen glänzig zeichnen. Auch Entwickler haben bereits gemerkt, dass das Auge je länger wie mehr das Bauchgefühl ersetzt und sie so den Leuten das Geld aus der Tasche ziehen können. Mir sind dabei sehr viele Beispiele dafür über den Weg gelaufen.

Das Auge ist mit

Der Selbsttest: Wie oft lässt du dich von der Optik eines Programms oder einer Webapplikation zum Kauf überreden? Ich je läger wie mehr, weil ich so oder so den Drang dazu habe, mit dem Auge zu beurteilen, da mich als Designer ja vor Allem diese Aspekte interessieren. Und genau diesen Trick nutzen Entwickler, um Leuten das Geld aus der Tasche zu ziehen. Man neigt dann oft dazu, sich durch das gute Aussehen positiv stimmen zu lassen und greift schlicht weg ohne lange zu überlegen zu.

Beispiele für solche Anwendungen gibt es am Laufband. Nachfolgend werde ich einige zeigen und auch meine Meinung dazu schildern, warum diese Anwendung ein schlechter Kauf ist. Ich deute damit nicht an, dass diese Lösungen schlecht währen in ihren Funktionen. Rein das Preis/Leistungsverhältnis lässt zu wünschen übrig in Anbetracht der Tatsache, dass die Tools und Services meist nur gut aussehen.

LightCMS

Web 2.0 Content Management System for Designers | Content Management System for Ad Agencies | CMS

Der offizielle Slogan von LightCMS “the friendly CMS for web designers” könnte man auch anders verstehen. “Das Idiotensichere CMS für den Webdesigner, da die sowieso nichts von Coden verstehen”. Also kurz ausgedrückt: Das CMS für faule Webdesigner mit grossem Geldbeutel. Denn neben der Tatsache, dass dieses Ding im Gegensatz zu den Weltgrössen Wordpress, Drupal und Co. weder eine wirkliche Community, noch wirklich viele Funktionen mit sich bringt, kostet es auch noch unverschämt viel.

Ach übrigens: Die selbe Entwicklergruppe bietet auch das WatterCMS und SkyCMS an, welche sich überhaupt nicht von LightCMS unterscheidet aber genau gleich viel kostet.

LightCMS - Underdressed

Die kostenlose Variante fällt schonmal völlig vom Sockel. Drei Seiten und begrenzte 10 MB reichen allenfalls für eine kurz Profilseite, dennoch nicht für ein Webdesigner Portfolio, welches zumindest genug Platz für Bilder in bester Qualität haben sollte. Die restlichen Angebote sind so oder so völlig übertrieben bemessen und wohl nur für Webdesigner mit IQ < 50 kalkuliert. Wer diese Angebote beansprucht, sollte bei der selbstvermarkenden Werbung nicht all zu grosse Töne spucken.

tgethr

tgethr - Ganz ausgereifte Abzockerei

Ich nutze oft das E-Mail Postfach von Facebook, weil es einfach angenehm einfach und schnell geht, eine Nachricht oder Kurznotiz zu verschicken. tgethr ist da genau das was ich brauche. Eine Weboberfläche zur einfachen Kommunikation. Doch aber was ist das? ACH DU MEINE GÜTE! Der Preis schwappt über alle Ufer der Selbsteinschätzung von Seiten der Entwickler. Da hat ein ganz ausgereifter Fuchs wohl schnell mal das Potenzial eines solchen Services bemerkt und sich selbst überschtäzt.

tgethr - Oh mein Gott.

Obwohl auf der tgethr Seite unter den Details “Some people charge to secure your web traffic. We don’t. It’s standard with every account” (Einige Leute verlangen Geld für eine sicheren Webübertragung. Wir nicht, es ist Standard mit jedem Account) zu lesen ist , wird erst mit dem 24$ im Monat kostenden Angebot auch eine geschützte Gruppe angeboten. Und nur EINE geschützte Gruppe was so viel heisst wie “Web traffic is encrypted and emails can be sent signed (identity verification) and encrypted (scrambled from prying eyes)” (Webübertragung ist Verschlüsselt und E-Mails können signiert – identifikations sicher – und verschlüsselt übertragen werden). Was sagt uns das? Richtig. Hier wird grosses Kino um nichts gemacht und auch noch ein Service garantiert, der gar nicht existiert.

Campfire

Campfire - Löcher aus dem Hause 37Signals

Ein Chat zur Kommunikation zwischen Teams, Kunden und Partner ist nützlich. Und teuer. Teuer?! Was teuer? Ja, es gibt tatsächlich Leute die bezahlen trotz dem, dass der Chat sich schon längs als Standard ins Web eingebürgert hat bis zu 99$ im Monat für Campfire, um mit ihren Leuten kommunizieren zu können. Dabei kann doch jeder problemlos seinen eigenen Chat im Internet erstellen, hosten oder generieren. Daneben gibt es IRC als die wohl meist benutzte Chat Plattform. Nichts desto trotz hat die Entwicklertruppe von 37Signals eine weitere Lücke auf dem Markt gefunden um Leuten, die sich nicht gerne lange beraten lassen, das Geld aus der Tasche zu ziehen.

Campfire - Die Spinnen die Römer

Campfire bietet zwar eine sehr einfach Möglichkeit, direkt während des Chats Dateien und Bilder einzubinden. Das ist aber kein Argument um 12$ – 99$ Dollar in eine Chat Applikation zu investieren, die es mit IRC bereits mehr als lange gibt. Des Weiteren bin ich mir nicht so ganz sicher, ob überhaupt jemand mit mehr als 12 Leuten gleichzeitig chatten kann und dabei die Übersicht über den Chatverlauf noch hat.

Fazit

Es ist nicht alles Gold was glänzt. Auf jeden Fall nicht für den Benutzer. Die Entwickler hingegen schlagen ihren Profit aus den von Augen gesteuerten Benutzer, die den Service oftmals nicht hinterdenken oder nach billigeren, sogar kostenlosen Alternativen suchen.

Es gibt auch noch weitere dreiste Beispiele, diese hier sind aber eindeutig ganz oben auf der Spitze des Eisbergs platziert. Was meint ihr zu den Angeboten? Sind die Preise gerechtfertigt?


Tags: , , , , , , , , , , , , , , , , | In der Kategorie Strange Things

CSS verbessern #2: Em, Pixel, Points, Prozent und Keywords

In diesem zweiten Artikel zur Verbesserung des eigenen CSS Schreibstils möchte ich mal etwas näher auf die Masse Em, Pixel, Points, Prozent und die selten gebräuchlichen Keywords zur Grössenbemessung von Schriftarten eingehen und ein paar Webdesignern auf die Hände klatschen.

Cross-Browser Kompatibilität, ein wichtiges Thema

Pixel (px)

Pixel sind wohl die meist gebrauchten Masse. Und genau deswegen steige ich mal hier ein. Pixel eignen sich hervorragend für statische Layoutelemente, wo man sie heute heute überall vermehrt hat. Da sich viele Webseiten darauf festlegen, zentriert angezeigt zu werden, kommt auch meist eine feste Pixelbreite zum Einsatz. Man umschliesst seine ganze Seite im Normalfall mit einem Container, der sich und seinen Inhalt dann flexibel anpassen lässt. Aus Tests weiss man, dass sich die Benutzer meist nur auf eine kleine Fläche des Bildschirms konzentrieren können. So sind voll dynamische, auf die ganze Browser Breite justierte Seiten nicht wirklich praktisch, da der Bereich, der mit den Augen eingefangen werden kann, so oder so zu gross ist.

Nun, Pixel sind also eine gute Sache, da sind wir uns einig. Jetzt verwenden aber viele Webdesigner und CSS Schreiberlinge Pixel für Schriftgrössen.

Probleme:

  • Schriften lassen sich von alten Browsern nicht verkleinern und vergrössern, was den Benutzer einschränkt.
  • Schriftgrössen justieren sich exakt in diese Pixelmasse was bewirkt, dass sie kleiner aussehen, als sie eigentlich sind im Vergleich zu anderen Schriftarten.
  • Je nach Monitor und Einstellung der Kantenglättung sehen Schriftarten ganz anders aus.
  • Pixelgrössen sind statisch. Sie lassen sich nicht durch Elternelemente beeinflussen im Gegensatz zu EM, Prozent und Keywords.

Dadurch, dass viele Webdesigner diese Punkte ignorieren, schaffen sie eine statische Umgebung, die spätere Anpassungen völlig unbequem lassen und dabei noch noch ältere Browser ausschliessen. Gut, da in letzter Zeit sowieso immer mehr Kontroverse und Boykott Aktionen gegen den Internet Explorer 6 statt finden, ist der von mir zweite genannte Punkt sicher nicht mehr eine grosse Diskussion wert.

EM

EM ist eher was Neues. Ja und genau deswegen hat’s der Bauer wohl auch noch nicht gefressen. EM heisst übrigens auch nicht Europa Meisterschaft. Ehrlich gesagt habe ich noch nicht rausgefunden, was EM in der Namensgebung genau bedeutet, aber ich würde mal so etwas wie Elastic Mass vermuten.

Wie auch immer, was man über EM wissen muss ist kurz gesagt: EM ist eine relative Masseinheit. Das heisst, sie passt sich seinem Elternelement an und ist so flexibel und dynamisch. EM eignen sich praktisch nur für Schriftarten. Dabei gilt die Regel: Beim normalen Browserstandard ist 1em = 16px. Setze ich als keinen Wert in meinem Body, werden Schriftarten in 16 Pixel angezeigt. So, nun scheuen sich viele vor dem Arbeiten mit EMs weil es wohl einfach schwer vorstellbar ist, wie z.B. 1.2em oder 2em aussieht, wenn ja 1em = 16px ist. Meine Güte, man könnte es ja ausrechnen, aber wer will das schon? Und hier kommt der Trick.

Setzen wir die Schriftgrösse unseres Body auf 62.5%, ist 1em = 10px. Warum? Ganz einfach. Da EM relativ ist und Body das oberste Element ist, passt sich die Grösse unserer EM Masseinheiten an.

1em = 16px = 100%
1em = 10px = 62.5%

Die Arbeit mit EM ist nun auch für jeden Pixelmeister kein Problem mehr. Denn 12px wären nun Beispielsweise 1.2em, oder 20px wären 2em.

body {
font-size: 62.5%
}

Vorteile:

  • Kann verkleinert und vergrössert werden mit IE6
  • Dynamisch/Elastisch
  • Passt sich dem Elternelement an

Points (pt)

Points laufen auf das gleiche problem wie Pixel hinaus: Sie sind nicht beeinflussbar durch ältere Browser. Die pt Masseinheit sollte vor Allem für Druckerfreundliche Seiten oder speziell vorgefertigte Druckseiten auf Webseiten benutzt werden und für mehr nicht.

72pts = 1 Zoll = 2.54 cm

Warum wir Points nicht für Webseiten nutzen liegt klar auf der Hand. Die Unterschiede zwischen verschiedenen Browsern sind drastisch. Je nach Browser kann die Schriftart sogar Doppelt so gross erscheinen.

Prozent (%)

Wie die Prozent Masseinheit funktioniert muss man wohl nicht lange erklären. Hat ein Elternelemnt die Schriftgrösse von 20px, hat das Unterlement bei einer eingestellten Schriftgrösse von 50% noch eine Grösse von 10px.

Im produktiven Betrieb kommt die Prozent Schriftgrösse vor Allem dort zum Einsatz, wo sie sich per Eingabe des Benutzer flexibel vergrössern und verkleinern lässt. Sie ist ebenfalls abhängig vom Elternelement wie EM. Doch ist es sehr schwer mit % über eine ganze Webseite hinweg zu arbeiten. Es ist schlecht vorstellbar, wie gross diese % angaben sind, da sowohl Angaben hinter dem Komma die Schriftgrösse noch Feintunig verändert.

Eine beliebte Technik ist, die Body Schriftgrösse auf 62.5% zu setzen, um in den danach folgenden Elementen mit EM zu arbeiten (siehe Beschriebung zu EM).

Keywords

Keywords trifft man ehrlich gesagt nicht mehr so oft an. Mögliche Angaben sind xx-small, x-small, small, medium, large, x-large und xx-large. Weiter gibt es noch smaller und larger, welche mit den Font-Weight Eigenschaften bolder und smaller verglichen werden können.

Der Vorteil dieser Methode ist, dass die Schriftgrössen auf jedem Browser in etwa gleich gross sind. nachteile sind aber ganz klar die definierte Anzahl an Stufen, die unsere Schriftarten haben. Da wir uns ja meistens auf eine Methode von Schriftgrössen Angaben beschränken, hätten wir hier das Problem, das wir nur sieben Schriftgrössen zur Auswahl hätten. Das mag nicht schlimm sein in Anbetracht der Tatsache, dass wir für eine Webseite meist sowieso nicht mehr verwenden müssen.

Die Qual der Wahl

Die beste Auswahl macht man eindeutig mit EM. Sie sind modern, flexibel, vom Elternelementabhängig und lassen sich mit dem oben gezeigten Trick auch leicht anwenden. Es gibt also kein Schlecht und kein Gut. Jede der Masseinheiten hat seinen Platz in der richtigen Verwendung.

Schlecht sind aber sicher Webseiten, die für die Schriftgrösse jedes Elements eine Pixelmasseinheit definiert haben. Denn sie haben das Prinzip der Usability nicht verstanden die darin liegt, schnell und einfach alles anpassen zu können.


Tags: , , , , , , , | In der Kategorie CSS, Webdesign

Schnipsel aus dem Alltag

Was macht ein Mensch, der zu viele Hobbys hat? Gibt es dieses Phänomen überhaupt? Und ob. Nachtmeister beweist es. Tatsächlich bin ich etwas Erfolgs vernarrt und mache Dinge lieber selber, als sie von jemanden zu machen. Dabei gewinne ich viel gute Erfahrung und treffe auf ganz neue Gesichter, lerne viele Dinge und kann Andere dann selber unterstützen. Allerdings hat das Ganze einen Hacken.

Den Wald vor lauter Bäume nicht mehr sehen

wald

Tatsächlich ist es so. Man möchte alles unter einen Hut bringen, was man gerne macht. Bei mir sind das Dinge wie Webdesignen, Illustrieren, Musik machen,  mich weiterbilden, an verschiedenen Projekten beteiligen und mein neustes Hobbie, das Fotografieren. Ja das ist ein ganzer Stapel zeitaufwendiger Dinge, die sich nicht alle einfach so miteinander vereinbaren lassen. Da ich alle diese Dinge genau gleich gerne mache, Prioritäten setzen praktisch unmöglich ist, zögert sich schon mal hier und da etwas um ein paar Wochen hinaus. Das heisst, Projekte leiden an fehlenden Ergebnissen, meinem Portfolio fehlt es an neuem Inhalt und Webseiten mangeln an Aktivität.

Ein Hobby (PluralHobbys[1]) oder Steckenpferd ist eine Lieblingsbeschäftigung. Ein Hobby ist somit im Gegensatz zu Arbeit eine Tätigkeit, der man sich nicht aus Notwendigkeit, sondern freiwillig und aus InteresseFaszination oder sogar Leidenschaft unterzieht. Die Tätigkeit bringt Vergnügen, Spaß oder Lustgewinn mit sich. Dabei ist mit Arbeit nicht ausschließlich Erwerbsarbeit (Beruf) gemeint.

Somit hat der Begriff Hobby eine deutliche Nähe zum Begriff Spiel. Als Hobby wird allerdings eine Tätigkeit nur genannt, wenn diese Tätigkeit eine im Vergleich zu anderen Freizeitgestaltungen besondere Vorliebe darstellt. Darüber hinaus kann ein Hobby im Gegensatz zum Spiel durchaus eine unmittelbare nicht fiktionale Zweckmäßigkeit haben (über den Spaß bzw. den Lustgewinn an der Tätigkeit hinaus).

Das unteranderem sagt mir Wikipedia, wenn ich das Wort mal auf seine Sinnmässigkeit absuche. Meine besondere Vorliebe würde dann wohl einfach mal in der Kreativität und Ehrgeiz liegen, denn das haben alle diese Tätigkeiten gemeinsam und kurbeln mich an.

Verpflichtung, die es nicht gibt

FedEx Tania

Ist Hobby Arbeit, oder die Arbeit ein Hobby? Schwer zu sagen. Das alles passiert auf freiwilliger Basis und weil ich extrem grossen Spass daran habe. Ich war nie verpflichtet, mir alle diese Freizeitaktivitäten anzulegen und trotzdem tat ich es aus Ehrgeiz und Freude und ich habe einen gewissen Lebenssinn darin entdeckt. Nun bin ich verpflichtet, Leistung zu bringen und die Pakete abzuliefern. Oder etwa doch nicht? Nein, eigentlich könnte ich jede E-Mail, jede Konversation, jede Anfrage und jede Bitte ablehnen und hätte wieder mehr Freiraum, den ich mir selber gestallten könnte. Statt dessen bin ich zum “Ja sager” mutiert und mache mir so unnötig das Leben schwer. Dabei versuche ich mein Entgegenkommen möglichst perfekt auszuführen. Das klappt auch meistens zum Glück des mir Gegenüber. Ich selber bin mit meiner Leistung selten zufrieden, weil ich genau weiss, zu wenig Zeit in diese investiert zu haben.

Mädchen für alles

Ich setze mich nicht auf eine Tätigkeit fest. Wenn ich eine Webseite machen darf und der mir Gegenüber vielleicht noch spezielle Ansprüche stellt wie ein Video Intro, Animationen oder Visitenkartenvorlagen kann ich auch da nicht nein sagen, obwohl genau diese Sachen wahrscheinlich nicht zu meinen Kompetenzen gehören. Statt dessen beisse ich mich auf dem Motto “Nichts ist unmöglich” fest und vertiefe mich auch in die Themen, mit denen ich mich noch nie beschäftigt habe. So finde ich Freude an Neuem und ernte gleichzeitig praktisch neue Tätigkeiten, die mir gefallen, aber zeitlich sowieso nie in Angriff genommen werden können. Diese sucht, immer Ja zu sagen, um wirklich alles so zu haben, wie ich möchte, ist eine schreckliche Angewohnheit die ich niemandem empfehle. Jeder würde sofort merken, dass es mehr Nachteile als Vorteile hat. Ich sehe gerne mal nur die Vorteile und den Spass, den ich daran habe und grabe mir so selber eine Grube.

Neue Identität

Tastatur

Wie alle Jahre wieder wird es auch dieses Jahr unausweichlich sein, mal wieder den Namen meiner Internetpräsenz zu ändern. Warum zum Henker mache ich das eigentlich? Keine Ahnung. Ich scheine einfach nie zufrieden zu sein. Schon in Videospielen fange ich gerne einfach mal von vorne an, wenn mir mein Charakter äusserlich nicht mehr gefällt. Ja, das ist gewissermassen ein wenig entscheidend, denn schliesslich muss ich mich Stunden lang mit der gleichen Person abgeben, dann soll dieser auch etwas ansprechlich aussehen.

Ähnlich passiert es mir auch mit meiner Internetseite. Da sie in gewissermassen mich und meine Tätigkeit repräsentiert, muss es auch authentisch rüberkommen. Der Name spielt für mich da eine entscheidende Rolle. Er muss kurz, leicht merkbar sein und auch wiedererkennungswert besitzen. Das Hauptproblem bei den Namen, die ich meistens wähle sind, dass sie wenig mit meiner Arbeit gemeinsam haben, kompliziert zu merken sind und meist überhaupt keinen Sinn machen.

Die erste Adresse unter der ich wirklich zu finden war, war weboptics. Das hatte noch gewissermassen mit meiner Tätigkeit zu tun, klingt aber einfach doof in meinen Ohren. Früher hatte ich den Domain n-cense registriert. Das konnte sich schon mal keiner Merken. Eines Nachts aus einer Laune heraus habe ich mir 6pounder.com gekauft. Dieser Name ist wiedereinmal aus einer Laune heraus entstanden und hat wirklich rein gar nichts mit meiner Tätigkeit oder meinen Arbeiten zu tun.

Die letzten Tage habe ich mir über einen erneuten Wechsel gedanken gemacht. Dies wäre die vierte Internetadresse, unter der meine Webseite innerhalb von 6 Jahren erreichbar ist. Da ich aber dazu gelernt habe, hoffe ich, dass dieser eine Weile erhalten bleibt.

Wie er konkret heisst, verrate ich nicht.

Lieblings Freizeitarbeitsplatz: zu Hause

Arbeitsplatz: Zu Hause

Noch blöder: Ich sitze wirklich gerne zu Hause an meinem Computer. Ob es regnet oder drausen brüt wie in der Sahara, ich komm einfach nicht von meiner Maschine weg. Ich sitze einfach gerne vor dem Bildschirm, sogar noch, wenn ich abends von der Arbeit nach Hause komme und eigentlich bereits 8 Stunden vor dem Computer sass. Da sollte man doch die Nase voll haben?

Einzelphänomen?

Ich frage mich, ob ich der einzige Mensch bin, der ein Freizeit Workaholic ist; sich mit übermässig freiwilligen Aktivitäten beschäftigt bis keine Reserve mehr bleibt.

…und was machst du in der Freizeit?


Tags: , , , , | In der Kategorie Leben