Templaterie Blog

Ihre Bildauflösung wird ermittelt, warten sie einige Sekunden…

Falls Ihr Browser nicht reagiert,
schalten Sie Javascript ein.

Oder klicken Sie: 800×600 (und kleiner)
oder 1024×768 (und grösser)
Enter #########-Consult

Ich hatte gerade wegen einer andere Seite Javascript deaktiviert … sonst wäre mir diese kleine Internet-Unart vermutlich nicht aufgefallen. Ich will mal Javascript wieder einschalten und dann schaun wir mal, was das javascript mit meine 1600 x 1200 und einem Fenster 1280 x 960 mit Karteireitern und der Developerleiste zusätzlich zur Bookmarkleiste im FF anstellt.

Oooooh optimiert für IE 1024 x 768 Pixelchen. Autsch. bei dem Layout klassischen dreispalten-Layout war das ein echter Nonsense. Ergebnis der Auswertung der Startseite Zeichen zu Inhalte: 2477 Quelltext, davon 48 Zeichen zählen als Inhalt, davon sind 11 Zeichen Firmenname, die restlichen 37 Zeichen laden dann Google-Sucher mit so sinnvoller Botschaft ein, dass die Site “Optimized for IExplorer, Flash, 1024×768″ sei und man “ENTER”n möge.

Filed under: Design, Webtechniken
No Comments

Eine Pinnwand für Office-Service-Webpräsenz

Wenn es mir die Petersilie ein wenig verhagelt, habe ich einen guten Ausgleich. Ich arbeite an einem Template frei von Kundenwünschen im Office. Ich mag das Template auch wenn in dieser Konstellation das Template etwas kruschtelig wirkt. Hier empfiehlt es sich bei den Möglichkeiten der Hervorhebung jeweils nur eine, maximal Zwei zu verwenden. Andererseits, Pinwände eines Büros sehen eben genauso aus. Sie wachsen schließlich organisch.

Nimmt man andererseits dieses Template für einen Trainer in Sachen Selbstmanagement, Büroorganisation, dann sollte die Site in jedem Fall deutlich aufgeräumter sein, doch die Spalten könnten einen Seminartag wiederspiegeln und ein Beispiel-Organigramm zeigen … eine Prioritätenliste, etc. Ich bin gespannt wie gut sich diese Gimmicks umsetzen lassen. Vorallendingen das Flipchart so hinzubekommen, dass in Editland möglichst wenig Schriftstile gebraucht werden, um es zu erzeugen.

Das Webtemplate TC-0057 A hatte ich heutemorgen vorgestellt und mitgeteilt, dass es im Shop ist. Am Website-Template B dieser Serie werde ich noch einige Stunden arbeiten müssen, bis aus dem Photoshopentwurf eine Website wird, auch mit der Grundlage, denn es sich dann doch ein paar Anderungen im Template, die ein wenig Trickreich sind.

Filed under: Design
No Comments

Das Website-Template TC-0057 A in der Galerie

Zunächst einmal wollte ich vor allen Dingen den Breitband-Kinostreifen und die kleine Papierecke haben. Ich dachte an einen Textblock im kinofilm-format-streifen der fest und fix in der Mitte sitzt, doch dann änderte ich meine Meinung bei der Arbeit und es wurde daraus ein liquides Design, dass sich seiner Umgebung anpasst, dabei aber stehts in den Proportionen ausgewogen ist. Wenn man mit diesem Design richtig umgeht und dem Design nicht Dinge auzwingt, das es nicht beherrscht, wie z.B. in den dreispaltern Bilder über die gesamte Spaltenbreite — wir erinnern uns, das Design passt sich in den Proportionen an: es gibt keine eineindeutige Spaltenbreite — dann sieht dieses Design topschick aus und macht einen gediegenen Eindruck.

Übrigens sind Bilder über die gesamte Spaltenbreite deswegen nicht ausgeschlossen, man muss nur die Bilder über Flash einbinden. Ein solches Plugin fehlt noch in der Editland-Plugin-Sammlung. Ich hätte theoretisch die Fähigkeiten ein solches Plugin zu Programmieren, aber im Moment tue ich mir das noch nicht an. Andere dürfen sich hier gerne vordrängeln … sei’s drum bindet man die Bilder über Flash ein, dann kann das Objekt so gestaltet sein, dass es sich den verändernden Spaltenbreiten ebenfalls anpasst und dabei die Bilder nicht häßlich verpixelt. Mit einem Kundenwunsch wird dieses i-Tüpfelchen im Design natürlich wie immer schneller realisiert, bis dahin … auch ohne dieses Flash-Bilder-Plugin ist das Template in meinen Augen eine Wucht. Ich mag es sehr.

Das Website-Template TC-0057 A im Shop

Filed under: Design
1 Comment

Wenn Mr Money dann endlich Auf das Wesentliche kommen[!] darf.

Und ich kann es ja sooooo nachfühlen: Wenn ein Kunde im Design den Farbklang versaut … *grinzzzz*

Via F-LOG-GE

Filed under: Kaffeetscherl
No Comments

Den Goldnen Schnitt kann man bolleneinfach konstruieren und braucht dazu auch keinen Taschenrechner um das Verhältnis 1:1,618 zu ermitteln, jenem mathematischen Ausdruck, der den goldenen Schnitt beschreibt:

Über die “Steuerungstaste (STRG) halten” kann man in den meisten Grafikprogrammen mit der Maus ebenmäßige geometrische Formen ziehen, als Quadrat, Kreis und gleichschenkliches Dreieck oder einen Stern, runde Schnecke, etc. Für den Goldenen Schnitt ziehen wir uns ein Quadrat. Im Garten machen wir in ein lange Schnur zwei schlingen und Spannen in gesteckte Stöcke ein solches. Mittels einer zweiten Schur und den Diagonalen von Ecke zu den jeweils schräg gegenüberliegenden Ecken ermitteln wir die Mitte das Quadrats mittels lotrecht nach unten und wir haben die Mitte des Quadratschenkels ermittelt. Im Grafikprogramm hilft uns mit dem Lot wieder die Steuerungstaste. Im Garten ist es eine Schlinge, schnur spannen und den Punkt suchen bei dem alle anderen links und rechts den Daumen nach innen führt, als wo die Tangente eines Innenkreises den Schenkel oder den Umriss des Quadrates berührt. Von der Mitte des Quadrates ist das Zentrum unsere nächsten Kreises. Der Radius wird über die Diagonale von der ermittelten Seitenmitte zur rechten oberen Ecke besimmt. Dort wo sich Kreisradius und die Verlängerung der unteren Kante des Quadrates trifft, ist der Goldene Schnitt.

Im Garten zur Abmessung des Rosenbeetes im goldenen Schnitt, dürften auch Latten in Kombination mit Schnüren geeignete Hilfsmittel sein.

Filed under: Design
1 Comment

Jedes Template beginnt mit einer Idee. Das aktuelle Template, das ich in vor ca. 2 Stunden begann, startete mit einer Papier-Ecke, die mir ins Auge sprang. Ich spielte mit den Möglichkeiten in Photoshop und im Spiel entwickelte sich die Idee weiter. Der Entwurf hat viel mit einer Seite zu tun, die mir ein Interessent kürzlich als Vorbild für seine Vorstellungen vorstellte. Aurelius Invest verwendet ein Blatt als Basis des Designs. Ich kann und will nicht Aurelius kopieren und denke, dass ich mit dem Entwurf weit genug entfernt bin.

Nachdem nun die Idee steht und die Grafiken exportiert wurden, gilt es sich Gedanken um die technische Umsetzung zu machen. Um nicht das Rad neu zu erfinden und wenn ich lange keine vergleichbare Lösung, bzw. das letzte Mal mit einer veralteten Technik das Layout umgesetzt habe, schaue ich zunächst einmal im Netz nach, was sich mir an Lösungsmöglichkeiten bieten.

Für die verticale Ausrichtung eines Streifens findet man folgende hilfreiche Seite: Vertical centering using CSS

Eine Lösung ist auf dieser Seite nicht wirklich vorhanden. Keine der Lösung ist Foolproofed. Eine Idee, die mir kam ist nicht aufgeführt. Noch habe ich von dem Photoshop-Entwurf noch keine Zeile umgesetzt. Meine Idee die mir vorschwebt arbeitet ähnlich wie die Methode der horizontalen Ausrichtung mit negativer Margin. Es wird ein Wrapper mit 100% benötigt und ein Div, der eine Höhe von 50% hat und über eine negative margin-bottom bis zur Hälfte der Höhe des nachfolgenden Divs mit fester Höhe den Platz freigibt für eben jenes nachfolgende DIV.

Da ich in dem Design nicht wirklich die Mitte anstrebe, werde ich mit anderne Prozentwerten arbeiten. Die Methode sollte mit den meisten Browsern arbeiten. Ich werde berichten (Update folgt in Kürze). Jetzt geht es erst einmal weiter … ja. Funktioniert wunderbar (more…)

Filed under: Design, Webtechniken
No Comments

Ein neues Buch in meiner Sammlung und letztlich dann vermutlich doch kein ganz so vorbestimmter Staubfänger hat sich in der Tat wirklich rentiert. Mit der Bestellung via Online-Buchshop (Etwas lästig war in diesem Fall auch die fast 14-tägige Wartezeit auf das Buch) verliert sich das blättern und schmöckern in der Buchhandlung und der erste Eindruck, ob ein Buch wirklich so eine gute Wahl war kommt erst nach dem Kauf. Doch mit der “Geometrie of Design” bin ich sehr zufrieden. Es ist nicht so sehr, dass in dem Buch allzuviel neue Erkenntnisse sind, eher, die anschauliche Darstellung holt die Proportion aus meinem Bauchgefühl in die Verstandesebene der Konstruktion mit Geodreieck, Zirkel und Lineal. Das Buch schafft dies ohne die Kreativität abzuwürgen. Ganz im Gegenteil es animiert das eine oder andere Konstrukt in ein Design umzusetzen.

Bildquelle Muschel: Wikipedia Image, Lister Martin conchs 1770

Auch die Beispiele des Designers und Typographen Josef Müller-Brockmann (Flashgalerie mit Werken von J. Müller-Brockmann insbesonder 8 in jener Sammlung) in dem Buch mit der geometrischen Auflösung / Analyse sind hier guter Stoff für viele viele Ideen.

Filed under: Design
No Comments

Wie man an der Galerie sehen kann, komme ich nicht so richtig dazu hier wirklich alles wieder ins rechte Lot zu bringen. Gestern wollte ich erst einmal die ins Blog “Silkester erzählt” ausgelagerten Beiträge hier zu verlinken und ggf. peut a peut auch den einen oder anderen hier hinein zu nehmen, denn doppelter Content hin oder her, dieses Blog hat dann doch ein anderes Zielpublikum als Silkester erzählt und eine andere Ausrichtung, dasheißt die Artikel sollten hier nicht verlinkt sein sondern der Content sollte an dieser Stelle über die Suchfunktion auch erreichbar sein.

Nachdem die Frist von der Entscheidung mit der Templaterie umzuziehen, der Erkenntnis, dass Robert “zeitgleich” intern bei Strato auf einen leistungsstärkeren Server umzog bis zum endgültig veranlassten KK-Antrag und somit dem Umstand, dass der A-Record nicht mehr auf mein kleines Gästezimmer bei Robert Basic auf dessen Server verwies … naja dass bei dem ganzen Hin und Her, Kreuz und Quer vier Monate vertreichen würden, war natürlich nicht geplant und da ich in dieser Zeit hätte täglich ein Backup fahren müssen um sicherzustellen, dass kein Beitrag und kein Kommentar verloren ginge, hätte ich hier weiter Beiträge eingestellt, zog ich es vor lieber Pause zu machen. So blieb es hier auffallend still und bei Silkester zwischendurch deutlich reger als üblich: (more…)

Filed under: Design, In eigener Sache, Kaffeetscherl, Programmierung, Projektplanung, Tools, Webtechniken
No Comments

MITCHELL
Hey! It’s bogus! Your followers are worshipping a phony relic.

CAIUS
Yes, but ultimately its true worth can only be judged by the genuine faith it instills in the hearts of the many pilgrims who come to visit the shrine. And, more importantly, in the charitable contributions they make while they are here.

DANIEL
Right.

Quelle: Transcript Stargate SG1 Episode 4 Season 9

Ich sollte nicht lästern, bin ich doch selbst ein Mitglied dieses Berufstandes, aber als ich so neben der Arbeit den Film laufen hatte, sprang mich der Gedanke an …

Filed under: Kaffeetscherl
No Comments