Motivation

Für die Bewerbungsphase im Mai 2022 hatte ich eine eigene Internetseite erstellt.

Grund dafür war, dass ich einige Inhalte in meinen Lebenslauf packen wollte, die dort nicht mehr rein passten. Das waren Links zu den einzelnen Projekten aus meinem Portfolio und Texte zu den Kursen die ich außerhalb meines Studiums absolviert hatte. Zusätzlich fand ich die Idee einer eigenen Internetseite spannend und wollte einen Punkt haben, mit dem ich herausstechen kann.

Wie ich die Seite gebaut hatte

Über Google Sites hatte ich mir die Seite zusammengeklickt. So konnte ich eine Seite schnell und ohne viel technischen Aufwand basteln.

Die Domain hatte ich über Google Domains gekauft und mit der Seite verknüpft. Die einzigen Kosten, die ich mit der Webseite hatte, waren 7 € pro Jahr für die Domain.

Mein damaliges Portfolio

Mein Porfolio basierte im Wesentlichen auf meinen eigenen Daten. Dabei hatte ich von den jeweiligen Diensten meine Daten angefordert und diese ausgewertet.

Meine Amazon-Daten hatte ich mit Excel und PowerPoint ausgewertet. Tableau hatte ich benutzt, um meine Netflix- und Spotify-Daten zu visualisieren. Die SQL-Queries und PowerPoint-Präsentation von meiner DataCamp-Zertifizierung hatte ich auch hochgeladen.

Aktuell sehe ich aber keinen Bedarf mehr für ein Portfolio.

Das Ende der alten Seite

Nach einer erfolgreichen Bewerbungsphase konnte meine Seite ihren Zweck erfüllen.

Jedoch hatte mich der Ehrgeiz gepackt eine eigene Seite zu bauen, statt sie nur zusammenzuklicken. Die Seite sollte auch für Mobilgeräte optimiert werden können und beim Design wollte ich mehr Möglichkeiten haben. Ich habe auch Spaß an Projekten dieser Art. Ich mag es nämlich, mich hinzusetzen und mit technischen Problemen herumzuschlagen, während ich etwas baue. So habe ich die diese neue Seite bereits Mitte 2022 begonnen und in vielen kleinen Schritten langsam bearbeitet.

Neuer Versuch mit Webflow

Zuerst habe ich mit Webflow versucht, die neue Seite zu erstellen. Webflow bietet zwar wesentlich mehr Funktionen als Google Sites, das ging mir aber hinsichtlich der Anpassungsmöglichkeiten nicht weit genug. Zudem wollte ich nicht schon wieder mit einem Baukasten arbeiten müssen und davon abhängig sein. Das Ganze führte dazu, dass ich mich eines Tages bereit fühlte, eine Seite selbst auf die Beine zu stellen und den Code dafür zu schreiben.

Mittlerweile überholte Entscheidungen

Zu Beginn war die Seite wesentlich bunter, seitdem habe ich aber die Farbvielfalt reduziert. Das lag zum Einen daran, dass die Seite etwas professioneller aussehen sollte, aber auch um einen Dark-Mode besser einführen zu können.

Zwischenzeitlich habe ich auch versucht, es möglich zu machen, zwischen einer deutschen und einer englischen Version der Seite zu wechseln. Jedoch ist mir aufgefallen, dass diese Seite keine englische Version braucht.

Die Seite hatte eine Seitenleiste, statt einer Navigationsleiste oben. Die Seitenleiste habe ich nach oben verschoben, um ein einheitlicheres Design unabhängig von der Bildschirmgröße zu ermöglichen. Dadurch stand auch der Inhalt mehr im Zentrum.

Produktivität der Seite

Ich hatte die erste Version der Seite schon im September 2022 deployed. Dies lief über GitHub Pages. Dadurch konnte ich die Seite einfach und kostenlos über GitHub hosten.

Das zugehörige Repository habe ich aber mittlerweile archiviert. Es ist voller kleiner Commits, die teilweise ein wenig fragwürdig erscheinen. Außerdem kann es sein, dass ich auf Prod getestet habe. Da versteht es sich, dass ich meine Spuren verwischen möchte und mit einem neuen Repository angefangen habe.

Die Seite habe ich zwischenzeitlich runtergenommen. Das lag daran, dass sie die ganze Zeit unvollständig war und ich mich so zwingen wollte, sie endlich abzuschließen.

Farbenauswahl

Bei der Wahl der Hauptfarben, war mycolor.space besonders hilfreich. Die Entscheidung fiel mir nicht leicht, mittlerweile bin ich aber zufrieden.

Bildbearbeitung

Für die Bildbearbeitung habe ich Canva genutzt. Canva funktioniert einfach und macht so ziemlich alles was ich brauche.

Während der Arbeiten hatte ich häufiger das Problem, dass ich ein transparentes Bild hatte, welches aber noch Ränder besaß, die ich zuschneiden wollte. Dafür habe ich mir ein kleines Skript geschrieben, das dies auf den Pixel genau kann: helpers/image_crop.py

Bootstrap als front-end framework

Ich benutze Bootstrap für meine Seite, so wie es 19 % aller Internetseiten machen. Bootstrap bietet viele Designvorlagen für die Knöpfe, die Navigationsleiste, den Dark-Mode und vieles mehr.

Hover.css

Für die Schrumpfen- und Vergrößerungs-Animation habe ich Hover.css von Ian Lunn verwendet. Die Schrumpfen-Animation gefällt mir so sehr, dass ich sie fast überall verwendet habe.