Portfolio Johanna Novak

Workflow

1. Domain kaufen

Vor etwa einem halben Jahr erwähnte einer der IM Dozenten, dass wir uns besser unsere Wunsch-Domain jetzt kaufen, dass sie uns niemand wegschnappt. Also habe ich johanna-novak.ch auf HostPoint gekauft. Ich habe mich nicht für johannanovak.ch entschieden, da ich es weniger lesbar finde.

2. XD Design und «Dreamweaver»

Einige Monate später begann ich mit dem Design meines Portfolios auf Adobe XD. Da ich mich im MMP-Studium kaum mit Webseiten-Development auseinandergesetzt habe, hatte ich zuerst Mühe mich wieder in HTML & CSS einzufinden. Aber mithilfe vom Adobe Programm «Dreamweaver» fand ich mich ziemlich schnell wieder ein. In Dreamweaver codiert man selbst, aber das Programm stellt einem Code-Schnipsel zum Beispiel in Form von einem CSS-Editor zur Verfügung. Das machte HTML & CSS für mich einfacher, da ich mir sonst keinen Code merken kann. Ausserdem hat es die Option, die Webseite Live im Programm selbst anzuschauen. Das half mir, in Realtime zu sehen, ob ich falsch gecodet habe und um verschiedene Codes schnell auszuprobieren. Ich realisierte währenddem Arbeiten an diesem Projekt, dass Webseiten kreieren viel mit Error & Trial zu tun hat und natürlich mit Googeln ;).

3. Logo Design

Ich designte für mein Portfolio ein neues Logo mit Adobe Illustrator.

4. Server kaufen & Upload

Meinen Server kaufte ich nicht bei HostPoint ein, da mir dieser Anbieter einfach zu teuer ist. Ich verglich einige Schweizer Angebote und fand schlussendlich NovaTrend. Dann stand ich vor einem Problem, das ich zuerst nicht auf dem Radar hatte: Wie verbinde ich nun die Domain mit dem Server? Nach einigem Googeln nach falschen Stichworten fand ich heraus, dass man sogenannte Namesserver auf der Seite der Domain angeben muss. Die Lösung umzusetzen war so einfach, dass ich fast nicht glauben konnte, wie lange ich brauchte, um die Anleitung dazu zu finden. In Dreamweaver habe ich den Ordner per FTP mit dem Server verbunden und hochgeladen. Das funktionierte wie geschmiert.

5. Content einbinden

Dann begann ich Inhalt in mein Portfolio einzubinden, zuvor waren die Seiten nur mit Platzhalter gefüllt. Ich updatete meine Webseite nach jeder grösseren Veränderung und war ziemlich verwirrt, als die Webseite völlig anders auf dem Web als auf Dreamweaver aussah. Ich leerte den Cache, löschte die Cookies und dachte für eine Weile, dass das Problem an Dreamweaver lag. Als ich die Webseite in einem anderen Explorer öffnete, sah sie jedoch genau so aus wie in Dreamweaver. Ich fand heraus, dass ich CTRL-SHIFT-R drücken muss, damit die Webseite alle Dateien inklusive CSS neu ladet.

Selbstkritik & Erkenntnisse

Ich bin stolz, dass ich schlussendlich mein Portfolio doch von Scratch kreierte und nicht mit WYSIWYG kreierte. Ich konnte noch nicht alle Looks und Funktionalitäten in der Webseite umsetzen, die ich gerne im Portfolio hätte, aber für den Anfang ist es gut genug. Ich werde in den nächsten Monaten noch einige Punkte (wie zum Beispiel eine Hover-Titel Funktion für die Projekte auf dem Homescreen und einer Kategoriensortierung) hinzufügen.