Kontaktná stránka je veľmi dôležitá, preto by ste jej dizajnu mali venovať osobitnú pozornosť. Čím pohodlnejšia je stránka kontaktu, tým viac príležitostí sa majiteľovi stránky otvára. Kontaktná stránka, ak je správne navrhnutá, môže dobre ovplyvniť konverzný pomer: ak sa používateľ môže ľahko obrátiť na správcu alebo správcu stránky, bude mať z interakcie pozitívne skúsenosti. Čím je tento proces jednoduchší, tým menej polí alebo formulárov musí používateľ vyplniť, tým lepšie je na konverziu.
Dobrá kontaktná stránka môže zlepšiť váš web, pretože vytvára podmienky pre dobrý vzťah medzi vašimi návštevníkmi a majiteľom webu. Nezáleží na tom, o aký druh stránky ide, či už ide o internetový obchod, spravodajský portál alebo webovú službu - spätná väzba je mimoriadne dôležitá.
Napriek tomu mnohí návrhári podceňujú dôležitosť dobre navrhnutej kontaktnej stránky so zameraním na dizajn hlavných stránok s obsahom.
Stáva sa tak, že používateľ potrebuje rýchlo kontaktovať majiteľa stránky alebo kontaktovať zákaznícku podporu. Nič však nefunguje, aj keď použijete vyhľadávanie na stránkach. Na stránke sú niekedy potrebné informácie, ktoré sú však „skryté“, pretože návrhár sa nestaral o správnu navigáciu a používateľ jednoducho nevidí požadovaný odkaz. Zúfalý používateľ je už pripravený telefonovať, ale nemôže ho nájsť ani on.
Spoločnosti a webové služby, ktoré kladú veľký dôraz na dizajn svojich kontaktných stránok, konajú mimoriadne opatrne. Jednoducho preto, že táto stránka neobsahuje iba kontaktné informácie: obsahuje informácie, ktoré používateľ potrebuje, a je interaktívna. A čo je najdôležitejšie, dobrá stránka s kontaktmi nabáda používateľa, aby so stránkou interagoval znova a znova.
Stránka s kontaktmi je druh platformy pre komunikáciu. Ak vlastník stránok umožní zákazníkom vyjadriť svoj názor, je to už pozvánka na dialóg. Weboví vývojári a používatelia môžu z tejto spolupráce ťažiť, a preto musí byť správne navrhnutá.
Ako viete, funkčnosť v dizajne je jedným z kľúčových faktorov. Kontaktná stránka obsahuje dôležité informácie, ale nie je ich príliš veľa, čo môže niekedy viesť k chybnému posúdeniu funkčnosti. Majiteľ stránok si myslí, že ak na stránku umiestnil e -mailovú adresu a telefónne číslo, stačí to. Niekedy má pravdu.
Dvojitá kontrola funkčnosti však môže priniesť viac úžitku ako škody. Nefunkčné odkazy alebo stránky, ktoré sú preplnené informáciami, poškodzujú interakciu. Majiteľ stránky nemusí dostať dôležitú správu, ale to najhoršie sa stane, ak poskytne zastarané alebo nepresné informácie. Pri navrhovaní stránky kontaktu musíte v prvom rade myslieť na používateľov, pretože nakoniec je táto stránka vytvorená špeciálne pre nich.
Poloha
Je nevyhnutné zaistiť, aby bola stránka s kontaktmi vždy k dispozícii používateľom. Vzhľad stránky, dokonca ani s exkluzívnym dizajnom, neznamená nič, ak používatelia nemôžu nájsť stránku s kontaktmi. Niekedy musíte navrhnúť pomerne zložité kontaktné formuláre, takže sa o pokyny musíte vopred postarať. Ak budú mať podrobného sprievodcu, bude pre používateľov jednoduchšie kontaktovať majiteľa stránky.
Pre tvorcu webových stránok je dôležité mať na pamäti dva body:
- Primárna navigácia by mala vždy obsahovať stránku kontaktu
- Užívatelia by mali nájsť kontaktnú stránku od prvej návštevy webu, bez ohľadu na to, na ktoré z interných stránok sa dostanú
Na základe skúseností, ktoré získali dizajnéri, majú používatelia tendenciu hľadať kontaktné informácie v pravej časti stránky, takže dáva zmysel umiestniť tam odkaz „Kontakt“. Malo by sa pamätať na to, že tieto informácie majú pre používateľa druhoradý význam, preto túto časť stránky nevytvárajte príliš viditeľnou alebo rušivou formou. Najlepšie funguje odkaz na stránku kontaktu umiestnenú v pravom hornom rohu stránky. Najhoršie je na tom odkaz v rozbaľovacej ponuke, pretože si ho používatelia jednoducho nemusia všimnúť.
Jednoduché kontaktné formuláre
Ako je uvedené vyššie, pre komerčné weby je kontaktná stránka veľmi dôležitá. Napriek tomu, že nemusí byť taký krásny ako ostatné stránky na webe, mal by byť jednoduchý, užívateľsky príjemný a zrozumiteľný. Ak informácie nie sú štruktúrované správne, fungujú zle alebo sú zavádzajúce, je nepravdepodobné, že by si vlastník stránok dokázal so svojimi zákazníkmi vybudovať dlhodobé vzťahy.
Často sa stáva, že používateľ, ktorý chce zanechať odkaz, opustí web, pretože nemôže vyplniť kontaktný formulár. Alebo nechce, ak je to príliš dlhé alebo komplikované. Používatelia dnes nechcú strácať čas vyplňovaním podrobných formulárov, preto stojí za zváženie ich zjednodušenie. Čím jednoduchšia je forma, tým lepšie, a to aj z hľadiska používateľského zážitku, preto sa musíte zamerať na zhromažďovanie základných informácií.
Presné znenie
Ak hovoríme o oficiálnych stránkach, potom na všetkých stránkach, vrátane kontaktnej stránky, musíte dodržiavať jasné a presné formulácie o výhodách, ktoré používateľ získa, keď sa stane klientom spoločnosti. Načo to je? Odstránenie všetkých nepotrebných informácií je najefektívnejším spôsobom, ako upútať a udržať pozornosť. Pekne zhrnuté údaje by mali byť stručné, aby ľudia ľahko našli to, čo potrebujú.
Nezabudnite tiež na vizuálne prvky. A nejde len o pútavé návrhy kontaktných formulárov. Ak má spoločnosť fyzickú adresu, môžete používateľom pomôcť umiestnením mapy na stránku kontaktu. Pre spoločnosti nachádzajúce sa vo veľkých mestách je veľmi dôležité vysvetliť používateľom, ako bude pre nich pohodlnejšie dostať sa do svojej kancelárie, obchodu alebo skladu.
Citlivosť kontaktných stránok
V každom internetovom obchode je responzivita všetko. Toto je tvrdé a rýchle pravidlo bez výnimiek. Keďže sa internet rýchlo vyvíja a na trhu sa objavuje stále viac nových zariadení, znamená to, že kontaktné informácie musia byť k dispozícii bez ohľadu na to, aký prehliadač alebo zariadenie človek používa. V dnešnej dobe je veľmi ľahké prehrať v konkurencii - stačí, ak nie je stránka kontaktu optimalizovaná na zobrazenie na mobilných zariadeniach.
Integrované komponenty
Čo je lepšie: e -mailová adresa alebo kontaktný formulár? Používatelia potrebujú jednoduché spôsoby, ako sa spojiť s poskytovateľmi služieb, ktorých potrebujú, a preto im musíte vyhovieť. Môžete sa zamerať na komunikáciu e -mailom alebo odoslaním kontaktného formulára - každá metóda má svoje výhody a nevýhody.
Kontaktné formuláre
- Kontaktný formulár by nemal používateľov nútiť prejsť na inú stránku
- Kontaktný formulár nie je na vytvorenie účtu alebo prihlásenie sa e -mailom
- Ak je to možné, formulár by mal mať funkciu automatického dopĺňania
- Kontaktný formulár musí mať funkčnosť na odosielanie správ a upozornení
E -mail
- E-mailová komunikácia musí byť bezpečná pre používateľov
- Odporúča sa uložiť všetky odoslané údaje pre budúce použitie.
- Prácu s prijatými správami by ste mali vykonávať systematicky, musíte sa tiež postarať o zálohovanie údajov
Overovací formulár
Kontrolné formuláre sú nevyhnutné, keď potrebujete vedieť viac o používateľoch vašich stránok. Proces validácie navyše nejakým spôsobom nasmeruje používateľa správnym smerom, pretože môže upozorniť na chybne zadané údaje alebo prázdne polia. Overovací formulár teda zákazníkom šetrí čas, pretože na konci procesu vypĺňania bude osoba pevne presvedčená, že jeho správa pôjde na správnu adresu.
Telefónne čísla
Mnoho spoločností neuvádza telefónne čísla na svojej kontaktnej stránke, pretože sa obáva, že neustále hovory budú zasahovať do ich pracovného toku. Avšak, ako v prípade karty, telefónne čísla na stránke kontaktu zvyšujú dôveru používateľa v značku, zákazníci sa cítia bezpečne, pretože veria, že v ťažkej situácii budú schopní kontaktovať zamestnanca spoločnosti a prediskutovať problém, ktorý má vznikli. Telefónne číslo skracuje vzdialenosť medzi majiteľom stránky a používateľom, to platí pre tradičné spoločnosti aj pre online služby, ktoré nemajú fyzickú adresu.
Profily sociálnych médií
Tlačidlá sociálnych médií sú na stránkach kontaktov stále bežnejšie. Tento prístup môže výrazne zvýšiť možnosti stránok, najmä ak je zákaznícka podpora poskytovaná nepretržite. Mnohým ľuďom vyhovuje viac sa spojiť so spoločnosťou prostredníctvom sociálnej siete, preto stojí za zváženie tento spôsob interakcie s používateľom.
Navrhovanie kontaktnej stránky
Naozaj dobré kontaktné stránky svedčia o vysokej šikovnosti dizajnérov, ktorí ich navrhli. A najdôležitejšou súčasťou dizajnu je vizuálny štýl kontaktnej stránky. V prípade kontaktných formulárov to znamená veľké polia, ktoré uľahčujú odosielanie údajov. Ak forma vyzerá pekne, lepšie sa s ňou pracuje.
Predtým, ako sa pustí do návrhu, by mal dizajnér vykonať podrobnú štúdiu všetkých kontaktných informácií, ktoré mu poskytne klient. Všetky prvky musia byť dobre zorganizované a musia byť harmonicky kombinované. Malo by sa tiež pamätať na to, že kontaktná stránka musí zodpovedať farebnej schéme stránky, aby používateľ mohol jedinečne identifikovať stránku aj značku.
Záver
Kontaktná stránka by mala byť vždy viditeľná. To platí nielen pre domovskú stránku, ale aj pre všetky ostatné stránky webu. Pri navrhovaní stránky s kontaktmi majte na pamäti, že používatelia budú môcť kontaktovať vlastníka lokality alebo tím podpory iba spôsobom, ktorý vidia na karte „Kontakty“. Pohodlie a jednoduchosť sú v tomto prípade kľúčom k úspechu. Musíte dať používateľom to, čo chcú. Ak používateľ musí na stránke zadať svoje osobné údaje, potom je najlepšie položiť si základné otázky: meno, priezvisko, e-mailová adresa. Kontaktný formulár by nemal obsahovať ďalšie polia. Musíte sa tiež postarať o odozvu kontaktnej stránky - mali by sa zobrazovať v každom prehliadači a na akomkoľvek zariadení. Ak je stránka s kontaktmi navrhnutá správne, šanca stránky na úspech medzi používateľmi sa výrazne zvýši.
Adaptívne rozloženie Táto stránka umožňuje webovým stránkam automaticky sa prispôsobiť obrazovkám tabletov a smartfónov. Návštevnosť z mobilného internetu každoročne rastie a na efektívne spracovanie tejto návštevnosti musíte používateľom ponúknuť weby reagujúce na užívateľské rozhranie.
Vyhľadávače používajú na hodnotenie reakcie stránok na mobilné zariadenia množstvo kritérií. Google sa snaží majiteľom smartfónov a tabletov uľahčiť používanie internetu tým, že webové stránky vhodné pre mobilné zariadenia vo výsledkoch mobilného vyhľadávania označuje špeciálnou značkou. vhodné pre mobilné zariadenia... Yandex má tiež algoritmus, ktorý dáva prednosť webom s mobilnou / responzívnou verziou pre používateľov v mobilnom vyhľadávaní.
Môžete skontrolovať zobrazenie stránky na mobilných zariadeniach v službách a.
Ryža. 1. Výsledky mobilného vyhľadávania spoločností Yandex a Google s poznámkou o priateľnosti stránok k mobilným zariadeniam Čo je responzívne rozloženie
Citlivé rozloženie predpokladá absenciu horizontálneho posúvača a škálovateľných oblastí pri zobrazení na akomkoľvek zariadení, čitateľného textu a veľkých oblastí pre prvky, na ktoré je možné kliknúť. Pomocou mediálnych dotazov môžete ovládať rozloženie a usporiadanie blokov na stránke a prestavať šablónu tak, aby sa prispôsobila rôznym veľkostiam obrazovky zariadenia.
V článku sú uvedené základné techniky vytvárania responzívnej webovej stránky. Pre responzívny dizajnšírka hlavného kontajnera webu je nastavená v%, pričom sa môže rovnať 100% šírky okna prehliadača alebo menej. Šírka stĺpcov mriežky je tiež nastavená v%. IN responzívny dizajnšírky hlavného kontajnera a stĺpcov mriežky sú stanovené pomocou hodnôt v px.
Technika responzívneho fluidného rozloženia, o ktorej sa hovorí v tejto lekcii, funguje skvele na dvojstĺpcovom rozložení, vďaka čomu je web responzívny a je možné ho ľahko zobraziť na mobilných zariadeniach. Šablóna predpokladá iné rozloženie hlavného obsahu stránok, v tejto lekcii bude rozloženie hlavnej stránky rozobrané.
Rozloženie hlavnej stránky
Stránka sa skladá z troch hlavných blokov: hlavička (hlavička), obalový kontajner pre hlavný obsah a bočný panel a päta (päta). Ako body zvratu v dizajne budeme brať 768 pixelov a 480 pixelov.
V prvom bode skryjeme hornú ponuku a postranný panel presunieme pod kontajner s príspevkami. V druhom bode zmeníme polohu prvkov hlavičky, zrušíme umiestnenie tlačidiel sociálnych médií v príspevkoch a zrušíme tok okolo stĺpcov päty.
Ryža. 2. Príklad responzívneho rozloženia 1. Meta tagy a sekcia
1) Pridajte do sekcie
potrebné súbory - odkaz na použité písma, knižnicu jQuery a doplnok prefixfree (aby sa nepísali predpony prehliadača pre vlastnosti):
2. Hlavička stránky
V záhlaví stránky
logo ;
tlačidlo na zobrazenie / skrytie hlavnej ponuky
