Děláme to pro vás!
Jen pro vás jsme nachystali tento katalog, aby se vám lépe tvořili landing pages a microsites. Doufáme, že vám to vaši práci ulehčí.
Máme dvě možnosti použití HLAVIČKY - přejímáme ze solitea.com nebo používáme vlastní z bloků na microsite/landing page. Vždy dbáme na přehlednost a pokud je to možné, přidáme kontrastní CTA.
HERO používáme s kvalitní fotkou, která se vztahuje k danému tématu a s úderným sdělením. Kdykoliv je jeho použití možné, upřednostníme ho před dalšími druhy headerů. Na fotce můžeme využít title, perex a button. Text je dostupný v bílé a Solitea Blue, pozor na dostatečný kontrast s fotkou (viz slide s použitím Solitea Blue - špatně)
Tento typ headeru používáme pro menší nadpisy, případně se hodí pro úvod "zanořených stránek". Lze jej naplnit titlem, perexem a buttonem. Vzhledem k dynamickému parallaxu v něm nepoužíváme fotku. Lze použít s animací / bez animace.
Jen pro vás jsme nachystali tento katalog, aby se vám lépe tvořili landing pages a microsites. Doufáme, že vám to vaši práci ulehčí.
Tento typ headeru používáme pro menší nadpisy, případně se hodí pro úvod "zanořených stránek". Lze jej naplnit titlem, perexem a buttonem. Nepoužíváme jako header pro úvodní slide vlastní microsite/landing page.
Podívejte se, jak Vám náš katalog
usnadní pracovní život.
Tento typ headeru používáme pro menší nadpisy, případně se hodí pro úvod "zanořených stránek". Správně naplněný obsahuje title, perex a fotku. Lze doplinit o button.
V tomto bloku bude dobře fungovat středně dlouhý text. Musíme myslet na to, že se jedná o úvod - první věc, kterou zákazník vidí z naší landing page. Takže buďme zajímaví, nechceme ho odradit dlouhým textem už teď. Takže shrnout obsah a co ho zde čeká.
Tento prvek po kliknutí na button zaktivuje zprava vyjíždějící fullscreen okno. To zpravidla obsahuje kontaktní formulář.
test
Formulář popis
Footer je pevnou součástí každé microsite / landing page. Bez něho stránku nikdy nepublikujeme.
Jedná se o "obalovací prvek", který určuje barvu pro všechno, co je uvnitř. Barva je dostupná v subbrandových odstínech, dále je možnost vybrat s/bez nadpisu.
Umožňuje zobrazit články, které jsou dostupné na blogu solitea.com. Nejprve je třeba vytvořit článek na centrálním webu, až potom je možné ho propojit s builderem.
Blok používáme v případě poskytování souboru volně ke stažení. Pokud chceme za stažení souboru získat data zákazníka, tento blok není vhodný.
Blok slouží pro prezentaci pains/gains/aj. Prvek není klikatelný, takže není možné jej použít jako rozcestník. Lze použít naplněné pouze textově, tedy title a perex. Tento druh bloku nepodporuje ikony.
Tento blok je fakt super, protože mi dává možnost dát vedle sebe tři ideálně stejně dlouhé texty.
Tento blok je fakt super, protože mi dává možnost dát vedle sebe tři ideálně stejně dlouhé texty. A můžou být fakt hodně dlouhé. Takže zde můžu například detailně porovnat nějaká tři řešení, která můj produkt nabízí. Ale vždy myslím na to, aby byly bloky obsahově stejně nebo alespoň podobně naplněné. Tato stupnice "náplní" slouží k tomu, abyste věděli, že obsahově je zde dost prostoru.
Tento blok je fakt super, protože mi dává možnost dát vedle sebe tři ideálně stejně dlouhé texty. A můžou být fakt hodně dlouhé. Takže zde můžu například detailně porovnat nějaká tři řešení, která můj produkt nabízí. Ale vždy myslím na to, aby byly bloky obsahově stejně nebo alespoň podobně naplněné. Tato stupnice "náplní" slouží k tomu, abyste věděli, že obsahově je zde dost prostoru. A protože textu se vejde fakt hodně, text sem ještě jednou zkopíruju.Tento blok je fakt super, protože mi dává možnost dát vedle sebe tři ideálně stejně dlouhé texty. A můžou být fakt hodně dlouhé. Takže zde můžu například detailně porovnat nějaká tři řešení, která můj produkt nabízí. Ale vždy myslím na to, aby byly bloky obsahově stejně nebo alespoň podobně naplněné. Tato stupnice "náplní" slouží k tomu, abyste věděli, že obsahově je zde dost prostoru.
Používáme pro velké množství obsahu - primárně je zobrazen pouze jeden odstavec, pro další je nutné rozkliknutí. Text je spojen s fotkou - pozor, aby text nepřetekl výšku fotky. Blok je dostupný v subbradnových barvách.
Je důležité, aby zvolený obrázek korespondoval s textem. Obrázek nám slouží jako jeho dokreslí, takže by to společně s obsahem sdělení mělo ladit. Důležitá je ale také délka tohoto textu. Neměl by přesahovat svou délkou výšku obrázku. To designově opravdu nepůsobí dobře.
Je důležité, aby zvolený obrázek korespondoval s textem. Obrázek nám slouží jako jeho dokreslí, takže by to společně s obsahem sdělení mělo ladit. Důležitá je ale také délka tohoto textu. Neměl by přesahovat svou délkou výšku obrázku. To designově opravdu nepůsobí dobře. Tato fotka je vyšší - proto můžu použít obsahově delší text.
Citaci používáme v kombinaci s fotkou nebo s logem. Lze použít jako referenci nebo citaci vlastního zaměstnance. Podklad je dostupný v subbrandových barvách.
Ve firmě Solitea pracuju vážně rád. Ačkoliv se jedná o opravdu velký holding, snaží se udržet osobité vztahy a jednání. Když mám nějaký problém, tak ho mám s kým řešit a nemusím si lámat hlavu s tím, za kým mám vlastně jít. Prostě je to tady fajn. Navíc se jednotlivým subbrandům daří udržet specifickou atmosféru. A tak to má být.
Josef Nárožný
Marketingový specialista Solitea Vario
Jedná se o fullscreenový blok, který má v levé části obsah a vpravo formuláře. Obsah lze naplnit titlem, perex a také fotkou. Je vhodné například pro e-book ke stažení - vlevo prezentujeme obsah e-booku, formulář vpravo pak služí k jeho stažení.
Používáme pro trojsloupcový odrážkový seznam. Lze použít čístlo / odrážky.
Tento text zde můžu, ale nemusím mít. Záleží na tom, jestli výčet seznamu potřebuje uvést nějakým perexem. Pokud je název dostatečně srozumitelný a obsah očividný, perex zde být rozhodně nemusí.
Formulář plníme dle požadavků na údaje, které chceme od zákazníka získat. Nezapomenout na zaškrtávací políčka - Souhlas ze zpracováním údajů.
Lze použít na zdůraznění pains, gains, procesu aj. Není klikatelné, ani ničím orámované. Správně naplněné obsahuje ikonu/číslo, title a perex.
Jako první zvolím vhodnou ikonu k obsahu.
Pozor na nevhodně příliš dlouhý text.
Obrázek se maximalixuje při kliknutí - proto dbáme na dostatečnou kvalitu.
Hodí se pro dlouhý text. Ideální strukturovat do odstavců. Je možné naplnit i fotkou.
Blok s názvem Obsah používáme pro opravdu dlouhý text. Slouží tedy k detailnímu popisku našeho řešení, produktu nebo jej lze použít pro vyprávění nějakého příběhu. Rozhodně ho nepoužíváme, pokud chceme říct pouze pár úderných slov.
Blok s názvem Obsah používáme pro opravdu dlouhý text. Slouží tedy k detailnímu popisku našeho řešení, produktu nebo jej lze použít pro vyprávění nějakého příběhu. Rozhodně ho nepoužíváme, pokud chceme říct pouze pár úderných slov.
Hodí se pro přihlášení na odběr Newsletteru aj.
Slouží pro srovnávání ne/výhod řešení aj. Max tři sloupce.
Zde můžete v případě porovnání dvou produktů dát krátký perex, kterým se porovnání uvede. Například, že je to ERP systém pro středně velké podniky.
Zde můžete v případě porovnání dvou produktů dát krátký perex, kterým se porovnání uvede. Například, že je to ERP systém pro středně velké podniky.
Pro zobrazení kroků v postupu - implementace, spuštění, zhodnocení aj. Jednotlivé karty nejsou klikatelné.
Vyberu si z již existujících bloků.
Nechám si naklikat landing page.
Zkontroluju obsah a používám ji.
Používáme hlavně pro prezentaci referečních společností. Loga vkládáme v šedivé barvě (přímo definovaný odstín solitea blue).
Lze použít jako rozcestník. Správně naplněná karta obsahuje nadpis, perex a button.
Tento blok je klikatelný, takže se jedná o nejlepšího parťáka pro rozcestník. My jsme ho použili na referenční stránce, kde každá firma znamená jiný sektor. První karta tak může vést na řešení pro malé podniky a živnostníky.
Tento blok je klikatelný, takže se jedná o nejlepšího parťáka pro rozcestník. My jsme ho použili na referenční stránce, kde každá firma znamená jiný sektor. Druhá karta tak může vést na dostupná řešení pro velké společnosti.
Používáme pro obsáhlý text v kombinaci s ikonou - například když nemáme k dispozici fotku. Nelze použít jako rozcestník nebo pro porovnání - bloky se řadí pod sebou.
Někdy se může stát, že budeme mít velké množství textu, ale nebudeme k němu mít žádnou fotku. Jak takovou situaci řešit? Textovým blokem s ikonou - ano, protože i s ikonou se dají dělat velké věco. Nebude to na pohled tak lákavé, jako blok s fotkou, ale určitě to splní svůj účel. Zatím se nám nestalo, že bychom fotku nezvládli pro obsah najít, ale je lepší být vždy připraven. No není to pravda?
Používáme pro text v kombinaci s fotkou. Lze doplnit o title a button. Pozor, aby délka textu nepřetekla přes výšku fotografie.
Je důležité, aby zvolený obrázek korespondoval s textem. Obrázek nám slouží jako jeho dokreslí, takže by to společně s obsahem sdělení mělo ladit. Důležitá je ale také délka tohoto textu. Neměl by přesahovat svou délkou výšku obrázku. To designově opravdu nepůsobí dobře
Používáme pro text v kombinaci s fotkou - screenem, který umístíme do rámečku dle zařízení (mobil, tablet, notebook). Lze doplnit o title a button. Pozor, aby druh rámečku udpovídal obrázku, který do něho umísťujeme. Hodí se například pro screeny z aplikací. Velikosti screenů: telefon - 186x400 px, tablet - 550x418 px, notebook - 479x304 px
Tyto rámečky jsou dělané speciálně pro náplň ve formě screenů - z webových prohlížečů či z aplikací. Je důležité, aby byl screen připraven v přesné velikosti, jinak v kombinaci s rámečkem nepůsobí dobře. Pozor na barvu pozadí - subbrand barvy jsou určené pro subbrand řešení. Velikost screenu pro notebook 479x304 px.
Tyto rámečky jsou dělané speciálně pro náplň ve formě screenů - z webových prohlížečů či z aplikací. Je důležité, aby byl screen připraven v přesné velikosti, jinak v kombinaci s rámečkem nepůsobí dobře. Pozor na barvu pozadí - subbrand barvy jsou určené pro subbrand řešení. Velikost screenu pro tablet 550x418 px.
Tyto rámečky jsou dělané speciálně pro náplň ve formě screenů - z webových prohlížečů či z aplikací. Je důležité, aby byl screen připraven v přesné velikosti, jinak v kombinaci s rámečkem nepůsobí dobře. Pozor na barvu pozadí - subbrand barvy jsou určené pro subbrand řešení. Velikost screenu pro telefon 186x400 px.
Používáme pro text v kombinaci se slideshow. Lze doplnit o title a button. Pozor, aby délka textu nepřetekla přes výšku fotografií. Pozadí je dostupné v subbrandových barvách.
Použití slideshow se hodí pro prezentaci systému nebo řešení pomocí vizualizací ze screeny - jak můžete vidět v pravo. Ukazujeme ERP systémy, ale zajímavě, z různých zařízní a různých míst. Je to fajn prvek, který může oživit každou landing page.
Popis Tlačítko
Slouží k prolinkování videa z Youtube - video je tedy nejprve potřeba nahrát tam, nikoli přímo do Xavera.
Využíváme, když chceme proces/postup/body podpořit číslicí - např. 5 na sebe navazujích výhod, 5 kroků v rámci procesu aj. Snažíme se držet maximálně pět odrážek. Pozadí bloku je dostupné v subbrand barvách.
Vymyslet si obsah stránky.
Vybrat si bloky z katalogu.
Domluvit se s plničem.
Zkompletovat podklady.
Počkat na naklikání.
Kontrola obsahu
Zveřejnění
Kontrola funkčnosti
Radost
Lze použít na zdůraznění pains, gains, procesu aj. Není klikatelné. Správně naplněné obsahuje ikonu/číslo, title a perex. Lze naplnit větším počtem karet - objeví se šipky pro posouvání.
Tyto dlaždice slouží k obsáhlému textu, který se nevejde Horizontálního seznamu ikon nebo Popisu procesu. Správně použité karty jsou vidět například na HR webu - v sekci FAQ, kde se nimi prezentuje proces výběrového řízení. Když použijeme více než 3 karty, objeví se nám posuvníky vlevo a vpravo. Počet karet je tak libovolný, ale ideálně je do 7 karet.
Tyto dlaždice slouží k obsáhlému textu, který se nevejde Horizontálního seznamu ikon nebo Popisu procesu. Správně použité karty jsou vidět například na HR webu - v sekci FAQ, kde se nimi prezentuje proces výběrového řízení. Když použijeme více než 3 karty, objeví se nám posuvníky vlevo a vpravo. Počet karet je tak libovolný, ale ideálně je do 7 karet.
Tyto dlaždice slouží k obsáhlému textu, který se nevejde Horizontálního seznamu ikon nebo Popisu procesu. Správně použité karty jsou vidět například na HR webu - v sekci FAQ, kde se nimi prezentuje proces výběrového řízení. Když použijeme více než 3 karty, objeví se nám posuvníky vlevo a vpravo. Počet karet je tak libovolný, ale ideálně je do 7 karet.
Tyto dlaždice slouží k obsáhlému textu, který se nevejde Horizontálního seznamu ikon nebo Popisu procesu. Správně použité karty jsou vidět například na HR webu - v sekci FAQ, kde se nimi prezentuje proces výběrového řízení. Když použijeme více než 3 karty, objeví se nám posuvníky vlevo a vpravo. Počet karet je tak libovolný, ale ideálně je do 7 karet.
Sekce slouží k rozdělení následující sekce podle kategorií/řešení aj. Obsah se bude měnit v celé následné sekci, ta je dostupná v subbrandových barvách. Doporučený maximální počet položek ve filteru je pět.