DIVI moduly a responzivita
Možnosti každého modulu
Obsah: texty, fotky, ikony, pozadí
Design: písmo, barvy, okraje, rámečky, animace
Pokročilé: CSS třídy, viditelnost, pozice, efekty
Okraje modulu, řádku a sekce
Margin = vnější okraj
Padding = vnitřní okraj
Přehled základních modulů
Modulů, ze kterých můžeš poskládat web, je opravdu mnoho. Základní jsou moduly Text, Obrázek a Upoutávka (ta je složena z obrázku či ikony, titulku a textu). U ikon sociálních sítí můžeš měnit jejich velikost i sladit je barevně s webem. U referencí je rozhodně velké plus mít fotku. V kurzu použití jednotlivých modulů uvidíš.
Responzivita webu
Zobrazení každého prvku je možné nastavit jinak pro velký stolní počítač, notebook, tablet a mobil. Stěžejní je mobil — na něm si web prohlíží až 70% návštěvníků.
Můžeš tak upravovat nejen formát, ale i obsah. Hlavně nesmíš zapomenout před úpravou přepnout do konkrétního zařízení. Konkrétní prvky můžeš pro mobil i úplně schovat. Dokážeš tak udělat web na míru pro jednotlivá zařízení.
V DIVI 5 si můžeš přidávat své vlastní body zlomu, tzv. breakpoints.
Základní typy hero sekcí
Klasická hero sekce s pozadím (image hero)
- Velký obrázek v pozadí (často s tmavým překrytím).
- Obsahuje nadpis, krátký text a tlačítko (CTA).
- Místo obrázku může být v pozadí video.
Minimalistická hero sekce (clean hero)
- Jednobarevné pozadí, v pravé části ilustrace
- Bez výrazného pozadí – čistý, elegantní dojem.
Hero s půlenou obrazovkou (split hero)
- Rozdělené na 2 části: levá → text, tlačítko, pravá → obrázek, video nebo produkt
- Výborné pro přehlednost a mobilní responzivitu.