Jaké jsou nejnovější trendy v grafice stránek? Co funguje a co naopak nefunguje v designu? Kde shánět šablony, obrázky a jaké používat grafické editory? To vše se dozvíte v tomto článku.

Jaké jsou nejnovější trendy v grafice stránek

Momentálním trendem je jednoduchost, hravost, minimalismus a dostatečně kvalitní, originální obrázky.

Zapomeňte na složité grafiky minulých let, mikrostránky nyní vycházejí vstříc uživatelům a snaží se mu co nejvíce usnadnit cestu k primárnímu cíli (např. nabídnout hledaný produkt, aby si ho mohl prohlédnout, najít informace a koupit).

Nepoužívejte nudné fotky z fotobanky, nechte si fotky nafotit. Bude to více autentické a mikrostránka získá více osobní charakter.

Co funguje a co naopak nefunguje v designu

Obrázky by k sobě měly vzájemně ladit, měly by zapadat do celkového konceptu zbylého designu. Barvy také volíme tak, aby k sobě vzájemně ladily.

Vybíráme si obvykle tři barvy, které se k sobě vizuálně hodí. Pro výběr barev můžete použít např: Adobe color.

Vybíráme pouze jedno písmo, které se v různých velikostech vyskytuje všude stejné.

Co funguje:

• Minimalismus
• Flat design (jednoduchost a rychlejší načítání)
• Responsivní design (přizpůsobitelný pro mobilní zařízení)
• Velké a dobře čitelné písmo
• Obrázky a videa přes celou obrazovku
• Parallax (obrázky v poředí se pohybují jinak než v pozadí)
• Scrolling (Po stránkách se pohybujete pomocí skrolování dolů)

Více o tom najdete zde. U posledních dvou bodů dejte pozor na to, že vám to může zkomplikovat optimalizaci mikrostránky pro vyhledávače.

Měli bychom se vyhnout barvám, které neladí k barvám firemním. a barvám tiskovým, které v internetovém prostředí nevypadají, tak jak by měly.

Co nefunguje:

• Příliš mnoho prvků (uživatel se ztrácí)
• Barevné přechody, stíny a kulaté rohy u ikonek
• Mnoho malých a nevýrazných, nekvalitních obrázků
• Malé písmo, nebo špatně čitelná typografie
• Mikrostránka není responzivní

Špatně:

Kde shánět šablony a obrázky

Nejlepší šablony naleznete od Worpressu, jednoduché šablony jsou zdarma, nebo si můžete koupit šablonu přesně podle svých představ.

Šablony najdete na této stránce.

Špatně:

Můžete získat mnoho obrázků zdarma, nebo si zaplatit některou z mnoha databází obrázků. Nejlepší je však nafotit si vlastní fotky, pokud k tomu máte vybavení, čas a prostředky.

Volně dostupné obrázky

http://www.everystockphoto.com/
http://www.freeimages.com/
http://www.stockvault.net/
https://pixabay.com/
http://www.123rf.com/browsefreeimages.php
http://photorack.net/
http://imageafter.com/
http://www.dreamstime.com/free-photos – nutná registrace
http://www.freefoto.com/– pouze některé fotky jsou zdarma
http://www.freedigitalphotos.net/
https://pikwizard.com/

Článek o tom, kde sehnat vhodné obrázky, najdete zde.

Jaké používat grafické editory

Pokud potřebujete dosáhnout originální grafiky, odlišnosti, nebo když chcete upravit fotky tak, aby k sobě barvně ladily (odstíny, světlo, sytost), budete nejspíše potřebovat některý z grafických editorů.

Zde je ukázka několika základních editorů, které doporučujeme:

Grafické nástroje:

Photoshop

Ilustrator

Zoner

Práce s vektory:

Inscape

Bitmapy:

Pixlr

Práce s textem:

Indesign

Pořiďte si moderní, uživatelský přívětivý a originální grafický design pro vaši mikrostránku. Pokud se nechcete s grafikou pachtit, můžeme vám pomoci (odkaz na službu).

Bojujte proti internetové šedi, království to ocení a zahrne vás svojí přízní, nikdy totiž nezapomínejte na ty, kteří váš živí, když si objednávají vaše služby a produkty. Dopřejte jim maximální komfort, který si právem zaslouží.

Článek Grafika mikrostránky, již si zamiluje internet se nejdříve objevil na Včeliště.

Zdá se, že vytvořit mikrostránku je jednoduché a časově nenáročné, ale přitom je třeba vynaložit dost úsilí na to, aby byla vizuálně přitažlivá a fungovala, plnila svůj účel a na hlavní web přiváděla další a další návštěvy. Pojďme se společně podívat na 5 inspirativních mikrostránek, které se opravdu povedly a které jsou skvělým příkladem pro všechny.

V čem můžeme mikrostránky hodnotit

Každá mikrostránka může být docela jiná, záleží vždy na tvůrci, jeho kreativitě a šikovnosti, ale na zaměření samotné mikrostránky. Tomu by mělo odpovídat celkové vizuální provedení, navigace i zvolené informace a styl textů. Toto jsou 3 aspekty, které dělají z mikrostránek kvalitní mikrostránky:

• Zaměření na jedno téma: Pokud se návštěvník zajímá o skok padákem, nechce na vaší mikrostránce číst i o cyklistických závodech.
• Kvalitní a prověřené informace: Obsah mikrostránky by měl být prověřený. Jestliže se návštěvník spoléhá na informace od vás a hodně pro něj znamenají, bude rozezlen, když se bude realita lišit od toho, co u vás četl. A dá vám to pocítit.
• Kreativní design a pojetí sebe sama „jinak“: Díky mikrostránce se můžete svým příznivcům, odpůrcům i potenciálním zákazníkům přiblížit a ukázat se jim i v jiném světle, než v jakém vás doposud poznali. Mikrostránka je může překvapit designem, který se bude lišit od designu vašeho webu, i větší mírou možnosti interakce.

Mikrostránky, jimiž se můžete bez obav inspirovat

Zmíněné tři body jsou základem úspěchu. Mikrostránky lze navíc obdivovat zvlášť pro jejich provedení. Některé mají špičkový design, jiné perfektní navigaci. Vypadají takto:

SimpliSafe

Mikrostránka s tematikou zabezpečovacích systémů zaujme na první pohled, i kdybyste snad nechtěli. Všechny ihned zaujme svou jednoduchou, avšak velmi příjemnou a elegantní grafikou, která je báječně sladěná. Každého návštěvníka přivítá na hlavní stránce nepřehlédnutelný pás s fotografií jednoho z expertů SimpliSafe a na rozum i city příjemně útočící claim. Radost pohledět.

Mikrostránku najdete na adrese http://simplisafe.com/.

Coca-Cola Company

O tom, jak nenásilně, a přitom účinně podpořit celou značku, něco vědí tvůrci mikrostránky Coca-Cola Company. Vizuálně sice mírně připomíná online verzi bulvárních novin, svým obsahem a propagací značky Coca-Cola vše úspěšně dohání. Příjemná je i navigace – úvodní slider nabízí to, co by příchozí rozhodně neměli přehlédnout.

Mikrostránku můžete zhlédnout na adrese http://www.coca-colacompany.com/.

Juliana Bikes

Pro mnohé z nás jsou kola této značky neznámá, po návštěvě mikrostránky se však nejednomu návštěvníkovi vryjí do paměti. Jakmile na hlavní stránce na slideru naběhne fotografie cyklistky uhánějící přírodou, nejradši byste ihned sedli na JEJÍ kolo a svištěli s větrem o závod také. Tato mikrostránka je velmi povedenou podporou produktu.

Inspirujte se mikrostránkou na adrese http://www.julianabicycles.com/en/us.

Redbull Flight Lab

Tvůrci mikrostránky Redbull Flight Lab pro změnu vsadili na interaktivní design. Ten je už od první chvíle dynamický a vyzývá k dalšímu prozkoumávání ostatních částí mikrostránky.  Přitažlivé úvodní video prozrazuje, že si na stránce můžete vyrobit svou vlastní vlaštovku, kterou pošlete do světa. I její let následně ovlivňujete. Podaří se vám navigovat ji až do cíle? A až půjdete kolem regálu s Redbullem, že si na svou vlaštovku vzpomenete?

Zapojte se do vlaštovčích letů na adrese http://www.redbullflightlab.com/.

Think Bear

Mikrostránka Think Bear vkusně a neotřele představuje službu mladého dánského grafika, který zábavnou formou sděluje ostatním nejen to, co dělá a čím se živí, ale i to, co má rád. Dokonce se pochlubí i fotografiemi z cest. Ke všemu používá neotřelou formu – obrázky, grafy, náhledy. Sám dobře ví, že v jednoduchosti je krása, proto se této formulky drží.

Mikrostránku kreativního grafika najdete na adrese http://www.thinkbear.net/.

Mikrostránky nepodceňujte, těžte z nich!

Mikrostránka je svou konstrukcí i vzhledem často jednoduchá a nikterak záludná, pokud je ale kvalitně zpracovaná, může vám prokázat skvělou službu, ať už se spolehnete jen na ni, nebo ji necháte, aby na váš hlavní web přiváděla více a více zájemců. Využijte možnosti být na internetu lépe vidět. Mějte své mikrostránky!

Článek 5 příkladů mikrostránek, které dobře vypadají a fungují se nejdříve objevil na Včeliště.

Pokud tvoříte mikrostránky za účelem prodeje nějaké služby (produktu), určitě potřebujete být vidět. K tomu, aby vaše stránky byly vidět v neplaceném vyhledávání, je potřeba se zaměřit na SEO.

„Co je SEO? Je to technika úpravy webových stránek nebo také optimalizace tak, aby vaše stránky byly v neplaceném vyhledávání upřednostňovány oproti jiným ve stejném konkurenčním prostředí. Součástí SEO jsou různé technické úpravy a doplnění obsahu přímo na vašem webu.“

Přinášíme vám stručný návod, na co se zaměřit při optimalizaci mikrostránek:

Před samotným vytvořením mikrostránek myslete na několik doporučení.

1) Před vytvořením webu

• Zvolení správné domény (volte raději krátký a výstižný název bez pomlček, klíčová slova řešit nemusíte). Volnost domény zjistíte na Domeny.cz.
• Vyberte si dobrého poskytovatele pro hosting (Např. Wedos, Savana)
• Nastavte správně DNS servery, zabezpečení a další parametry (při špatném nastavení vám nebudou fungovat některé pluginy a aktualizace)

2) Vytvoření webu

• Nainstalujte web (doporučujeme např. WordPress, protože je jednoduchý a nejvíce rozšířený)
• Vyberte si vhodnou šablonu (která se vám líbí a splňuje všechny požadavky moderního webu: responsivní, UX friendly, jednoduchá, česká lokalizace, aktuální pro pluginy)

3) Základní nastavení (následující doporučení platí pro WordPress)

• Stáhněte si plugin pro nastavení základních SEO parametrů (např. Yoast plugin), mezi které patří:
• Sitemap.xml (automaticky generuje všechny stránky webu s aktualizací)
• Robots.txt (Měl by obsahovat specifikaci url sitemapy: Sitemap: http://www.domena.cz/sitemap.xml)
• Nastavte jednoduchý tvar adres (www.domena.cz/nazev-clanku, místo dlouhých adres www.domena.cz/kategorie/podkategorie/nazev-clanku)
• Stáhněte si plugin pro zvýšení rychlosti stránek a zabezpečení webu (doporučuji použít např. W3 total cache, WP optimize, Wordfence Security.)

4) Tvorba mikrostránky

Při tvorbě stránek vycházejte z analýzy klíčových slov (ať víte, co návštěvníky zajímá a co na internetu hledají)

Pro každou stránku správně nastavte:

• Url (měla by obsahovat klíčové slovo v jednoduchém tvaru: www.domana.cz/klicove-slovo)
• Title (do 60 znaků, na začátek dejte klíčové slovo a přidejte výzvu k akci, na konec přidejte brand). Více o tom, jak psát poutavé titulky.
• Př: Zálesácké nože – dva za cenu jednoho! | noze.cz
• Description (120 -150 znaků, Krátce 1-2 větami představte vaši stránku a nalákejte na kliknutí, nezapomeňte na klíčová slova). Více o meta description
• Př: Zálesácké nože pro opravdové muže. Nože jsou nerezové, téměř nezničitelné a nyní u nás koupíte dva nože za cenu jednoho, tak neváhejte!
• Nastavte tagy (vyberte všechna související témata a klíčová slova, důležité není množství ale relevance. Vybírejte takové, které přímo souvisí s tématem)

5) Úprava obsahu

Jakmile máte napsaný text pro danou stránku, zkontrolujte následující:

• Klíčová slova (text obsahuje dostatečný počet klíčových slov různých tvarů, pádů, synonym a souvisejících výrazů. V žádném případě neopakujte v textu dokola stejná klíčová slova, bylo by to hodnoceno vyhledávačem jako spam), zkuste zapojit vhodné long tail výrazy, Více o tom, jak využít long tail.
• Nadpisy (rozdělte text na jednotlivé podkapitoly s nadpisy, dodržujte hierchickou strukturu, cílem je zpřehlednit text uživateli)
• Odstavce (dělejte krátké odstavce, které usnadní orientaci v textu)
• Obrázky (vkládejte obrázky a nezapomeňte vyplnit parametry: title, description a ALT, k obrázku nezapomeňte přidat popis). Více v článku o alternativním popisu ALT.
• Videa (stejné jako u obrázku, dejte si však pozor na velikost videa i obrázků – neměly by zabírat příliš mnoho místa na disku). Psali jsme také o tom, jak optimalizovat videa.

6) Jak používat odkazy

Odkazy jsou natolik důležité, že je raději popíšu samostatně:

• Interní odkazy (snažte se na každé stránce odkazovat na všechna související témata, cílem je lépe provázat web a ukázat uživateli další zajímavé související stránky vašeho webu). O tom jak správně prolinkovat stránky odkazy.
• Externí odkazy (odkazujte také na externí nekonkurenční zdroje, používejte atribut „no follow“, vybírejte pouze zdroje informačně přínosné a minimálně kvalitnější, než je vaše stránka)
• Snažte se text odkazů (anchor text) nazvat tak, aby byl maximálně výstižný a pochopitelný
• Např. Když chci odkázat na článek „Vybíráme pro vás nejlepší nože pro zálesáky v roce 2015, odkaz by mohl být např: Nejlepší nože pro zálesáky 2015
• Odkazujte na různé zdroje, tím se zvýší důvěryhodnost vašeho webu a propojenost s dalším obsahem.

7) Zveřejnění článku

Jakmile máte nastavené všechny SEO parametry (zde si můžete zkontrolovat při SEO analýze), můžete se pustit do účinné propagace, ale o tom zase více v dalším článku.

Vytvořit mikrostránky se může zdát jako celkem jednoduché řešení, které zvládne každý. Opak je však pravdou, mnoho chyb můžete udělat hned na začátku při nastavení DNS, zabezpečení, nebo u špatně zvolených parametrů.

Může se vám pak snadno stát, že nebudou fungovat některé pluginy, což vám zkomplikuje situaci při dalších úpravách pro SEO a UX. Budete mít sice funkční web, ale vyhledávače či uživatelé ho budou ignorovat.

V případě že si nevíte rady s vytvořením skvěle optimalizované mikrostránky, rádi vám pomůžeme.

Mít optimalizovanou stránku pro uživatele i vyhledávače je důležité. Ale co když to nestačí? Chcete přece prodávat? Stáhněte si náš e-book, kde se dozvíte více.

Článek Optimalizace: Oblíbené a viditelné mikroweby se nejdříve objevil na Včeliště.