1. Komponenty

Patička

angl. Footer

Jedná se o spodní část stránky, která obsahuje dané společné prvky a rozcestník na nejdůležitější části webu a další důležité odkazy.

Ukázka patičky na Portálu veřejné správy.


<div class="footer" role="contentinfo">
    <div class="container">
        <div class="footer__inner">
            <div class="footer__links">
                <div class="row">
                    <div class="col-12 col-sm-6 col-lg-3">
                        <div class="footer__box pb-4 pb-lg-0">
                            <h3>Užitečné odkazy</h3>
                            <p class="mr-sm-1">Další užitečné informace z&nbsp;různých oblastí výkonu veřejné správy.</p>
                            <ul>
                                <li><a href="#">Kompletní seznam Odkazů</a></li>
                            </ul>
                        </div>
                    </div>
                    <div class="col-12 col-sm-6 col-lg-3">
                        <div class="footer__box pb-2 pb-sm-4 pb-lg-0">
                            <ul>
                                <li><a href="#">Prezident ČR</a></li>
                                <li><a href="#">Vláda ČR</a></li>
                                <li><a href="#">Poslanecká sněmovna ČR</a></li>
                                <li><a href="#">Senát ČR</a></li>
                                <li><a href="#">Ministerstva</a></li>
                            </ul>
                        </div>
                    </div>
                    <div class="col-12 col-sm-6 col-lg-3">
                        <div class="footer__box pb-4 pb-sm-0">
                            <ul>
                                <li><a href="#">Kraje České republika</a></li>
                                <li><a href="#">Města a Obce</a></li>
                                <li><a href="#">Veřejné zakázky</a></li>
                                <li><a href="#">Veřejný rejstřík</a></li>
                                <li><a href="#">Státní služba</a></li>
                            </ul>
                        </div>
                    </div>
                    <div class="col-12 col-sm-6 col-lg-3">
                            <div class="footer__box">
                            <ul class="bigger">
                                <li><a href="#">Informace<br> o&nbsp;České republice</a></li>
                                <li><a href="#">Informace<br> o&nbsp;České republice</a></li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
            <div class="footer__common">
                <div class="row">
                    <div class="col-12 col-sm-6">
                        <div class="footer__box pb-3 pb-sm-0">
                            <ul>
                                <li><a href="#">Prohlášení o přístupnosti</a></li>
                                <li><a href="#">Historie přístupů</a></li>
                            </ul>
                        </div>
                    </div>
                    <div class="col-12 col-sm-6">
                        <div class="footer__box">
                            <p class="footer__brand">
                                2017&nbsp;© Ministerstvo vnitra • Informace jsou poskytovány v&nbsp;souladu se zákonem č.&nbsp;106/1999&nbsp;Sb., o&nbsp;svobodném přístupu k&nbsp;informacím.
                            </p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

Ukázka patičky s ikonami externích odkazů na Portálu veřejné správy

Ukázka patičky s ikonami externích odkazů na Portálu veřejné správy

Obecné rozložení webové stránky Obecné rozložení stránky

Responzivní (RWD) zobrazení

Slouží pro zobrazení na menších zařízeních (mobilech, tabletech).

Pro představu, jak se má komponenta chovat na jiném zařízení, lze náhled komponenty zmenšit podle potřeby. Ke zmenšení dojde stisknutím pravého okraje a potáhnutím doleva. Komponenta se automaticky přeskládá podle míry zmenšení.

Více o typech zařízení najdete na stránce Mřížka.

Použití

Patička je součástí každé stránky webu. Klientské zóny a interní aplikace patičku mít nemusí.

Obsah patičky

Obsah se může lišit podle webové stránky, na které je patička umístěna.

Patička by měla obsahovat

vždy

  • prohlášení o přístupnosti
  • tzv. copyright nebo-li autorská práva - součástí je rok a symbol pro copyright (jedná se o jednoduchou ochranu proti plagiátorství)

Příklad

2020 © MINISTERSTVO VNITRA

většinou

  • informace o zpracování osobních údajů a o ochraně soukromí (tzv. cookies)
  • odkazy na sociální sítě - nejčastěji formou ikony dané sociální sítě
  • kontakt na subjekt, kterému patří daná webová stránka (telefonní číslo, e-mail, odkaz na kontaktní formulář, atp.)
  • odkazy, které návštěvníkovi webu pomohou v přechodu na další stránky

Patička může sloužit jako pomoc lidem, kteří nenalezli, co hledali. V tom případě je možné do patičky vypsat navigaci z hlavičky (důležité je zvážit do jaké úrovně).

Užitečné odkazy