Neue Startseite auf Selbständig im Netz – 13 Wochen Projekt 2016 – Rückblick Woche 1

Neue Startseite auf Selbständig im Netz - 13 Wochen Projekt 2016 Woche 1Die erste Woche des 13 Wochen Projekts ist geschafft.

Ich hatte mir für die vergangenen 7 Tage gleich mal eine gar nicht so einfache Aufgabe vorgenommen, die ich aber schon lange vor mir herschiebe.

Wie die Umsetzung der neuen Startseite von “Selbständig im Netz” lief, erfahrt ihr im Folgenden.

Neue Startseite – Rückblick Woche 1

In einem Blog ist es ganz normal, dass auf der Startseite die letzten Artikel in chronologischer Reihenfolge angezeigt werden.

Doch “Selbständig im Netz” ist schon lange kein normaler Blog mehr. Eher ein Business-Magazin, in dem ich inzwischen auch viele statische Inhalte veröffentlicht habe. Zudem sind viele der älteren Artikel zeitlos und damit immer noch lesenswert.

Es war also an der Zeit die Startseite ein wenig zu verändern und etwas Neues auszuprobieren. Das ist natürlich auch für mich Neuland gewesen und entsprechend viel Zeit habe ich in den letzten Tagen in diese Aufgabe investiert.

Hier nochmal einen Blick auf die alte Startseite:
Neue Startseite auf Selbständig im Netz - 13 Wochen Projekt 2016 Woche 1

Analyse
Als erstes habe ich mir die Statistiken für die Startseite angeschaut. Natürlich hatte ich mir bereits Gedanken über die Inhalte der Startseite gemacht, aber ohne eine Analyse der Besucher wollte ich die Änderungen nicht vornehmen.

Erstbesucher / Wiederkehrende BesucherUnd eine wichtige Erkenntnis, die mich ein wenig zur Änderung meiner Pläne gezwungen hat, war das Verhältnis von Erstbesuchern zu wiederkehrenden Besuchern. Viele nehmen an, dass die Startseite vor allem von Lesern besucht wird, die das erste mal da sind.

Dem ist aber nicht so, wie meine Statistik bestätigt. Lediglich 38,8% der Startseiten-Besucher sind zum ersten mal auf meinem Blog. Dagegen sind 61,2 % wiederkehrende Besucher.

Also sind fast 2/3 der Besucher nicht neu. Die Startseite mit Informationen allein für neue Leser zu befüllen, wäre also nicht ideal.

Inhalte für Startseite
Daraufhin habe ich mir Gedanken darüber gemacht, was für wiederkehrende Benutzer sinnvoll ist. Aber natürlich habe ich auch Content zusammengetragen, der für neue Besucher nützlich ist.

Im Zuge meiner Überlegungen habe ich mir zudem viele andere Blogs und Websites angeschaut und dort den Aufbau der Startseite analysiert. Und ich habe Artikel wie diesen gelesen und versucht Inspiration und Ideen für meine Startseite zu bekommen.

Ein wichtiger Aspekt war dabei ein klarer “Call to action”, den ich auf der Startseite einbauen wollte. Aktuelle Aktionen und Events stehen dabei im Vordergrund. Ebenso wollte ich meinen wichtigsten Newsletter etwas stärker promoten und Hilfe für neue Leser in bestimmten Themenbereichen anbieten.

Für die wiederkehrenden Leser habe ich aber auch die letzten Artikel eingebaut, allerdings in einer etwas kompakteren Art und Weise.

Es war also ein Balance-Akt zwischen Inhalten für neue und wiederkehrende Leser.

Design
Neue Startseite auf Selbständig im Netz - 13 Wochen Projekt 2016 Woche 1Für das Design der Startseite habe ich die Möglichkeit ins Auge gefasst, auf die rechte Sidebar zu verzichten. Die ist zwar für meinen eigentlichen Blog sehr wichtig, aber auf der Startseite vielleicht eher ein wenig ablenkend und zu viel des Guten.

Also habe ich die rechte Sidebar ausgeblendet und damit mehr Platz in der Breite geschaffen.

Meine Ideen für das Startseiten-Layout habe ich übrigens auf Papier skizziert (siehe rechts) und immer wieder neue Designs durchgespielt.

Wichtig war mir dabei, dass ich im rechten oberen Block aktuelle Aktionen, Events oder Angebote präsentieren kann. Hier sind solche Sachen wie ein Autoresponder-Kurs, aktuelle Rabatte, eine neue Nischenseiten-Challenge und vieles mehr denkbar.

Dazu muss ich sagen, dass ich kein gelernter Webdesigner bin und immer die Erfahrung mache, dass ich meine ersten Entwürfe furchtbar finde. Mittlerweile weiß ich aber auch, dass ich einfach dranbleiben muss und dann wird das schon. Auch diesmal war das so, aber mit dem aktuellen Stand bin ich erstmal ganz zufrieden.

Klar ist allerdings auch, dass die Startseite keineswegs fertig ist. Das ist sozusagen die erste Version und ich werde daran in den kommenden Wochen und Monaten weiter arbeiten. Dazu werde ich die Startseite unter anderem mit CrazyEgg analysieren und mir anschauen, wohin die Besucher klicken. Zudem werde ich mir die Daten in Google Analytics genau anschauen.

Auch technisch ist die Startseite noch nicht fertig. Wenn ich endgültig zufrieden bin, werde ich sicher noch einiges an CSS auslagern, die Ladezeit optimieren und ähnliches.

Für die Anzeige der letzten Artikel auf der Startseite habe ich übrigens das Premium-Plugin Content Views im Einsatz, von dem es auch eine kostenlose Version gibt.

Hier ein Screenshot der aktuellen Version meiner neuen Startseite:

Neue Startseite auf Selbständig im Netz - 13 Wochen Projekt 2016 Woche 1

Blog-Seite
Da die Startseite nun statisch ist, auch wenn dort einige letzte Artikel angezeigt werden, brauchte ich auch noch eine richtige neue Blog-Artikel-Seite. Das ist in WordPress aber sehr einfach machbar.

Man erstellt einfach eine leere Seite und unter “Einstellungen > Lesen” wählt man dann die Option “eine statische Seite (unten auswählen)” und stellt dort die beiden neuen Seiten ein.

Zudem habe ich die statische Startseite (Home) und die neue Blog-Artikel-Seite (Blog) in der Haupt-Navigation verlinkt.

Das neue Design der Startseite habe ich in diversen Browsern getestet, aber auch auf dem Smartphone. Dennoch freue ich mich auf euer Feedback, falls euch Probleme auffallen.

Erfahrungen aus Woche 1

In der ersten Woche habe ich mal wieder gelernt, dass viele Dinge in der Theorie immer so einfach klingen, aber die Umsetzung nicht so einfach ist.

Für mich war es ein Herantasten an eine Lösung, mit der ich erstmal leben kann. Viel wichtiger ist nun aber zu schauen, wie sich die Startseite entwickelt, welche Erfahrungen ich damit mache und wie das Feedback der Nutzer aussieht.

Nichts ist jemals wirklich endgültig fertig. Es gibt immer was zu lernen und es entwickelt sich weiter.

Ich bin aber sehr froh diese Sache nun endlich angegangen zu sein und freue mich auf die weitere Entwicklung.

Einfach mitmachen

Wer nun selber Lust darauf bekommen hat ein eigenes 13 Wochen Projekt zu starten, kann das natürlich jederzeit tun. Wer weniger Zeit hat, kann auch ein 4 Wochen Projekt starten. Hauptsache, man arbeitet ein paar Aufgaben von der eigenen To-Do-Liste ab. 🙂

Einfach einen Aufgaben-Plan für die einzelnen Wochen erstellen und wöchentlich über den Fortschritt berichten.

Ich nutze bei Twitter übrigens den Hashtag “#13wochenprojekt”. Wenn ihr das auch macht, fällt es einfacher die Teilnehmer-Artikel zu finden. So kann ich den einen oder anderen Artikel von euch in meinen Reports verlinken.

Zwei Reports kann ich hier schon verlinken. Zum einen macht Jens mit, der die meiste Zeit der 13 Wochen für den Aufbau einer Nischenwebsite nutzen will. Das 13 Wochen Projekt dafür zu nutzen, ist ein interessanter Ansatz. Aber warum nicht.

Und auch Sebastian kombiniert Nischenseiten-Aufbau und 13 Wochen Projekt. Da können wohl einige die nächste Nischenseiten-Challenge nicht abwarten. 😉

So geht es weiter

In Kürze erscheint mein Artikel zur zweiten Woche. Darin stelle ich meine nächste Aufgabe vor.

Peer Wandiger

19 Gedanken zu „Neue Startseite auf Selbständig im Netz – 13 Wochen Projekt 2016 – Rückblick Woche 1“

  1. Hi Peer,
    coole Startseite 🙂 Wie kriegst du das von der Formatierung hin mit den Blöcken bei “Ich brauche Hilfe beim….”. Ich stelle mir das kompliziert im WordPress Editor vor?!
    Liebe Grüße
    Lena

    Antworten
  2. Mein Feedback zur Startseite: Ich würde mehr Icons und/oder Bilder einbauen. Ist mir persönlich zu viel Text… gerade bei “Ich brauche Hilfe”, würde ich die Überschriften wie “Geld verdienen” noch durch Icons erweitern, die den Zweck auf den ersten Blick verdeutlichen. So wird die Seite besser “scannbar”.

    Bei den Blog-Artikeln würde ein “mehr Artikel anzeigen” Link, mit eventuellem nachladen der weiteren Artikel (Ajax), ebenfalls wunder wirken. Alternativ könnte der Button dann zur Blogseite weiterleiten oder ähnliches, nur sollte bei den Blog-Artikeln irgendetwas “weiterleiten” und nicht einfach im Leeren enden.

    Persönlich würde ich das Newsletter-Feld auch noch farbig hervorheben. Das grau lässt die Startseite sehr düster und trist wirken, finde ich, ein leichtes gelb oder orange würde die Conversion bestimmt noch verbessern und eine freundlichere Stimmung erzeugen.

    Der Rest sind Formatierungskleinigkeiten, die du selbst schon bemerkt haben wirst oder die du bald eh anpasst. Soviel zu meinem Feedback 🙂

    Antworten
  3. Hallo Peer,

    also insgesamt gefällt mir deine neue Startseite deutlich besser.

    Wobei ich natürlich jemand bin, der deinen Blog schon lange kennt und sich deswegen sowieso recht gut hier zurecht findet.

    Was mir besonders gut gefällt, ist die neue Übersichtlichkeit, dank logischer und lösungsorientierter Gliederung.
    Und dass die letzten 6 Blogartikel jetzt in waagerechter Reihe stehen, macht es für mich deutlich einfacher, zu sehen, was mich genauer interessiert.

    Viele Grüße

    Oliver

    Antworten
  4. Gefällt mir nicht. Einfach alles reingeknallt was nur geht. Die Startseite ist viel zu unruhig. Unpassende und verschiedene Farben. Grüße.

    Antworten
  5. Glückwunsch. sieht super aus und deutlich verbesserte Nutzerführung nach “Fragestellung” sozusagen…bin gespannt wie es weiter geht. Grüße David

    Antworten
  6. Hallo Peer,

    die Startseite ist wirklich sehr gut geworden. Dafür solltest du ein Plugin erstellen und verkaufen. Ich würde es sofort kaufen. Die meisten Leute haben wahrscheinlich keine Programmier Kenntnisse und würden ein solches Plugin gerne für Ihre Nischenseiten nutzen.

    Antworten
  7. Hallo Peer,
    bin das erste mal nach meinem Urlaub wieder hier. Mir hat die alte Startseite besser gefallen, da mich eigentlich nur die neuesten Blogartikel interessiert haben. Lese aber auch seit mindestens 7 Jahren regelmäßig “mit”, so dass ich mich immer schon ganz gut zurechtgefunden habe.
    Was mir aufgefallen ist: Bei mir am Arbeitsplatz im IE11 zieht sich das waagrechte Hauptmenü nun über zwei Zeilen. Der Punkt “Förderung” steht damit in der zweiten Zeile. Das sieht schrecklich aus.

    Antworten
  8. Hallo Peer,
    mir gefällt deine neue Startseite (noch) nicht! Da kannst du noch einiges verbessern oder abändern. Klar hast du jede Menge Inhalte und Seiten die von dort aus verlinkt werden sollten aber das vielleicht etwas anders 😉

    Nur Meckern ohne Konkretes zu nennen wäre auch nicht OK. Hier sind die Punkte die mich am meisten stören:

    – Das Grau der Newsletter-Box. Finde ich überhaupt nicht schön. Wie “Speedy” bereits vorgeschlagen hat, wäre da ein Gelb oder Orange wesentlich schöner. (z.B. rgba(240, 173, 78, 0.6); )

    – Die Boxen für die neuesten Blog-Artikel sind alle nicht gleich groß, vielleicht kannst du diese ja in einer Tabelle ausgeben lassen, sodass zumindest in einer Reihe alle Beiträge den selben Platz haben.

    – Platz: Wie oben gerade angemerkt, könntest du auch etwas mehr “Whitespace” zwischen den einzellnen Bereichen deiner Startseite lassen. Zum Beispiel über und unter jeder Zwischenüberschrift. Auch etwas mehr Platz zwischen den Reihen der letzten Beiträge würde “etwas Luft” nicht schaden.

    -Ich brauche Hilfe – ähh. Bilder. In deinem Drop-Down-Menü hast du schon einige Bilder eingebaut, was wirklich super aussieht. Anstelle der Texte könntest du im Punkt “Ich brauche Hilfe” auch solche Bilder platzieren und passend verlinken. So wird ein Besucher nicht so “erschlagen” von all dem Text.

    – Die Aktuelle Aktionen könntest du auch in einer Reihe platzieren, antatt untereinander.

    – Werbung: Klar, Werbung ist für dich und deinen Blog wichtig, dennoch finde ich den Block unten rechts unschön. Was hältst du von der Idee, die Werbung komplett zu entfernen und stattdessen eine zweite Box ähnlich der Newsletter-Box mit nur einer Werbeanzeige zu schalten? Für diesen Exklusivplatz kannst du dafür den Preis höher ansetzen 😉

    Was mir dagegen gefällt ist die Box in der du aktuell deine Einnahmen-Umfrage präsentierst. Ist das ein Plug-In oder wie tauscht du diese Inahlte aus, wenn eine neue Aktion so beworben werden soll?

    Ich bin gespannt, ob und welche dieser Vorschläge du umsetzt bzw. ausprobierst oder wie deine Startseite in Zukunft aussehen wird.

    Viel Spaß beim weiteren Optimieren.
    Schönen Gruß,
    Schmitt

    Antworten
    • Danke für deine umfangreichen Tipps und Vorschläge. Werde ich sicher in die künftigen Anpassungen einfließen lassen.

      Antworten
  9. Guten Morgen Peer

    Mal davon abgesehen das ich “es” nicht besser kann, geschweige den ein Ahnung habe wie Du das zustande gebracht hast…. aber ehrlich gesagt fand ich vorher besser, als nachher.

    Trotzdem Danke für all die wertvollen Infos, die wir hier immer wieder lesen dürfen!

    Grüsse, Marc

    Antworten
  10. Guten Abend

    Ich muss sagen, dass mir das neue Design recht gut gefällt. Vielleicht noch ein paar Punkte, die du verbessern könntest (allerdings wirklich nur Details):

    Der bereits erwähnte Fehler mit der zweizeiligen Navigation tritt bei mir sowohl im Internet Explorer als auch in Microsoft Edge auf (Auflösung 1366×786 und FullHD). In Chrome sieht es perfekt aus.

    Ich persönlich würde den Headlines ebenfalls ein wenig mehr Zwischenraum geben. Bei “Die aktuellsten Blog-Artikel” wird der untere Teil des Gs von der Artikel-Box überdeckt, was ein wenig komisch aussieht.

    Die Idee mit den Icons finde ich noch cool.

    Aber, wie gesagt, ich finde es trotzdem sehr gelungen, und es ist ja auch innerhalb einer Woche entstanden und, wie du selbst gesagt hast, nie wirklich fertig.

    Freundliche Grüsse
    Tobia Ochsner

    Antworten
  11. Hallo Peer,
    jeder weiß „Stillstand ist Rückschritt“ und daher müssen wir immer am Design arbeiten. Auch der Mut gehört belohnt, dass du dein Design anpasst!
    Ich war so frei und habe deine Seite etwas analysiert. Dabei bin ich mir relativ sicher, dass Du die Punkte schon auf deiner ToDo-Liste hast ?
    Bin selbst auch ein Verfechter der statischen Seite gepaart mit dynamischen Inhalten!
    Nun aber zu den Punkten die mir aufgefallen sind…

    1.) Die Farbe vom Newsletter Container würde ich die gleiche Farbe geben wie dem Umfrage Div – background-color: rgb(238, 238, 238) und border: 1px solid und die Breite auf width: 600px
    2.) Das Element für die Suche würde ich über den Umfrage Container setzen. So ist es identisch mit allen anderen Seiten. Kombiniert man dies noch mit den Social Media Buttons, hätte man 5 Elemente wo Einleitungstext/Newsletter linksbündig sind und Suche/SocialMedia/Umfrage rechtsbündig. Sollte es Unterschiede geben in der Höhe, müsste man die Abstände oder Texte etwas anpassen. Ziel wäre ein sauberer Abschluss bevor man zu den aktuellen Blog-Artikel kommt.
    3.) Was hältst Du von der Idee, die Farbe vom E-Book noch weiter aufzugreifen? Die Buttons „Suchen“, „Anmelden“ identisch zum Button „Zur Umfrage“.
    Zuletzt im linken Menü „Kategorie“, „Die besten Artikel“ und die aktiven Seiten im Hauptmenü nicht mit Orange #ed7027/Grau sondern auch in Blau. Hier hab ich etwas mit den Webentwickler Tool vom Firefox gespielt und ein etwas helleres Blau gewählt rgb(0,128,255). Ganz vergessen das „im“ im Header und „Erfolgreich Selbstständig im Netz“ nicht vergessen 😉 So hätte man eine stärkere Bindung zur E-Book Grafik im Header.
    4.) Die aktuellsten Blogartikel… Div’s unterschiedlich in der Größe, vielleicht kann man das noch etwas anpassen. Kenne das Plugin nicht aber per CSS wird es wohl schwierig. Die 3 Punkte würde ich durch einen Link ersetzen ala [Weiterlesen]. Als letztes würde ich noch die Anzahl der Kommentare einfügen. Beim Anbieter habe ich zwar das More-Tag im Beispiel gesehen, jedoch keine Variante mit der Anzahl der Kommentare.
    Zuletzt noch eine Frage… Ist es so gewollt, das die Umfrage- und Newsletter Container erst ab einer gewissen Breite zu sehen sind?

    Alles in allem nur Kleinigkeiten die man mit der Zeit noch anpassen könnte.
    Schönen Tag noch und bei Fragen steh ich gerne zur Verfügung

    Antworten
  12. Hallo Peer,
    der Beitrag ist zwar schon älter aber einige Dinge fallen mir jedes mal negativ auf.
    “Above the Folder” finde ich keine relevanten Infos mehr für mich. Ich bin regelmäßig “da” und um zu den für mich interessanten aktuellsten Blogbeiträgen zu gelangen, muss ich erst scrollen. Die Blogbeiträge selbst sind “lieblos” zu Dritt in Kästchen nebeneinander aneinandergereiht. Jeglicher “Eye-Catcher” in Form eines Bildes o.ä. fehlt. Überhaupt: Fast nur Text (eine richtige Textsuppe), keine Bilder.
    Eine Möglichkeit durch seitenweise durch die älteren Blogbeiträge zu blättern – nach dem Motto “da war vor einigen Wochen doch mal was, da möchte ich nochmal nachlesen”, fehlt (oder finde ich nicht). Einzeln von Blogbeitrag zu Blogbeitrag zu springen mag ich nicht. Und bei der Suchfunktion tu’ ich mir meist schwer, die richtigen Suchbegriffe zu finden. Oh, hab’s jetzt doch gefunden: Menüpunkt Blog. Aber sei’s drum, nicht wirklich intuitiv.
    Alles in allem: Schade. Ich finde die neue Startseite nicht gelungen.

    Antworten
    • Dazu schreibe ich sicher in Kürze was. Ich wollte einfach wieder meine Blog-Startseite zurück, denn das ist es, was ich hier mache: bloggen. 🙂

      Antworten

Schreibe einen Kommentar