Portfolio Redesign
Wie viele andere wollte ich im Hinblick auf die Jobsuche nach dem Studium mein Portfolio auf Vordermann bringen. Gewappnet mit Adobe XD und Visual Studio Code machte ich mich ans Werk.
Ein Portfolio habe ich bereits seit einiger Zeit, doch die Projekte darauf sowie auch das Design sind langsam in die Jahre gekommen. Es wurde Zeit für ein komplettes Redesign. So entschied ich mich, das Layout der Webseite von Grund auf neu zu programmieren. Auch die Inhalte habe ich überarbeitet und mit aktuellen Projekten aktualisiert.
Hier findest du mein Portfolio: https://dariogartmann.ch
(mou)
00 | Idee
Zu der Idee gibt es nicht viel zu sagen. Im Hinblick auf die Jobsuche nach dem Studium will ich mein Portfolio auf den neuesten Stand bringen. Sowohl inhaltlich als auch visuell. Das bisherige Design war langsam in die Jahre gekommen, weshalb ich die Webseite komplett neu entwerfen wollte.
01 | Umsetzung
Anstatt einfach wild darauf los zu programmieren, entschied ich mich, endlich einmal Adobe XD eine Chance zu geben. So konnte ich im Vornherein ein Screendesign entwerfen und schnell Dinge ausprobieren. Das hat wider Erwarten sehr gut geklappt, und ich werde diesen Ansatz auch bei zukünftigen Webprojekten einsetzen.
Mein bisheriges Portfolio ist mit dem Seitengenerator Jekyll aufgebaut, das will ich so beibehalten. Jekyll basiert auf der Sprache Ruby und erlaubt es, ein Theme und Content zu erstellen wie in einem CMS. Anders als bei einem CMS wie WordPress generiert dann Jekyll aus diesen Dateien eine statische Webseite, welche auf den Webserver geladen wird. Dieser Ansatz hat zwei Vorteile: Sicherheit und Geschwindigkeit. Da keine Datenbank benutzt wird, fällt schonmal eine potenzielle Sicherheitslücke weg. Und da nicht noch serverseitiges PHP ausgeführt werden muss, ist die Seite auch schneller.
In meinem Fall wird die Webseite auf Github Pages gehostet. Das hat den Vorteil, dass ich einfach meinen Master-Branch im Github-Repository pushen kann, und das Portfolio automatisch mit Jekyll gebaut und hochgeladen wird.
Beim Entwickeln musste ich zuerst Jekyll aktualisieren und auf meinem neuen Rechner zum laufen bringen. Als dies geschafft war, begann ich mit dem Umbau der Seite. Da ich ein komplett neues Layout verwende, musste ich sämtliches CSS neu schreiben. Für interaktive Elemente und Seiten-Transitions kam einiges an Javascript hinzu. Schlussendlich pflegte ich noch meine neusten Projekte in die Webseite ein und war dann bereit für den Launch.
02 | Learnings
- Im Vornherein ein Screendesign zu erstellen ist Goldwert, man kann viel einfacher Dinge ausprobieren, bis man das perfekte Layout hat.
- Manchmal lohnt es sich, eine Webtechnologie komplett vom Rechner zu löschen und neu zu installieren, falls man mit Versionen Probleme hat.
- Man darf den Inhalt nie unterschätzen. Bei dem Schreiben der Texte benötigte ich viel mehr Zeit als geplant, und bin immer noch nicht zu 100% zufrieden.