In letzter Zeit habe ich mir verstärkt darum Gedanken gemacht, was ich mit dieser Seite machen könnte und eigentlich habe ich Lust, hier mal wieder zu bloggen.

Das wird dann wahrscheinlich auch passieren.

Ich bin mir aber noch nicht ganz über die Zeitplanung im Klaren. Ich will jetzt nicht einfach wieder starten sondern erst mal ein paar Beiträge vorbereitet haben, damit ich bei Zeitnot nicht wieder komplett inaktiv werde.

Ihr dürft jetzt gerne auch Wünsche für Beiträge hinterlassen. Oder ich mache ungefähr so weiter, wie ich aufgehört habe.

Außerdem wird es wohl ein Redesign geben. Was aber noch nicht 100% sicher ist. Es sollte meiner Meinung nach aber jeder auf den ersten Blick sehen, dass hier wieder was passiert, wenn er dieses Blog besucht. Außerdem macht mir das momentane Design an zu vielen Stellen zu viel Arbeit und ist teilweise sehr schlampig umgesetzt. Für den Fall der Fälle würde ich mich sehr freuen, wenn ihr hier schon mal eure Wünsche für ein neues Design hinterlassen würdet.

Mal schauen, inwiefern ich euch über den Fortschritt der Wiederbelebung auf dem Laufenden halten werde, aber ihr habt bei Twitter wahrscheinlich die größte Chance Neuigkeiten zu erfahren.

Achja: Es tut mir Leid, dass ich keine Kommentare mehr freigeschaltet habe. Das versuche ich möglichst bald nachzuholen.

Ich freue mich sehr auf Kommentare und ich hoffe, dass sich dieser kurze Text, trotz meiner etwas längeren Abwesenheit von der Bloggingwelt, noch ganz gut liest

Deutsche Beiträge gibt es leider nur zwei. Wenn ihr gute Beiträge parat habt, verlinkt sie einfach. Meine Nutzer Links sind ja dafür da.

Viel Spaß mit den Link-Tipps. Kommentare freuen mich natürlich. Übrigens fehlt den unteren Beiträgen ein Bild, weil es einfach sinnlos ist, ein Screenshot von der Überschrift zu machen. Bitte die Links nicht übersehen

WordPress Visual Cheat Sheet

Template Tags mit Erklärung und Parametern zusammengefasst auf mehreren Seiten.

Advanced Photoshop Techniques that you may not be aware of

Ich mache selber ja nicht viele Tutorials mit, aber diese Techniken sind kurz und nützlich. Also einfach mal kurz angucken.

Examples of Excellent Blog Post Formatting and Styling

Endlich mal ein Beitrag der nicht nur die Startseiten zeigt sondern auch auf gut gestaltete Unterseiten eingeht. Super Inspiration.

15 Examples of Well Designed Contact Pages

Hier findet ihr 15 gut gestaltete Kontaktseiten. Sind sicherlich einige Anregungen dabei. Es muss ja nicht immer nur ein einfaches Formular sein.

Getting Clients to Embrace Fresh Ideas

Man soll als Webdesigner auch innovieren. Leider spielen die Kunden da häufig nicht mit und genau an dieser Stelle setzt der Beitrag an. Wie überzeugt ihr eure Kunden, neue Ideen anzunehmen?

Essential CSS/HTML Lists Styling Techniques

Die letzten Link-Tipps enthielten schon Tipps zum Thema Listen. Dieser Beitrag zeigt eher die Basics, ist deswegen aber nicht weniger nützlich.

Simple CSS Tips that Go a Long Way

Was ihr beim Schreiben eurer CSS Datei noch so alles machen könnt. Viele dieser Tipps sind eigentlich selbstverständlich, werden aber sicherlich noch an vielen Stellen vergessen.

Overlaying Text on Images: What You Need to Consider

Text über Grafiken – eine nette Sache, bei der man einiges falsch machen kann. Dieser Beitrag zeigt do’s and dont’s.

Free Texture Tuesday: Noir Grunge

Hier gibt es ein paar nette Texturen zum kostenlosen Download.

50 Examples of Effective Uses of Typography Within Web Design

Ausgefallene und vor allem gute Typographie trifft man im Web immer häufiger an. Dieser Beitrag zeigt 50 Beispiele.

10 Techniques for a Powerful CMS using WordPress

Wordpress als CMS ist schon lange ein Thema und auch dieser Beitrag greift es auf und gibt nützliche und wichtige Tipps.

Tipps vom Verbesserer

Neid muss man sich verdienen, Mitleid bekommt man geschenkt. Ganz besondere Präsente sind die freundlichen Hinweise auf wirklich katastrophale Fehler bei der Erstellung von Webseiten. Diese Hinweise kommen nicht von den eigenen Kunden, sondern von “Kollegen”. – Nils Pooker

Ein interessanter Beitrag.

Der Kunde ist König

Dieser Beitrag geht noch näher auf einige Punkte ein, die im Vorhergenannten angesprochen wurden und ist ebenso lesenswert.

Bitte beachtet die Notiz am Ende des Beitrags.

Kommentare sind natürlich erwünscht. Wenn ihr keine Links mehr braucht oder sie vielleicht seltener haben wollt, sagt es mir

Wp Topics

Bei WP Topics werden die neusten Artikel der bekanntesten Wordpress Blogs gesammelt. Ähnlich wie ein Feedreader und ein Muss für jeden Wordpress Fan.

How Increased Productivity Can Hurt You

Warum hohe Produktivität auch schaden kann erklärt dieser Beitrag. Meiner Meinung nach ist der Titel nicht ganz korrekt. Der Beitrag erklärt eher, was Produktivität nicht ist Wichtige Punkte. Unbedingt lesen.

What Every Graphic Designer Should Do Right Now

Wichtige Hinweise für jeden Webdesigner, die eigentlich selbstverständlich sind (wie zum Beispiel regelmäßige BackUps) und trotzdem gerne vergessen werden. Da tut eine kurze Erinnerung doch gut.

8 different ways to beautifully style your lists

Auch Listen können gut aussehen und einzigartig sein. Dieser Beitrag zeigt viele nützliche Tipps, mit denen sich leicht die etwas andere Liste erstellen lässt.

Trend: Javascript sliders and WordPress

Die Zusammenarbeit von JavaScript und Wordpress ist auch eines meiner Lieblingsthemen und dieser Artikel gehört deswegen natürlich in die ersten Link-Tipps. Er zeigt nicht nur viele Beispiele sondern hat auch ein kurzes Tutorial und fertige Skripte parat.

404 Error Pages for Your Viewing Pleasure

404 Seiten haben sich zu einer Spielwiese entwickelt. Normalerweise wird man sauer auf den Webmaster, aber die Seiten, die in diesem Beitrag präsentiert werden, verhindern das bestimmt

Tips for the Journey of Choosing a Business Name

Namensfindung ist immer eine schwere Geschichte und deshalb kann dieser Beitrag dem ein oder anderem bestimmt helfen.

How a design blog is attractive to clients

Hier wird beschrieben, warum ein Designblog auch für die Kundenakquise nützlich sein kann. Naja, ich weiß nicht.

35 Fresh and Useful jQuery Plugins

jQuery… auch sehr interessant. Hier gibt es 35 zu Teil wirklich ziemliche coole Plug-Ins.

10 Best Content Management Systems for Designers

Ich selber arbeite gerne mit Wordpress, aber ein paar Alternativen sind ja auch nicht verkehrt und die bekommt ihr in diesem Beitrag reichlich.

7 Key Principles That Make A Web Design Look Good

Hier ist mal wieder eine kleine Übungsstunde zum Thema gutes Webdesign. Wer die Prinzipien noch nicht kennt, unbedingt lesen.

19 top fonts in 19 top combinations

Schriftwahl ist immer schwer und bei der Kombination von Schriften kann man schnell so ziemlich alles kaputt machen. Hier gibt es eine kleine Hilfe.

12 Essential Plugins that Extend WordPress as a CMS

Ich kannte fast keines dieser Plug-Ins (das meiste habe ich bisher auch nicht gebraucht), die das Blogging System zu einem richtigen CMS ausbauen sollen und bin mir sicher, dass sich für einige von euch ganz neue Möglichkeiten eröffnen.

Trends in Pricing Page Design and Layout

Ein wenig Inspiration ist auch nicht schlecht und vor allem, wenn sie thematisch so eingegrenzt ist und nicht schon 100fach gesehen wurde. Diese Sammlungen bietet Inspiration für eure Verkaufsseiten.

Wie kann ich hier reinkommen?

Nein, ich verlinke nicht nur englischsprachige Blogs. Und ich möchte auch gerne unbekannten Blogs helfen. Allerdings kann ich unmöglich alle Blogs verfolgen und in meinem Feedreader sind die meisten nun mal eher international. Wenn ihr einen guten Beitrag geschrieben habt, der thematisch zu dieser Webseite passt, könnt ihr gerne meine Nutzerlinks benutzen, um mich darauf aufmerksam zu machen.

Allerdings gibt es dabei einiges zu beachten und man sollte nicht allzu leichtfertig mit den neuen Möglichkeiten umgehen. Deswegen gibt es in diesem Beitrag Tipps zu dem Thema, die ich euch an Beispielen veranschauliche.

Kommentare würden mich natürlich sehr freuen. Viel spaß mit dem Beitrag.

Beispiele

ANidea

Red Rock

ecoki

Hoddows Gastwerk

Kosciuszko Alpine Guided Walks

Hills & Dales Estate

FA Design

Tipps

Die oben gezeigten Beispiele gehen teilweise mit ihren Hintergründen komplett verschieden um und daran kann man auch die Probleme erkennen, die einem bei der Arbeit mit großen Hintergrundbildern im Weg stehen.

Abschneiden oder skalieren?

Die Hintergrundbilder dürfen natürlich gewisse Dimensionen nicht überschreiten, damit man den Besuchern die Ladezeit noch zumuten kann. Irgendwann ist jedes Hintergrundbild zu Ende und hat dann hässliche harte Rändern.

Man kann an dieses Problem auf verschiedene Weise herangehen. Entweder man lässt das Hintergrundbild automatisch auf die Größe des Monitors des Betrachters vergrößern oder verkleinern (http://www.hillsanddales.org/) oder man nimmt das Radiergummi Werkzeug in Photoshop und macht die harten Rändern etwas angenehmer (http://anidea.com/).

Ich empfehle die zweite Möglichkeit. Lässt man das Hintergrundbild automatisch vergrößern oder verkleinern, sieht das häufig ziemlich furchtbar aus. Denn wenn die eigentliche Breite und Höhe des Bildes überschritten ist, wird daraus ein Pixel Salat. Dann nehme ich lieber ein Hintergrundbild mit 1920px Breite und radiere die Ränder weg.

Lenken die Bilder ab?

Bei Webseiten mit wenig Inhalt ist das nicht so das Problem, aber beispielsweise bei Blogs sollte man sich fragen, ob ein großes Hintergrundbild nicht zu sehr ablenkt. Meiner Ansicht nach ist das ein sehr wichtiger Punkt. Wenn das Hintergrundbild schlecht gewählt wurde, kann man sich schwerer auf den Inhalt konzentrieren.

Wie wählt man also das beste Bild oder wie sorgt man dafür, dass die Bilder weniger ablenken?

• Oben spielt die Musik - http://anidea.com/ Ist ein gutes Beispiel dafür, wie es funktionieren kann. Wenn man das Bild hauptsächlich auf den oberen Bereich konzentriert und es nach unten hin ausradiert, hat man bei wesentlichen Teil des Fließtextes wieder einen weißen und überhaupt nicht störenden Hintergrund
• Geringer Farbumfang – Das Bild sollte nicht zu viele Farben enthalten. Sonst wird es zu unruhig und zieht die Blicke geradezu an.
• Weichzeichner – Oben seht ihr recht häufig, dass ein Weichzeichner verwendet wurde, um das Bild unkenntlich  und unauffälliger zu machen. Die scharfen Kanten des Contentbereichs drängt sich dann deutlicher in den Vordergrund und die Hintergrundbilder stören weniger.
• Geringer Kontrast – Und damit meine ich nicht nur die Farbe. Bei http://www.hoddows-gastwerk.de/ kann man das Bild gar nicht übersehen. Und wäre es ein Blog, würde ich von diesem Bild abraten. Die Farbigkeit des Bildes sticht stark ins Auge. Vor allem, da der Rest der Seite schlicht schwarz ist. Zudem ist es im zentralen Punkt der Komposition.

Was man nicht machen sollte

• Zu viel des Guten - Ich könnte http://anidea.com/ in den Himmel loben, wenn nicht bei jedem Seitenaufruf ein neues Bild laden würde. Das stört extrem, da der Seitenaufbau so stark verlangsamt wird und sich die Seite ständig verändert. Eigentlich soll man dort lesen, aber die immer neuen, und wirklich guten, Hintergründe machen das nicht einfacher.
• background-attachment:fixed; - Benutzt das bitte nur, wenn ihr euch sicher seid, dass das Bild nicht zu sehr nervt. ANidea hat das schon richtig erkannt und darauf verzichtet.
• Slideshow im Hintergrund – Letztens ist mir eine Seite begegnet, die im Hintergrund eine Flash Slideshow abgespielt hat. Das ist ein absolutes No-Go und lenkt einfach nur von allem anderen ab.
• Zu viel Transparenz – Es ist sehr verlockend ein wenig mit der Transparenz zu spielen und das Bild durchscheinen zu lassen. Das kann auch wirklich gut aussehen, allerdings macht man es dem Leser dadurch nicht einfacher. Bei wenig Text ist das in Ordnung, aber ein unruhiger Texthintergrund stört irgendwann einfach nur noch.

Wichtig: Bedenkt euren mobilen Nutzer

Habt ihr eine Seite, die Nutzer bindet und auch mit iPhones und ähnlichen mobilen Endgeräten besucht wird, schaltet das Hintergrundbild für diese ab! Das vergessen sehr viele Webdesigner und man kann keine viel größeren Fehler machen. Es kostet eine Menge Ladezeit und der iPhone Besitzer wird euch nicht dafür danken, dass ihr seinen kostbaren Traffic für ein Hintergrundbild verschwendet, dass er auf Grund der Auflösung meistens eh nicht sehen kann.

Optimiert die Bilder

Auch wenn hohe Bandbreiten Standard sind, solltet ihr die Bilder so gut wie möglich optimieren. Diese Sammlung von 8 Tools für die Bildoptimierung könnte hilfreich sein. Beim Smashing Magazine findet ihr außerdem clevere Optimierungstricks für jpg und png Dateien.

Für Fortgeschrittene

Mal wieder der Kulturbanause Hier ist der Hintergrund nicht nur ein Hintergrund sondern geht auch in Vordergrund über. Die Seite selber ist in die Landschaft integriert und das ist natürlich noch etwas besser, als einfach nur ein Bild in den Hintergrund zu packen. Gleichzeitig steigt aber auch der Schwierigkeitsgrad stark an und man sollte sich seiner Sache wirklich sicher sein. Lieber darauf verzichten als am ende eine halbgare Lösung präsentieren.

Es müssen nicht immer zwei Hintergründe sein

Die meisten Seiten benutzen zwei Hintergründe: Einmal das große Bild und dann noch einen Hintergrund, meist weiß, für den Text. Das muss nicht sein. Wenn man einen Hintergrund hat, der Farbflächen bietet, kann man den Text auch direkt darauf platzieren.

Gleichzeitig wurde hier der Hintergrund noch animiert. Bin ich kein Fan von. Mir erschließt sich nicht, warum man die Aufmerksamkeit auf das Schiff lenken sollte und das very new steht so oder so schon im Vordergrund. Wenn eine Animation aber wirklich sinnvoll ist, kann man das machen.

Ich schildere in diesem Beitrag, wie man seine Fähigkeiten meiner Meinung nach sehr gut weiterentwickelt. Es geht einfach mal wieder darum, seine Einstellung vielleicht etwas zu verändern.

Ich freue mich sehr darauf zu lesen, was ihr dazu sagt und habe deswegen die Kommentarfunktion geöffnet Viel Spaß mit dem Beitrag.

P.S. Ich weiß, es ist viel Text. Bitte lasst euch nicht zu sehr abschrecken. Versucht es wenigstens

Seid aufgeschlossen

Ich arbeite momentan an einem Projekt, bei dem ich alle Freiheiten habe. Ich bin auch Mitwirkender und für die Internetpräsenz verantwortlich.
Jedenfalls entsteht die Seite, wie sollte es auch anders sein, auf der Basis von Wordpress. Dazu muss man sagen, dass ich wirklich kein Programmierer bin. Ich komme gut mit xHTML/CSS klar, aber bei PHP ist dann Schluss. Ich habe kein Buch gelesen oder mich durch die vielen Tutorials im Internet gequält. Trotzdem war es nie ein Problem, ein einfaches Blog mit ein paar kleinen Extras umzusetzen. Dafür gibt es genügend Tutorials und auch wenn man nur eine Liste der Template Tags hat, lässt sich das meiste ohne große Schwierigkeiten machen.

Bei dem bereits erwähnten Projekt stand ich aber vor ein paar Hürden, die für einen nicht Programmierer ziemlich unüberwindbar schienen. Thumbnails ohne Custom Fields, eine Jobbörse, einen Terminkalender, Related Posts mit Thumbnails ohne Custom Fields waren nur ein paar der Dinge, die ich nie ohne Plug-Ins gemacht hatte.

Der Weg gabelte sich hier: Ich konnte befreundete Programmierer anrufen, Plug-Ins nehmen oder mich selber an die Arbeit machen. Ich entschied mich für letzteres. Ich habe das gesamte Theme umgesetzt. Jetzt nimmt sich Wordpress automatisch das erste Bild aus einem Beitrag, verkleinert es und schneidet es dann noch, damit keine Proportionen versaut werden. Danach wird es schön in der gewünschten Größe auf der Startseite ausgegeben.

Für den Terminkalender habe ich ein Plug-In genommen. Blöd, dass ein Plug-In fast nie genauso ist, wie man es haben möchte. Deswegen habe ich mich damit beschäftigt und gelernt, an welchen Schrauben ich drehen muss.

Das habe ich natürlich nicht alles selber geschrieben. Viel mehr habe ich mir Code Schnipsel aus dem Internet gesucht und zusammengesetzt.

Das hat mich alles viel Zeit gekostet. Was habe ich davon?

• Ich habe den Code für später.
• Zweitens lerne ich so mit dem Code umzugehen. Ich weiß, wo ich etwas verändern muss, damit das Ergebnis anders ist. Ich weiß, wann ich einen Fatal Error erzeuge. Jetzt kann ich nicht nur den Code stumpf von einem zum nächsten Theme kopieren sondern ihn auch verändern.
• Das Gute ist auch: Wenn ich mich mit einem Problem beschäftige, lerne ich nicht nur dieses zu beheben und zu verstehen. Ich lerne auch Wordpress besser kennen und ich lerne ein wenig PHP. Ich kann mein Wissen auf andere Probleme übertragen.
• Wenn ich das nächste Mal einen Kalender machen muss, kann ich das Plug-In ohne Probleme an die Bedürfnisse des Kunden anpassen.
• Was für mich außerdem entscheidend ist: Ich lerne immer besser, was möglich ist und welchen Aufwand es kostet. Das verschafft mir wesentliche Vorteile bei der Kalkulation und es eröffnet ganz neue Möglichkeiten in Sachen Gestaltung. Ich weiß, dass ich viele Dinge lösen kann und brauche mir bei der Planung keine Gedanken mehr darum machen, was für mich unlösbar ist und deswegen weggelassen werden muss.

Jeder, der sein Netzwerk schon bei einem kleinen Problem fragt und sich nicht selber ein wenig mit dem Code beschäftigt, hat diese Vorteile nicht.

Also: Wenn ihr in einer Mathestunde sitzt, schreibt nicht stumpf vom Nachbarn ab. Lasst euch lieber gleich von ihm erklären, warum es so ist. Oder erarbeitet die Lösung selbst. Wenn ihr das nächste Mal den Code aus einem Tutorial rauskopiert solltet ihr euch die Erklärung durchlesen und verstehen. Das kostet zwar alles Zeit, aber diese Zeit ist wirklich gut investiert. Denn eure Möglichkeiten steigen mit dem Wissen. Und wenn ich jetzt eine Jobbörse umsetzen müsste, würde es nur noch einen Bruchteil der Zeit in Anspruch nehmen. Auch mit erheblichen Veränderungen.

Nehmt nicht immer die erste Lösung

Ich erläutere das mal an dem Thumbnail Problem. Was kommt den meisten Leuten als erstes in den Sinn, wenn sie an Thumbnails und Wordpress denken? Custom Fields. Oder ein Plug-In. Beides wollte ich nicht. Ich bin extrem genervt von Custom Fields für Thumbnails. Man muss immer das Bild, welches meistens eine verkleinerte Version eines bereits vorhandenen Bilds ist, verkleinern und das Custom Field ausfüllen. Zwei Arbeitsschritte, die man sich meiner Meinung nach sparen sollte. Das macht das Theme auch benutzerfreundlicher. Also habe ich nach einer anderen Lösung gesucht. Wie meine Thumbnails nun generiert werden, habe ich bereits oben geschrieben.

Wieder etwas, was meine Wordpress Arbeiten meiner Meinung nach deutlich verbessert und auch für Kunden viel angenehmer macht.

Ein wesentlicher Bestandteil von Weiterentwicklung ist die Suche nach Alternativen. Auch wenn ein System funktioniert, heißt das nicht, dass man es nicht noch optimieren könnte. Wenn alle nach dem Grundsatz „Never Change a running System“ agieren würden, würde unsere Welt still stehen.

Macht private Projekte

Das Problem bei den oben genannten Methoden sind die Deadlines. Man muss klar sagen, dass Kunden normalerweise nicht bereit sind, die Deadline nach hinten zu verschieben, nur weil der Webdesigner sich weiterentwickeln will. Der Ausweg aus dieser Misere sind eigene Projekte.

Eigene Projekte müssen nicht immer wertvolle Zeit vergeuden. Wenn man es schlau anstellt, kann man damit auch gutes Geld verdienen. Wenn ihr zum Beispiel ein Wordpress Theme entwickelt könnt ihr es online verkaufen. Dabei habt ihr keine Deadline und könnt euch austoben.

Oder ihr lasst euch bei dem nächsten Redesign ein wenig mehr Zeit. Es lohnt sich.

Wenn das Projekt, an dem ich gerade arbeite, sein Ziel verfehlt und keinerlei Einkommen generiert, habe ich wenigstens viel dazu gelernt und nehme etwas mit. Weiterhin ist zu sagen, dass es viel mehr Spaß macht, wenn man selber Lösungen findet und sich entwickelt.