vellip.de

Ich habe meine eigene Webseite mit Scroll-Effekten und Animationen entwickelt. Der Code der Webseite basiert auf React & Gatsby.

Mit meinem Schritt in die Selbstständigkeit als Webentwickler war eine Webseite unabdingbar. 2019 habe ich mich dem Thema erstmals angenommen und mit Angular und dem Cockpit CMS als Basis ein Portfolio entwickelt.

Im Jahr 2021 habe ich mich nochmals mit meiner Webseite auseinander gesetzt, weil ich durch die Nutzung mit Angular Nachteile im Bereich SEO (Search Engine Optimization) hatte. Nach einiger Recherche bin ich dann auf Gatsby gekommen - ein Framework, welches auf React basiert und aus dem Code statische Seiten generiert.
Der Vorteil hiervon ist, dass die Seite wesentlich schneller lädt, der Inhalt direkt im Browser ankommt, ohne Umwege; und Google kann nun einfacher meinen Inhalt indexieren.

Um eine Verbesserung messbar machen zu können, habe ich Lighthouse genutzt. Dies ist ein System, welches Webseiten unter etlichen Gesichtspunkten bewertet, der Score geht bis zu 100 Punkte, je mehr desto besser.

Der Score für die alte Version dieser Webseite.

Nachdem ich mich dem ganzen Thema Webseite-Optimierung angenommen habe, konnte ich einen wesentlich besseren Score erreichen, wie im folgendem Bild zu sehen. Der Sprung von Angular zu Gatsby & React hat mich in allen Bereichen in den grünen Bereich katapultiert, was im Endeffekt auch Auswirkungen auf die Platzierung bei Google hat.

Der neue Score der überarbeiteten Webseite