Finora il sito web attuale non assomiglia affatto al nostro design di Photoshop. In questo screencast cerchiamo di fare proprio questo, iniziando dall'alto con la nostra area di intestazione e logo. È bello iniziare un po '"reale" a costruire visivamente il sito.
Usiamo Frank DeLoupe come selettore di colori, che è ben integrato con Photoshop (rende il colore che scegli il colore attivo in Photoshop, oltre a copiarlo negli appunti).
Ad un certo punto modifichiamo la configurazione Sass / Compass per compilare il CSS :expanded invece di :compressedvedere il CSS reale generato per motivi di debug.
Dobbiamo usare un po 'il nostro cervello su come verranno posizionate le cose e reagire alla natura fluida di una finestra del browser. Ad esempio, il registro dovrebbe sempre toccare l'angolo in alto a sinistra.
Facciamo un sacco di spinte intorno ai valori per ottenere le cose giuste, oltre ad aggiungere piccoli dettagli qua e là per far sembrare le cose migliori, come l'aggiunta di lievi ombre all'effetto pila di carta.