Nachdem wir uns bemüht haben, den richtigen Inhalt auf der Homepage des Almanachs zu finden, können wir uns mit CSS mit dem eigentlichen Styling befassen.
Wir haben uns für einige Teile dieses Designs für eine Handschrift entschieden. Wir durchsuchen einige Schriftarten auf Dafont und laden am Ende Shadows Into Light herunter. Der Download enthält die Schriftart in einem Format, das auf dem Desktop funktioniert, jedoch nicht alle für @ font-face erforderlichen Formate. Also lassen wir es durch Font Squirrel laufen.
Wir verschieben die Schriftarten in unsere Verzeichnisstruktur, wo sie sein sollen. Dann kopieren wir die @ font-face-Syntax und fügen sie von einer anderen Stelle im Projekt in unser Almanach-spezifisches CSS ein und ändern die Namen der Schriftarten und des Materials.
Wir verbringen den Rest der Zeit damit, das CSS zu stupsen und zu bearbeiten, um das richtige Layout zu erhalten, Farben einzustellen und so weiter. Eigentlich ist es eine ziemlich lustige und interessante CSS-Herausforderung, alles richtig zu gestalten. Schließlich haben wir nur sehr wenig Kontrolle über die HTML-Ausgabe. Es sind nur verschachtelte Listen. Wir müssen also genau richtig zielen und schweben, um das genaue Layout zu erhalten, das wir uns in Photoshop vorgestellt haben.
