Digitales Schaufenster, quasi

von

Dominic Kallen Portfolio

«Portfolio kommt bald!» wird zu: «Mein Portfolio ist online!». Dass ich die Gestaltung und Umsetzung meines Portfolios für Digezz verwenden möchte, wusste ich schon früh. Bin ja auch nicht der Erste, der auf diese Glanzidee gekommen ist. Allerdings bietet es sich wirklich gut an, da verschiedenste Skills bis zur fertigen Website einfliessen.

Lange musste ich der Frage nach meiner digitalen Visitenkarte, meinem digitalen Schaufenster ausweichen. Ich hatte ganz einfach keine Zeit, mich mit dem Thema auseinanderzusetzen. Nachdem ich mir nun aber das grundlegende Wissen angeeignet habe, schaffte ich es, mir ein Zeit zur Umsetzung einzuplanen.

Hier gehts zu meiner ersten selbsterstellten Website, meinem Portfolio.

Höhen und Tiefen gibts in meiner Reflexion unterhalb des Beitrags.

(mou)

Konzept und Gestaltungsidee

Bereits mehrere Monate bevor ich mit der Umsetzung begann, sammelte ich Inspiration. Ich überlegte mir zig Stunden, wie ich es genau Umsetzen möchte. Noch nie hatte ich soviel Zeit in eine Konzeptionsphase gesteckt wie dieses mal. Mittlerweile kann ich sagen, dass es ich gelohnt hat, aber auch Geduld gefordert hat. Mich juckte es schon früh in den Fingern, endlich anzufangen, jedoch wusste ich auch, dass ich es später bereuen werde, wenn ich anfange ohne mir abschliessende Gedanken gemacht zu haben.

Zuerst schaute ich bei meinen Vorbildern vorbei, bei denen ich ohnehin viel Inspiration schöpfe. Dabei schaute ich noch genauer auf die Website als sonst. Anschliessend schaute ich Websites von Freelancern an, vor allem in den Bereichen Fotografie und Videografie, da ich mich auch dort zuhause fühle.

Ich kam zum Entschluss das meine Webseite Folgendes erfüllen sollte:

  • Dunkles Design
  • Grosser Aufhänger bei der Homepage
  • Sehr schlichtes Design, angereichert mit kleinen Spielereien/Animationen
  • Lazy-Load-Elemente
  • Viel Grautöne + eine herausragende Farbe
  • Optimimiert fürs Smartphone

Recherche Umsetzung

Nachdem ich mich beim Design festgelegt hatte und aus mehreren Wireframes das Passendste heraussuchte, suchte ich nach Umsetzungsmöglichkeiten. Für mich kam tagelanges codes nicht in Frage, da ich mir sicher war, dass ich mit meinen Fähigkeiten kein zufriedenstellendes Resultat erzielen werde. Ich möchte meine Dienstleistung in Zukunft in den Bereichen Foto, Video und Design anbieten. Dabei sollte es egal sein, ob ich die Webseite von Grund auf selber Programmiere oder ein CMS verwende, Hauptsache es spricht die potenziellen Kunden visuell sofort an.

Ich wägte also folgende Optionen ab:

  • Webseite-Builder wie Wix, Jimdo
  • Sqarespace
  • Webflow
  • WordPress mit Buildern wie Elementor oder Divi

Mehr oder weniger die ganze Bandbreite also. Während der Recherche lernte ich auch viel, wie die einzelnen Optionen funktionieren und was die Vor- und Nachteile sind.

Ich entschied mich für WordPress mit Elementor. Preis-Leistung scheint fair zu sein und man ist relativ Flexibel. Ganz so einfach wie mit einem fixfertigen Webseite-Builder wollte ich es mir doch nicht machen.

Domain, Hosting

Beim Hosting und Domain entschied ich mich für hosttech. Ich kaufte gleich mehrere Domains, da ich auch noch eine Webseite für einen Musiker machen darf.

Umsetzung WordPress, Elementor

Bevor ich nun endlich mit der Umsetzung startete, schaute ich nochmal einige Crashcourses zu Elementor an. Ich entschied mich die Pro-Version zu kaufen, da diese doch noch einige wichtige Widgets bereithält. Der ganze Teil der Umsetzung brauchte massiv mehr Zeit als ich geschätzt hatte. Das Bereitstellen der Thumbnails und Bilder war Fleissarbeit, aber wichtig. Ich wollte eine relativ schnelle Website erstellen, somit achtete ich darauf, wie gross die Dateien sind, die ich ins WordPress-Backend lade. Als ich zufrieden war, merkte ich, dass ich vielleicht einmal die Smartphone-Ansicht anschauen sollte. Das sah schrecklich aus. Also verbrachte ich weitere Stunden, wenn nicht Tage damit, dass es auf Handy und Tablet auch richtig gut aussah. Aber Responsive-Design ist halt heute extrem wichtig. Ich bin froh, dass ich mir die Zeit genommen habe.

SEO

Bevor ich nun Google mitteilen wollte, dass die Seite indexierbar ist, wollte ich mich noch betreffend SEO informieren. Auch hier schaute ich diverse Videos und las mich durch verschiedenste Artikel um am Ende festzustellen, dass ich wohl mit einigen Stunden Recherche nur an der obersten Oberfläche kratze. Dennoch installierte ich 2 SEO-Plugins und experimentierte. Ich entschied mich zuletzt für RankMath. Das Optimieren der wichtigsten Seiten für SEO setze voraus, dass ich halt nochmals viele Anpassungen vornahm. Zuletzt setze ich mir das Ziel, überall ein Ranking von Mindestens 80% (gem. RankMath) zu erreichen.

Indexierung

Als ich die Seite öffentlich machte, bemerkte ich, dass es wohl einige Tage dauert, bis diese auch wirklich rankt. Ich verknüpfte meine Seite mit der Google Search Console und experimentierte dort weiter. Momentan bin ich mit dem Ranking zufrieden. Wahrscheinlich rankt sie noch besser, wenn ich meine Seite in meinen Kreisen streue.

Fazit

Ich bin unglaublich froh, nun mein eigenes Portfolio zu haben. Mit zunehmenden Kundenprojekten als Freelancer, ist dies ein Muss. Zudem bin ich froh, alles selbst gemacht zu haben, ohne Hilfe. Das erste Mal. Ich habe das Gefühl, durch dieses Projekt quasi einen «Rundumschlag» gemacht zu haben, und nun eine gute Grundlage für weitere Webseite-Projekte mit WordPress zu erstellen.  Unzählige Male hatte ich Aha-Momente und verstand, was ich 2 Stunden vorher wohl falsch gemacht haben muss.Somit denke ich, dass ich bereits bei meiner zweiten Webseite um einiges effizienter arbeiten kann.