Gdy nasz projekt stopki jest gotowy do użycia w Photoshopie, możemy zacząć budować go w naszej statycznej makiecie HTML i CSS. Pierwszym krokiem jest dostarczenie nam trochę HTML do pracy. Mamy już „część”, którą umieszczamy na wszystkich stronach o nazwie „footer.php”. Na razie jest to idealne miejsce na dodanie naszych znaczników w stopce.
Jak można się było spodziewać, stopka jest tagiem. Wewnątrz kilka list linków. Omawiamy, dlaczego umieszczenie listy linków w pliku faktycznym może nie być idealnym rozwiązaniem
- etykietka. W końcu to nie jest lista, to tylko linki. Po przeczytaniu tego artykułu nie umieszczałem już nawigacji na listach.
Używamy funkcji Zen Coding w CodePen, aby szybko uzyskać zestaw linków do pracy. Aby to wypróbować, wpisz * 8 w edytorze HTML CodePen, a następnie naciśnij Tab.
Kończymy, pisząc również znaczniki dla dolnej stopki. Omawiamy trochę najlepszych znaczników do użycia, ale ostateczny po prostu wybierz coś i idź z tym. Zresztą w internecie łatwo można to zmienić.