Das neue Scrolldesign auf dem Internetauftritt des neuen Volkswagen Beetle ist wirklich beeindruckend. Nicht nur, dass man eine Abfolge von Bildern runterscrollen kann, man kann auch bestimmte Effekte mit dem Scrollen auslösen, was den neuen Volkswagen Beetle noch schöner in Szene setzt.
Ein großes Kompliment an die Webdesigner, die hier im Auftrag für den Volkswagenkonzern tätig waren. Die Seite für den neuen Volkswagen Beetle ist wirklich beeindruckend.
Stand 25.12.2011
Da sich bei Autoherstellern Webdesigns im Laufe der Zeit schnell ändern, könnte es sein, dass man das Scrolldesign nur kurze Zeit wird sehen können.
Der Namo Webeditor ist Anfang Dezember als deutsche Version 9 erschienen und ich hatte mal kurz die Zeit, mir diesen kostengünstigen WebEditor näher anzusehen.
Was ich sah, hat mich mehr als begeistert! Es ist wirklich eine günstige Alternative zu Adobe Dreamweaver, Microsoft Frontpage bzw. dem Nachfolger Expression Web oder anderen Homepageerstellungstools. Gerade der Preis von unter 100 Euro ist wirklich beeindruckend.
Als Webdesigner oder Suchmaschinenoptimierer sollte man auch dafür sorgen, dass die eigenen Kunden durch den neuen Internetauftritt so wenig Spam wie möglich erhalten. Es folgen daher 10 effektive Maßnahmen, wie man Spam zu einem großen Teil verhindern, blockieren und filtern kann.
Nach dem Panda Update könnte das Freshness Update (Quelle) die Welt der SEOs erneut erschüttern (zumindest in bestimmten Bereichen).
Google wird bei 35% der Suchanfragen Suchergebnisse anders listen. Jetzt geht es vor allem darum, wie frisch ein Inhalt ist. Sucht jemand z.B. nach Fußball oder z.B. einem neuen Automodell, werden neuere Inhalte besser bewertet.
Geräte wie das iPhone und das iPad von Apple können in der Standardversion leider kein Flash abspielen.
Es folgen zwei Möglichkeiten, wie man als Webdesigner Flash (swf) bei der Gestaltung einer Webseite trotzdem einsetzten kann und sich gleichzeitig um z.B. iPhone oder iPad-User weniger Sorgen machen muß.
Man wird ja als Webdesignagentur beauftragt ein Design zu kreieren, dass dem späteren Betrachter eine gute User-Experience (ein gutes Benutzererlebnis) beschert. Hier sollte der Webdesigner aus meiner Sicht vor allem darauf achten, dass das Design übersichtlich ist, so dass der Betrachter sich schnell zurecht findet. Eine Methode um dies zu erreichen, ist die optische Aufteilung der Webseite.
Was ist eigentlich CSS? In einfachen Worten ist CSS eine Gestaltungshilfe für Webseiten.
Es geht also um das Design bzw. den Stil (Form, Größe, Farbe, Positionierung etc.) und nicht um den Inhalt (worüber die Webseite informieren möchte).
Beispiel: “font-size:12px;” Bedeutet, dass die Schriftgröße 12 Pixel groß sein soll (Ãœbersetzung: “font” bedeutet Schrift und “size” bedeutet Größe.)
Alle CSS Befehle sind in Englisch geschrieben. Wer Englisch kann, ist also klar im Vorteil.
Als Webdesigner kennt man das: Der Kunde schickt einem viele einzelne Bilder in hoher Auflösung. Die einzelnen E-Mails laden dann nicht nur lange, man verliert auch schnell den Überblick.
Besser wäre es, wenn der Kunde einem eine gebrannte CD/DVD schickt. Dies geht aber manchmal nicht z.B. aus Zeitgründen oder weil der Kunde keinen Brenner hat und sich vielleicht nicht so gut auskennt.
Deshalb hier ein alternativer Lösungsweg für Webdesign-Kunden, die einem für das neue Webdesignprojekt viele Bilder schicken möchten:
Problem: Bei manchen Webdesigns ist es notwendig, die Sichtbarkeit des vertikalen Scrollbalkens zu erzwingen und zwar aus folgendem Grund bzw. im folgenden Fall:
Manchmal ist die Startseite eines Webdesigns vertikal kleiner als die Folgeseiten bzw. manche Seiten im Webdesign sind nicht so lang als andere. Dann kann es dazu führen, dass das ganze Webdesign bzw. der Inhalt der Webseite nach links springt, weil sich auf einmal der vertikale Scrollbalken hinzuschaltet. Das ist unschön, da ein Design, wo nichts hin- und herspringt, für den Betrachter angenehmer ist.
Lösung: Dieses Zuschalten kann man unterbinden, indem man den vertikalen Scollbalken erzwingt. Hierzu trägt man einfach folgenden Code in die CSS-Datei ein:
Achtung!!! Seit der Skype-Aktualisierung im Oktober 2011 funktioniert die Umwandlungsunterdrückung der Telefonnummer in eine Skypenummer nicht mehr im Internet Explorer. Bei Anwendung des unten genannten CSS-Codes wird jetzt gar keine Nummer mehr gezeigt. Von daher rate ich, durch diesen neuen Umstand, von der unten genannten CSS-Lösung ab. Falls jemand eine Alternative hat, kann er diese im Kommentarfeld hinterlassen. Jedoch ist davon auszugehen, dass Skype auch in Zukunft Anpassungen vornimmt, um eine Umwandlung auch weiterhin stattfinden zu lassen, selbst wenn der Webdesigner es nicht möchte. Da Webdesign-Kunden auf die Anzeige der Nummer angewiesen sind (nämlich auch dann wenn deren Kunden Skype an haben) sollte man das Risiko lieber nicht eingehen. Wahrscheinlich bleibt als letzte Alternative die Nummer als Bild-Grafik einzufügen (anstatt als Text).
Kaum ist das Webdesign fertig und hochgeladen, kann es sein, dass Skype dann die Anzeige von Telefonnummern verändert. Jeder der Skype am laufen hat, sieht dann anstatt die Telefonnummer einen Skype-Button, mit dem man die Nummer per Skype anwählen kann.
Das ist vor allem peinlich, wenn z.B. durch die Skype-Einblendung die Telefon-Nummer in eine neue Zeile rückt, und das ganze Design umwirft. Der Webdesign-Kunde sieht dann den Skype-Button (den ich für sehr häßlich halte) anstatt nur der Telefonnummer.
Diese oftmals störende Funktion ist in bestimmten Browsern integriert und läßt sich durch folgenden Css-Trick über die ganze Seite abschalten. Hierzu fügt man einfach in der CSS-Datei folgenden Code ein:
Ich habe heute eine Webseite für einen Rechtsanwalt aus Gießen fertiggestellt, in der ich einen für mich neuen Effekt eingesetzt habe. Anstatt einen normalen Farbverlauf einzusetzen, habe ich dieses Mal dem Farbverlauf eine Körnerstruktur (Grain bzw. Noise) beigefügt. Dadurch erhielt der Farbverlauf einen schönen Effekt und somit einen edleren Touch.
Zur Verdeutlichung habe ich hier mal ein Schaubild (mit einer Vergrößerung) angefertigt, welche die Körnerstruktur verdeutlicht.
Es ist kaum zu sehen, aber gerade das Dezente macht das Besondere aus. Auf der Webseite des Rechtsanwalts sollte man es deutlicher erkennen können. Details sind es häufig, welche eine Seite des Kunden hochwertig erscheinen lassen.
Den Körnereffekt bekommt man z.B. mit Photoshop hin, indem man den Rauschfilter einsetzt. In meiner englischen Photoshop (CS4-Version): Filter > Noise > Add Noise (Im Deutschen vielleicht Filter > Rauschen > Rauschen hinzufügen).
Ich denke man kann da noch tolle Effekte entdecken, indem man das Rauschen variiert oder andere Rausch-, Licht- und Pixeleffekte einsetzt. Die Filterplaette bei Photoshop ist ja ziemlich groß.
Ich finde, dass der Abänderung von Farbverläufen im Webdesign bislang noch zu wenige Bedeutung geschenkt wurde. Hier kann man sehr viel neues erschaffen.
Es gibt im Internet verschiedene Ansätze, wie man z.B. Bilder vergrößert. Die hässlichste Methode ist es, einfach auf das Bild zu verlinken. Dann öffnet sich lediglich eine neue Webseite mit dem Bild. Eine andere, aber umständliche Methode ist es, eine Flashanimation zu machen. So wie ich z.B. für die Hollywood-Schauspielerin Anne B. Scott gemacht habe. Hier kann man sehr flexibel sein, jedoch ist diese Methode sehr zeitaufwendig.
Einfacher geht es z.B. mit dem Lightboxmodell. Mittlerweile in der zweiten Version von Huddletogether.com
Mit diesem Script lassen sich Bilder schön vergrößern und zusammenfassen, so dass sogar ein Bildbrowsen möglich ist.
Da sich dieses Skript zum Bildvergrößern und Bildergruppieren großer Beliebtheit erfreut, erschienen im Laufe der Zeit immer mehr Lightbox-Clone und Alternativen mit anderem Design und mehr Funktionen. Zum größten Teil sind diese Skripte kostenlos downloadbar.
Als Webdesigner sucht man häufig was Spezielles und so habe ich mich nach möglichen Lightbox-Alternativen umgeschaut. Ich liste mal eine paar Lightbox-Alternativen und Ihre Besonderheiten auf:
Google achtet seit dem Panda-Update 2011 verstärkt auf die Qualität des Inhalts einer Seite. Google erkennen die Qualität des Inhalts (engl. Content) vorwiegend anhand:
1. der Einzigartigkeit des Inhalts (z.B. Textpassagen, die es irgendwo anders schon mal gibt, werden missbilligt)
2. der Menge und Qualität der reinkommenden Links
3. der Verweildauer des Surfers (wann springt dieser wieder ab bzw. kehrt zur Googlesuche zurück)
4. der Menge an Text (zu wenig Text z.B. sehr kurze Seiten werden abgewertet)
5. der Menge an Bildern (Mehr Bilder ist besser)
6. der Anzahl an Kommentaren bei Blogs (mehr Kommentare kann auf ansprechendere Inhalte verweisen)
7. der Menge an Werbemitteln (zu viele Werbemittel auf der Webseite spricht eher für schlechteren Content).
8. der Präsenz in den social Media (guter Content wird auf Facebook geliked und auf Twitter getwittert)
Viele Low-Quality-Seiten führen wahrscheinlich auch zur Abstufung der Hauptsseite. Deshalb wäre es jetzt (per einer neuen SEOstrategie 2011) wichtig schlechte Seiten zu erkenne und zu löschen.
Dies kann man wie folgt tun:
Man installiert Google-Analytics und analysiert, welche Seite gut, welche Seite schlecht besucht wird und wie schnell jemand, die Seite wieder verläßt. Jemand der die Seite unter bestimmten Begriffen gefunden hat, dann aber die Seite wieder schnell verläßt, signalisiert Google, dass die Seite entweder nicht zu den Schlüsselbegriffen passt oder das der Inhalt nicht gut genug ist.
Jetzt kann man entweder die Seite verbessern, indem man die Schlüsselwort noch passender an der Seite ausrichtet und den Inhalt aufwertet (z.B. durch eine bessere Recherche). Oder aber man schmeißt die Seiten aus dem raus.
Diese neue Technik heißt Content-Weeding (engl. Inhalte aussortieren, rausschmeißen, entfernen). So hat man weniger Absprungraten und signalisiert Google eine wichtige Seite zu haben. Dies funktioniert vor allem sehr gut bei größeren Seiten.
Bookmarkdienst können einen wertvollen Beitrag zum eigenen Onlinemarketing sein. Man muss nur wissen, wie man es nutzt.
Ich hatte bislang meine eigenen Bookmarkeintragungen vernachlässigt und es könnte sein, dass es nicht viel bringt. Aber ich denke, es gibt Wege, um hier einen Nutzen zu ziehen.
Es folgt eine Liste mit Bookmarkdiensten die, wenn richtig eingesetzt, einen positiven Effekt für das eigene Onlinemarketing haben könnten.
Falls Sie sich fragen, ob Sie ein neues Webdesign lieber bei einer Werbeagentur oder doch bei einem Webdesigner bestellen möchten, können Sie sich hier ein Bild machen.
Wie kann man ein Hintergrundbild automatisch an die volle Browser-Fenstergröße anpassen und zwar so, dass es unter verschiedenen Gegebenheiten gut aussieht?
Es sollen keine weißen Balken produziert werden, Proportionen des Hintergrundbildes sollen erhalten bleiben (egal wie man skaliert), das Bild sollte immer zentriert bleiben, Scrollbalken sollte es nicht geben und unterschiedliche Browser sollten keine Kompatibilitätsprobleme haben.
Als Webdesigner und Internetagentur nutzt man häufig Bilddatenbanken, welche Bildlizenzen anbieten (Royalty free) und die man sich dann häufig mit anderen Unternehmen teilt. Man ist also nicht alleiniger Besitzer des Bildes, sondern hat lediglich eine Lizenz, die es einem erlaubt das Bild auf eine bestimmte Weise einzusetzen. Diese Lizenz ist, wie bereits erwähnt, nicht exklusiv, da sie auch von anderen Unternehmen erworben werden können .
Problematik: Da es eine Foto für ein bestimmtes Thema sein soll (z.B. Möbel), kann es also gut sein, dass die Konkurrenz des Unternehmens, für das man die Webseite erstellt, das gleiche Foto einsetzt. Das ist ziemlich peinlich. Oder es kann ein Foto sein, dass man an jeder Ecke sieht (das ist auch peinlich).
Viele werden sich bei der Domainnamenswahl fragen, welchen Domainnamen soll ich wählen und wird es mir schaden, wenn ich keine Schlüsselworte im Namen meiner Domain habe.
Bislang galt, dass eine Keyworddomain (also ein Domain welche die Schlüsselworte enthält) einen klaren Vorteil bezüglich den Suchergebnissen hatte. Beispiel: webdesign-musterstadt.de war besser als fantasiename.de, um unter dem Begriff “Webdesign Musterstadt” gefunden zu werden.
Dies hat Matt Cuts (die wichtigste Person bezüglich Googles Searchquality) jetzt einigermaßen relativiert bzw. hat mit seinem Team vor, dies zu relativieren:
Ich habe eine Webseite entdeckt, die mit Javascript eine tolle Bildnavigation hat. Was man bei Mobiltelefonen bereits kennt, hat sich diese Seite zu nutze gemacht: Per Wischen (bzw. klicken und ziehen) kann man die Bilder nach rechts oder links rutschen lassen.
Besucht die Webseite und dann haltet die linke Maustaste auf einem Bild gedrückt und zeichnet eine Linie nach links oder rechts. Die Fotos rutschen dann entsprechend nach links oder rechts. Tolle Slideshow, oder?
