Webdesign, Stockfotos, Plugins, Ladezeit-Optimierung … NSOC Rückblick Woche 1

Webdesign, Stockfotos, Plugins, Ladezeit-Optimierung ... NSOC Rückblick Woche 1Die erste Woche der Nischenseiten-Optimierungs-Challenge ist zwar technisch gesehen noch nicht vorbei, denn es ist noch bis Sonntag Zeit, aber ich habe meine geplanten Arbeiten an meiner Nischenwebsite bereits erledigt und berichte deshalb im Folgenden, was ich bzgl. Webdesign und Technik in den letzten Tagen optimiert habe.

Dabei gehe ich natürlich vor allem auf mein neues WordPress-Theme ein, welches ich eingebaut und angepasst habe. Aber auch die Themen Plugins, Navigation, WordPress-Multisite Probleme und Stockfotos kommen zur Sprache. Am Ende des Artikels liste ich meine investierte Zeit und meine Ausgaben auf.

Ich freue mich sehr über euer Feedback zu diesem Rückblick auf Woche 1 und wenn ihr Fehler seht oder Vorschläge habt, dann immer her damit.

Webdesign meiner Nischenwebsite

Jimdo Website BaukastenWERBUNG

In der ersten Woche habe ich mich mit den technischen Aspekten meiner mittlerweile 6 Jahre alten Nischenwebsite infrarotsauna-kaufen.de beschäftigt.

Diese lief zwar immer noch gut und hatte zum Beispiel sehr gute Ladezeiten-Werte, aber das verwendete WordPress-Theme war doch schon recht veraltet. Es handelte sich um das Standard-Theme Twenty Thirteen und ich hatte es manuell stark per CSS und in den Theme-Dateien angepasst. Gerade letzteres sollte man nicht machen, denn dann kann man das Theme nicht mehr updaten. Deshalb musste ein neues Theme her.

Während ich also beim Hosting-Anbieter All-Inkl.com* geblieben bin, da die Performance einfach gut ist, habe ich das WordPress-Theme gewechselt und in dem Zuge auch einiges am Webdesign geändert.

Theme-Wechsel auf GeneratePress Pro

Webdesign, Stockfotos, Plugins, Ladezeit-Optimierung ... NSOC Rückblick Woche 1Schon vor dem Start der Nischenseiten-Optimierungs-Challenge war mir klar, dass ich GeneratePress als neues Theme nutzen werde. Ich bin auf dieses WordPress-Theme vor einer Weile gestoßen und war schon mit der kostenlosen Version sehr zufrieden.

Auf meiner Nischenwebsite habe ich aber nun GeneratePress Pro* im Einsatz, also die Premium-Variante des Themes. Da man das Pro-Theme für einen Betrag (jährlich oder einmalig) auf bis zu 500 Websites nutzen kann (und es auch eine 30 Tage Geld Zurück Garantie gibt), habe ich mich dafür entschieden.

Das GeneratePress-Theme bietet in der kostenlosen Version schon ein sehr gutes Webdesign, aber in der Pro Version kommen diverse Module hinzu, die man einzeln aktivieren kann. Diese reichen von relativ einfachen (aber umfangreichen) Anpassungen der Navigation (im rechten Screenshot sieht man einen Teil der Einstellungen für die Navigation in GeneratePress Pro) oder der Schriftarten, bis hin zu einem relativ mächtigen Page Builder. Da ist alles dabei, was man sich wünscht.

Ich bin auch jetzt bei der Anpassung meiner Nischenwebsite wieder auf einige Funktionen dieses Themes gestoßen, die ich noch gar nicht so auf dem Schirm hatte und bin weiterhin sehr begeistert. So ein rundes, gut durchdachtes und mächtiges WordPress Theme, was aber dennoch relativ einfach anpassbar und vor allem schnell ist, habe ich bisher noch nicht gesehen.

Und so habe ich in dieser Woche einen Abend lang an meinem neuen Webdesign gebastelt und das Ergebnis könnt ihr auf meiner Nischenwebsite sehen.

Die Farben habe ich grundsätzlich beibehalten, da ich diese schon recht passend fand. Im Detail habe ich die Farben aber verändert und auch den Aufbau etwas anders gestaltet, wobei ich insgesamt dem klassischen Layout treu geblieben bin. Die Schriftarten habe ich ebenfalls beibehalten.

Stockfotos & Logo

Viele Website-Themen bringen Produkte oder ähnliches mit, weshalb es sinnvoll ist Fotos und Bilder einzubinden. Allerdings ist es bei den Infrarot-Saunen nicht so einfach, wie bei anderen Produkten. Ich habe da zwar einige Fotos, aber die sind nicht gerade hochwertig.

Um das Layout noch etwas emotional ansprechender zu gestalten, habe ich Stockfotos von iStockFoto gekauft und eingebunden. Das ist eine schöne Stockfoto-Datenbank, in der ich schnell fündig geworden bin und wo die Fotos relativ wenig kosten. Es sind nur 3,50 Euro pro Bild bei einem Ein-Monats-Abo. Man kann aber auch Fotos einzel kaufen, was dann 9 Euro pro Foto (oder Grafik) kostet oder ein Jahresabo kaufen, wo die Fotos dann nur 2,50 Euro pro Stück kosten.

Ich kann in meinem Ein-Monats-Abo 10 Fotos bzw. Grafiken herunterladen und dauerhaft nutzen, auch wenn ich das Abo dann schon beendet haben. Davon werde ich in den kommenden Wochen noch Gebrauch machen, um einzelne Artikel schöner zu machen. Die Lizenzangaben zu den Urhebern sind auch sehr moderat. Es reicht, wenn man auf einer extra Seite (bei mir im Impressum), die Urheber nennt.

Eine Sache ist aber nicht so toll, denn man darf die iStockFoto-Bilder nicht für Logos nutzen. Da ich aber ein Logo für meine Nischenwebsite wollte, habe ich einige Online-Logo-Generatoren ausprobiert. Am Ende habe ich mir ein Logo mit dem Jimdo Logo Maker erstellt, welcher wirklich gut gemacht ist und meiner Meinung nach schöne Resultate bietet. Zudem wird ausdrücklich darauf hingewiesen, dass die Logos aich kommerziell kostenlos genutzt werden können.

Herausgekommen ist sicher keine kreative Meisterleistung, aber doch ein ansehnliches kleines Logo, wie ich finde.

Navigation

Die Navigation meiner Nischenwebsite ist durch das neue Theme nun auch etwas anders. So ist zum Beispiel die Suche jetzt direkt in der Hauptnavigation drin, was ich gut finde. Was haltet ihr davon, dass die Suche direkt in der Nav. mit drin steckt?

Inhaltlich werde ich die Navigation aber noch in den kommenden Wochen anpassen, wenn ich mich an die einzelnen Inhalte mache. Ein paar Artikel werde ich dabei von Post auf Page umziehen und dann auch entsprechend die Navigation anpassen. Das ist problemlos möglich, da ich in der Artikel-URL keine Kartegorien nutze.

Mit der Navigations-Farbe bin ich noch nicht ganz so zufrieden. Einerseits würde ich mir mehr Kontrast wünschen, möchte aber auch nicht den harmonischen Gesamteindruck stören. Das ist bei mir aber ganz normal. Ich muss mir das in den nächsten Tagen und Wochen einfach immer wieder anschauen und irgendwann finde ich dann eine Lösung, die mir gefällt.

Derzeit aktiviert habe ich die Sticky Navigation, welche bei GeneratePress Pro ebenfalls mit dabei ist. Damit bleibt die Hauptnavigation am oberen Rand und scrollt mit, was ich als Nutzer gerade am Monitor sehr gut finde. Allerdings ist das auch mobil sehr gut gelöst.

Code-Anpassungen

Mal abgesehen davon, dass ich einiges an CSS-Code entfernt habe (brauchte ich nicht mehr, da es dafür Einstellungen im neuen Theme gibt), gab es allerdings auch kleinere Probleme mit dem neuen Layout.

Das lag aber nicht am Theme, sondern an meiner WordPress-Multisite-Installtion. Dieser besondere Modus von WordPress erlaubt es, mit nur einem installierten WordPress mehrere Websites zu betreiben.

Da es in den letzten Jahren hier wohl ein paar technische Veränderungen gab und ich bisher nicht die notwendigen Anpassungen vorgenommen hatte, gab es im neuen Theme unsichere Inhalte. Das waren also Elemente (vor allem Grafiken) nur über http eingebundenbzw. von einer anderen Domain eingebunden. Das sorgt natürlich für Fehlermeldungen.

Durch eine relativ einfach Einstellung in den Multisite-Optionen konnte ich das Problem aber beheben und nun wird alles schön über die Domain infrarotsauna-kaufen.de und natürlich https eingebunden.

Mittels seorch.de habe ich dann nochmal generell geprüft, welche technischen Probleme es ggf. gibt. Das waren nicht viele und die sinnvollen Tipps habe ich auch umgesetzt, aber viel war nicht zu machen.

Webdesign, Stockfotos, Plugins, Ladezeit-Optimierung ... NSOC Rückblick Woche 1

Plugins

Bei den verwendeten Plugins ist gar nicht so viel passiert. Ich habe 2 neue Plugins installiert. Zum einen Imagify für die Foto-Optimierung und zum anderen das WP-Polls Plugin, mit dem ich Umfragen erstellen werde.

Des Weiteren werde ich ein zusätzliches SEO-Plugin aber nächste Woche nutzen, über das ich dann aber genauer berichten werde.

Ladezeit-Optimierung

Die Performance meiner Nischenwebsite war schon vor dem Relaunch-Start sehr gut, so dass da nicht so viel zu tun war. Ich habe natürlich nach der Installation und Anpassung des neuen Themes ebenfalls nochmal geschaut, was es ggf. bei der Ladezeit zu optimieren gibt, aber viel war es nicht.

Webdesign, Stockfotos, Plugins, Ladezeit-Optimierung ... NSOC Rückblick Woche 1

So habe ich bei ein paar eingebauten Bildern noch die Größenangaben hinzugefügt, da dies einfach dabei hilft, dass es keine CLS-Effekte gibt. Das sind sich während des Ladens Layout-Elemente. Das geschieht z.B., wenn ein Bild keine Größenangaben erhält und erst ein kleiner Bereich dafür reserviert und dann später das Bild in der richtigen Größe dargestellt wird. Dadurch verschieben sich auch die folgenden Elemente nochmal während des Ladens und das mag Google nicht.

Zudem habe ich mit dem Plugin Imagify die das webp-Format der Bilder in der Mediendatei automatisch erstellen lassen und diese werden nun auch dynamisch in den Artikel ersetzt. Auch das gefällt PageSpeed Insights.

Webdesign, Stockfotos, Plugins, Ladezeit-Optimierung ... NSOC Rückblick Woche 1

Über die nächsten Wochen werde ich mir dann noch die Core Web Vitals Werte in der Google Search Console genauer ansehen. Google braucht hier allerdings immer eine Weile, bis Änderungen sich darin wiederspiegeln. Schließlich wirken sich diese Werte ab Mai ganz offiziell auf die Google Rankings aus.

Sicherheits-Einstellungen

Ein Thema, in das ich mich selbst noch weiter einarbeiten muss, sind die Sicherheits-Einstellungen, die man entweder per meta-Tag oder direkt in den Server-Einstellungen vornehmen kann.

So gibt das Tool webbkoll.dataskydd.net eine Reihe von Hinweisen aus, unter anderem zum Content Security Header. Diesen hatte ich dann testweise eingefügt, aber dann wieder entfernt, da Chrome einige Fehler in der Ausgabe angezeigt hat.

Mit dem Thema muss ich mich einfach noch mehr beschäftigen, denn einfach so nebenbei ist das nicht gemacht. Man macht da ggf. mehr kapput, als man verbessert. Zudem sollte man auch vorsichtig sein, denn ein pauschakes „noreferrer“ könnte z.B. Probleme mit Partnerprogrammen geben, weil diese dann nicht mehr erkennen können, woher der Besucher genau kam.

Zeit- und Geld-Aufwand – Webdesign und Technik-Optimierung

Ich habe für das neue Layout und die technischen Optimierungen in dieser Woche rund 6 Stunden investiert. Das war also kein großes Problem und auch in der kurzen Woche (dank Ostermontag) gut zu schaffen.

Finanziell hielt sich der Aufwand auch in Grenzen. Für die 2 neuen Fotos habe ich zusammen 7 Euro bezahlt. Das Theme GeneratePress Pro* kostet normalerweise 59 Dollar im Jahr (rund 49 Euro), aber da ich es schon für andere Projekte gekauft hatte, konnte ich es auch hierfür nutzen. Ich setze trotzdem mal die 49 Euro an, damit es vergleichbar ist.

Ausgaben und Aufwand

Woche 1Gesamt
Zeit-Aufwand6 Stunden6 Stunden
Geld-Ausgaben56 Euro56 Euro

So geht es weiter
Montag starten wir in die zweite Woche der Nischenseiten-Optimierungs-Challenge und dann geht es um das Herzstück jeder Website, die Inhalte. Hier muss ich einiges machen bei meiner Nischenwebsite.

So steht die Überarbeitung der Startseite genauso auf dem Plan, wie die Erstellung neuer Artikel und die Aktualisierung bestehender Inhalte. Wie ich dabei vorgehen werde und welche ggf. hilfreiche Plugins und Online-Tools ist nutze, erfahrt ihr am Montag.

Wie lief die Woche bei euch? Was konntet ihr bei der technischen Optimierung eurer Nischenwebsite schaffen?

WERBUNGNischenseiten-Aufbau E-Book
Schritt für Schritt zur eigenen Nischenwebsite - 238 Seiten plus Checklisten

8 Gedanken zu „Webdesign, Stockfotos, Plugins, Ladezeit-Optimierung … NSOC Rückblick Woche 1“

  1. Hallo Peer, mir gefällt das kleine neue Logo super! Ich hab da persönlich ja einen anderen Weg gewählt. Werde ich noch drauf eingehen im report.

    Im mobilen Menü ist der Kontrast sehr gut gelungen, finde ich. Weiß auf dunkelrotbraun ist gut zu lesen.

    Viel Erfolg weiterhin!

    Liebe Grüße, Katharina

    Antworten
  2. Hallo Peer,
    bei mir habe ich das Layout gewechselt. Meins war wirklich am Ende. Ich hatte noch ein Uraltes Artisteer Theme drauf. Das ging eigentlich immer ganz gut doch ab irgendeiner PHP Version hat das nicht mehr mitgespielt.

    Na gut Mittlerweile gibt es ja unzählige kostenlose Themes.
    Ich möchte da kein Geld ausgeben.

    Ich habe Gambit by ThemeZee drauf. Die ThemeZee Themen sind nach meinen Vorstellungen. Besonders das Magazin Startseiten Widget finde ich gut. Da kann man einen Startseitentext platzieren und muss keine statische Seite erstellen.

    Dann Pagespeed.
    Ich wollte ja gerne noch die paar Cent Adcents mitnehmen.
    Doch der Code den man für das automatische Ausliefern von Adsense einbinden muss bremst den Pagespeed ganz schön aus.

    Mit Adsense hat meine https://www.trampeltrecker-kaufen.de/ folgende Pagespeed Werte.

    96 % Desktop
    55 % Moblie

    Ohne Adsense
    100 % Desktop
    97 % Mobile.

    Dann habe ich noch den Titel geändert.
    Der war mir zu lang. Auch wenn viele sagen das lange Titel besser sind konnte ich damit nicht ranken.

    Also habe ich erstmal einfach „Trampeltrecker kaufen“ genommen.
    Nur hat die Tante das noch nicht gemerkt obwohl ich auch noch einen Backlink aus einem Artikel auf einem anderen Blog auf die Seite gesetzt habe.

    Vielleicht hat Google gerade was anderes zu tun mit seinen Bot Kapazitäten.

    Für die nächste Woche werde ich mal ein bisschen Linkaufbau auf die Todo Liste setzten. Dann vielleicht noch ein paar neue Contentseiten.

    Dann hoffe ich mal das die Tante meine neuen Titel frisst und mich irgendwo neu damit einsortiert.

    Zeit: 55 Minuten
    Geld: 18 Euro für den Backlink (600 Wörter Artikeltext 3 Cent Pro Wort) (Verkaufspreis) Ich habe ein paar freiberufliche Texter die für mich arbeiten. Der EK ist anders.

    Dann wünsche ich einen guten Start in die 2. Woche.

    Grüße Lothar

    Antworten
      • Hallo Peer,

        konntest Du Dir das Thema von Lothar schonmal anschauen?
        Ich habe nämlich das gleiche Problem mit dem Pagespeed sobald ich AdSense aktiviere. Würde mich wirklich interessieren an was es liegt.
        Bisher habe ich leider noch keine gescheite Lösung gefunden.

        VG Kristian

        Antworten
        • Bei Lothar sieht es soweit okay aus, bei dir ist es sehr langsam laut PageSpeed Insights. Woran das genau liegt, kann ich nicht sagen. Ich kenne das Theme selbst nicht und nutze schon länger kein AdSense mehr.

          Nutzt du irgendwelche Plugins zur Ladezeit-Optimierung? Cache, Autoptimize …

          Antworten
          • Hi Peer,

            erst einmal vielen Dank, dass du dir das Problem mal angeschaut hast. Bei dem Theme handelt es sich um das von Dir in der NOC präferierte Theme „GeneratePress“ in der kostenlosen Version. Ich habe lediglich einige Anpassungen an der Menübar via CSS vorgenommen. Sonst handelt es sich um die Basic-Version.

            Ja ich habe Autoptimize und WP Fastest Cache im Einsatz.
            Ggf. liegt es in der Tat an den Tools.

            Habe dann heute Morgen mal etwas rumexperimentiert. Und bspw. als Referenzseite bei meinem letzten Artikel die Werbung entfernt.
            Jedoch konnte ich bisher leider nicht das gewünschte Resultat erreichen:

            Aktuelle Nutzung mit AdSense und Optimizern:
            Mobil 30
            Desktop 91

            Autoptimize und WP Fastest Cache im Wechsel an oder aus:
            Mobil 35-40
            Desktop 91-95

            Optimizer wieder an aber ohne AdSense:
            Mobil 80-95
            Desktop 97-99

            So wie es aussieht muss ich mich für eines entscheiden.
            Schnell oder AdSense ☹
            Ich habe keine Ahnung wie man beides unter einen Hut bekommen soll.

            VG Kristian

  3. Hallo liebe Kollegen,

    ich habe meine Reporte nun nachgeholt. Wenn man da nicht am Ball bleibt dann ist die Zeit schneller weg als man denkt.

    https://www.lotharsblog.de/nischenseiten-optimierungs-challenge-2021.php#Woche_2_Report

    https://www.lotharsblog.de/nischenseiten-optimierungs-challenge-2021.php#Woche_3_Report

    Nachdem ich die die Sitemap in die Google Search Konsole hochgeladen habe wurde auch der neue Titel übernommen.

    Heute habe ich auf den Hinweis von Chris in den Kommentaren meiner Reportseite reagiert. Ich könnte auch mal ein Video einbinden. Ich habe ein Testvideo aus dem Youtube Kanal eine Agra Magazins eingebunden und mit eigenen ca 300 Wörtern beschrieben. Das ganze zur Erweiterung der Startseite.

    Wahrscheinlich werde ich die Startseite in der 4. Woche nochmal überarbeiten und auf eine Statische Seite setzen weil ich gerne ein table of Content auf der Startseite hätte. Die aber mit der aktuellen Lösung technisch nicht machbar ist.

    Das technische sollt edann abgeschlossen sein. Die Platzierungen in den Serps sollte dann in den nächsten Wochen und Monaten mit Linkbuilding und Contenterweiterung verbessert werden.

    Mit „trampeltrecker kaufen“ bin ich jetzt auf Platz 13 Juchhuu, ein Platz gut gemacht.
    Und mit Trampeltrecker zwischen 50 und 60.
    Da habe ich ich auch was gutgemacht.
    Denn da ware ich zu Anfang am 06.04. noch auf Platz 72 .

    Ich denke mit Linkbuilding kann ich noch die Top 10 erreichen.

    Aber Zeit und Geldeinsatz darf man auch nicht aus den Augen verlieren.

    Bis jetzt bei mir

    Gesamt Zeit und Kosten
    205 Minuten
    52 Euro

    da müssen schon noch einige Trampeltrecker verkauft werden bis die Kosten für die Optimierungsmaßnahmen wieder eingespielt sind.

    Grüße und ein schönes Wochenende.

    Lothar

    Antworten

Schreibe einen Kommentar