Kontaktu lapai ir liela nozīme, tāpēc tās dizainam jāpievērš īpaša uzmanība. Jo ērtāka ir saziņas lapa, jo lielākas iespējas tiek atvērtas vietnes īpašniekam. Ja kontaktu lapa ir izveidota pareizi, tā var ļoti labi ietekmēt reklāmguvumu līmeni: ja lietotājs var viegli sazināties ar vietnes pārvaldnieku vai administratoru, viņam būs pozitīva pieredze. Jo vienkāršāks process, jo mazāk lauku vai veidlapu lietotājam ir jāaizpilda, jo labāk konvertēt.

Laba kontaktu lapa var uzlabot vietni, jo tā rada apstākļus labām attiecībām starp apmeklētājiem un vietnes īpašnieku. Nav svarīgi, kāda veida vietne tā ir, tas varētu būt tiešsaistes veikals, ziņu portāls vai tīmekļa pakalpojums - atsauksmes ir ārkārtīgi svarīgas.

Neskatoties uz to, daudzi dizaineri par zemu novērtē pareizi izveidotas kontaktu lapas nozīmi, koncentrējoties uz galveno satura lapu noformējumu.

Gadās, ka lietotājam ātri jāsazinās ar vietnes īpašnieku vai jāsazinās ar klientu atbalstu. Tomēr nekas nedarbojas, pat ja izmantojat vietnes meklēšanu. Dažreiz nepieciešamā informācija vietnē atrodas, taču tā tiek “slēpta”, jo dizainers nav parūpējies par to pareiza navigācija un lietotājs vienkārši neredz vajadzīgo saiti. Izmisušais lietotājs ir gatavs zvanīt uz tālruni, taču arī nevar to atrast.

Uzņēmumi un tīmekļa pakalpojumi, kas lielu uzmanību pievērš kontaktu lapu noformējumam, rīkojas ārkārtīgi rūpīgi. Vienkārši tāpēc, ka šī lapa sniedz vairāk nekā tikai kontaktinformāciju: tā satur lietotājam nepieciešamo informāciju un ir interaktīva. Un, pats galvenais, laba kontaktu lapa mudina lietotāju atkal un atkal mijiedarboties ar vietni.

Kontaktu lapa ir sava veida saziņas platforma. Ja vietnes īpašnieks ļauj klientiem izteikt savu viedokli, tad tas jau ir aicinājums uz dialogu. Tīmekļa izstrādātāji un lietotāji var gūt labumu no šīs sadarbības, un šī iemesla dēļ tā ir pareizi jāizstrādā.

Kā zināms, dizaina funkcionalitāte ir viens no galvenajiem faktoriem. Kontaktu lapa satur svarīga informācija, tomēr to nav pārāk daudz, kas dažkārt var novest pie kļūdaina funkcionalitātes novērtējuma. Vietnes īpašnieks domā, ka tad, ja viņš ievietoja adresi lapā E-pasts un telefonu, tad ar to pilnīgi pietiek. Dažreiz viņam ir taisnība.

Tomēr dubultā funkcionalitātes pārbaude var dot vairāk labuma nekā kaitēt. Bojātas saites vai lapas, kas ir pārslogotas ar informāciju, kaitē iesaistei. Vietnes īpašnieks var nesaņemt svarīgu ziņojumu, taču vissliktākais notiks, ja viņš sniegs novecojušu vai neprecīzu informāciju. Veidojot kontaktu lapu, vispirms ir jādomā par lietotājiem, jo ​​galu galā šī lapa ir radīta tieši viņiem.

Atrašanās vieta

Ir obligāti jānodrošina, lai kontaktpersonu lapa vienmēr būtu pieejama lietotājiem. Vietnes izskats pat ar ekskluzīvu dizainu neko nenozīmē, ja lietotāji nevar atrast kontaktu lapu. Dažkārt nākas izstrādāt diezgan sarežģītas kontaktu veidlapas, tāpēc par instrukcijām jāparūpējas jau iepriekš. Lietotājiem būs vieglāk sazināties ar vietnes īpašnieku, ja viņiem būs detalizēts ceļvedis.

Dizaineram, kas izstrādā vietni, ir svarīgi atcerēties divus punktus:

• Primārajā navigācijā vienmēr ir jāiekļauj kontaktu lapa
• Lietotājiem ir jāatrod kontaktu lapa, kad viņi pirmo reizi apmeklē vietni, neatkarīgi no tā, kurā iekšējā lapā viņi nonāk

Balstoties uz dizaineru uzkrāto pieredzi, lietotāji mēdz meklēt kontaktinformāciju lapas labajā pusē, tāpēc ir lietderīgi tur ievietot saiti “Sazinieties ar mums”. Tomēr jāatceras, ka šī informācija lietotājam ir sekundāra nozīme, tāpēc nevajadzētu padarīt šo vietnes sadaļu pārāk pamanāmu vai uzmācīgu. Vislabāk darbojas saite uz kontaktu lapu, kas atrodas lapas augšējā labajā stūrī. Un vissliktākais ir saite nolaižamajā izvēlnē, jo lietotāji to var vienkārši nepamanīt.

Vienkāršas kontaktu veidlapas

Komerciālajām vietnēm kontaktu lapa ir ļoti svarīga, par to jau tika runāts iepriekš. Lai gan tas var nebūt tik skaists kā citas vietnes lapas, tai jābūt vienkāršai, lietotājam draudzīgai un saprotamai. Ja informācija nav pareizi strukturēta, slikti funkcionē vai ir maldinoša, tad maz ticams, ka vietnes īpašnieks varēs veidot ilgtermiņa attiecības ar saviem klientiem.

Bieži gadās, ka lietotājs, kurš vēlas atstāt ziņu, atstāj vietni, jo nevar aizpildīt kontaktformu. Vai arī viņš nevēlas, ja tas ir pārāk garš vai sarežģīts. Mūsdienu lietotāji nevēlas tērēt laiku detalizētu veidlapu aizpildīšanai, tāpēc ir vērts padomāt par to vienkāršošanu. Jo vienkāršāka forma, jo labāk, arī lietotāja pieredzei, tāpēc jākoncentrējas uz pamatinformācijas apkopošanu.

Precīzs formulējums

Ja mēs runājam par oficiālajām vietnēm, tad visās lapās, ieskaitot kontaktu lapu, jums ir jāievēro skaidra un precīza valoda par priekšrocībām, ko lietotājs gūs, kļūstot par uzņēmuma klientu. Kam tas paredzēts? Informācija, kas ir attīrīta no visa nevajadzīgā, ir visefektīvākais veids, kā piesaistīt un noturēt uzmanību. Labi apkopotiem datiem jābūt kodolīgiem, lai cilvēki varētu viegli atrast vajadzīgo.

Tāpat neaizmirstiet par vizuālo komponentu. Un mēs nerunājam tikai par pievilcīgu kontaktu veidlapu dizainu. Ja uzņēmumam ir fiziskā adrese, varat palīdzēt lietotājiem, kontaktu lapā ievietojot karti. Uzņēmumiem, kas atrodas lielajās pilsētās, ir ļoti svarīgi izskaidrot lietotājiem, kā viņiem būs ērtāk nokļūt savā birojā, veikalā vai noliktavā.

Kontaktu lapas atsaucība

Jebkurā tiešsaistes biznesā atsaucība ir galvenais. Šis ir stingrs noteikums, bez izņēmumiem. Tā kā internets attīstās ātrā tempā un tirgū parādās arvien jaunas ierīces, tas nozīmē, ka kontaktinformācijai jābūt pieejamai neatkarīgi no tā, kādu pārlūkprogrammu vai ierīci cilvēks izmanto. Šodien sacensībās ir ļoti viegli zaudēt – atliek tikai neoptimizēt savu kontaktu lapu attēlošanai mobilajās ierīcēs.

Neatņemamas sastāvdaļas

Kas ir labāks: e-pasta adrese vai saziņas veidlapa? Lietotājiem ir nepieciešams vienkāršus veidus savienojumus ar tiem nepieciešamo pakalpojumu sniedzējiem, tāpēc jums tie jāsatiekas pusceļā. Varat koncentrēties uz saziņu pa e-pastu vai ievietot kontaktformu – katrai metodei ir savi plusi un mīnusi.

Kontaktu veidlapas

• Saziņas veidlapa nedrīkst piespiest lietotājus pāriet uz citu lapu
• Kontaktforma nav paredzēta, lai izveidotu konts vai piesakieties pa e-pastu
• Ja iespējams, veidlapai ir jābūt automātiskās aizpildīšanas funkcijai.
• Kontaktformai jābūt iespējai nosūtīt ziņojumus un paziņojumus

E-pasts

• Saziņai pa e-pastu jābūt lietotājam drošai
• Visus nosūtītos datus ieteicams saglabāt turpmākai izmantošanai.
• Darbs ar saņemtajām ziņām ir jāveic sistemātiski, jums arī jāuzmanās dublējums datus

Validācijas veidlapa

Ir pārbaudes veidlapas liela nozīme kad jums ir nepieciešams uzzināt vairāk par vietnes lietotājiem. Turklāt validācijas process kaut kādā veidā virza lietotāju pareizajā virzienā, jo tas var pievērst viņa uzmanību nepareizi ievadītiem datiem vai tukšiem laukiem. Tādējādi verifikācijas veidlapa ietaupa klientu laiku, jo aizpildīšanas procesa beigās persona būs pārliecināta, ka viņa ziņojums tiks nosūtīts uz pareizo adresi.

Tālruņa numuri

Daudzi uzņēmumi savā kontaktu lapā nenorāda tālruņu numurus, jo baidās, ka pastāvīgie zvani traucēs darba procesam. Taču, tāpat kā kartes gadījumā, kontaktu lapā norādītie tālruņu numuri vairo lietotāju uzticību zīmolam, jo ​​klienti jūtas droši, ticot, ka sarežģītā situācijā varēs sazināties ar uzņēmuma darbinieku un pārrunāt radušos problēmu. Tālruņa numurs samazina attālumu starp vietnes īpašnieku un lietotāju, tas attiecas gan uz tradicionālajiem uzņēmumiem, gan tiešsaistes pakalpojumiem, kuriem nav fiziskas adreses.

Sociālo mediju profili

Sociālo tīklu pogas arvien biežāk atrodamas kontaktu lapās. Šī pieeja var ievērojami uzlabot vietnes iespējas, īpaši, ja klientu atbalsts tiek nodrošināts visu diennakti. Daudziem šķiet ērtāk sazināties ar uzņēmumu, izmantojot sociālo tīklu, tāpēc ir vērts padomāt par šo mijiedarbības veidu ar lietotāju.

Kontaktu lapas noformēšana

Patiešām labas kontaktu lapas norāda uz to dizaineru augsto kvalifikāciju. Un vissvarīgākā dizaina sastāvdaļa ir kontaktu lapas vizuālais stils. Kontaktu veidlapu gadījumā tas nozīmē lielus laukus, kas atvieglo datu iesniegšanu. Ja forma izskatās jauki, tā darbojas labāk.

Pirms projektēšanas uzsākšanas dizainerim ir jāveic detalizēta visa klienta sniegtā kontaktinformācijas izpēte. Visiem elementiem jābūt labi organizētiem, turklāt tiem jābūt harmoniski apvienotiem. Jums arī jāatceras, ka kontaktu lapai ir jāatbilst vietnes krāsu shēmai, lai lietotājs skaidri identificētu gan vietni, gan zīmolu.

Secinājums

Kontaktu lapai vienmēr jābūt redzamai. Tas attiecas ne tikai uz galveno lapu, bet arī uz visām pārējām vietnes lapām. Veidojot kontaktinformācijas lapu, ņemiet vērā, ka lietotāji varēs sazināties ar vietnes īpašnieku vai atbalsta komandu tikai tādā veidā, kā tas ir redzams cilnē “Kontakti”. Šajā gadījumā panākumu atslēga ir ērtības un vienkāršība. Mums ir jāsniedz lietotājiem tas, ko viņi vēlas. Ja lietotājam vietnē jāievada savi personas dati, vislabāk ir uzdot pamata jautājumus: vārds, uzvārds, e-pasta adrese. Saziņas veidlapā nedrīkst būt nevajadzīgi lauki. Tāpat jārūpējas par kontaktu lapas pielāgojamību – tām jābūt attēlotām jebkurā pārlūkprogrammā un jebkurā ierīcē. Ja kontaktu lapa ir izveidota pareizi, vietnes izredzes gūt panākumus ar lietotājiem ievērojami palielinās.

No autora: Laba kontaktu lapa ir ļoti svarīga, lai uzturētu attiecības ar apmeklētājiem. Neatkarīgi no tā, vai mēs runājam par e-komerciju, žurnāliem, personīgām vietnēm, tiešsaistes pakalpojumiem, lietotāji parasti meklē kontaktu lapu kā pirmo saziņas līdzekli ar jums. Savādi, ka daudzi tīmekļa dizaineri ignorē pieticīgo kontaktu lapu, pat uzskatot to par vienu no vismazāk svarīgajiem vietnes aspektiem. Labosim šo.

Labas kontaktu lapas nozīme

Kontaktu lapa bieži tiek ignorēta. Cik daudz vietņu esat apmeklējis, vēloties sazināties, lai sūdzētos par produktu vai pakalpojumu vai uzdotu jautājumu? Un cik bieži jums ir nācies cīnīties ar kontaktformu?

Laba kontaktu lapa ir noderīga jebkura veida uzņēmējdarbībai. Viņa spēj palielināt klientu apmierinātību, palīdzot atrisināt viņu problēmas. Tas var arī palīdzēt uzlabot jūsu produktus un pakalpojumus, nodrošinot skaidru iespēju saņemt vērtīgas atsauksmes.

Runājot par lietotāju tiešajām atsauksmēm, citi kanāli var būt ierobežoti. Televīzija, radio, žurnāli, avīzes... tie visi ir vienvirziena saziņas veidi. Tiešsaistes saziņai jābūt divvirzienu ielai; dialogs starp uzņēmēju un apmeklētāju. No tā gūst labumu abas puses, tāpēc laba kontaktu lapa ir tik svarīga.

Atrašanās vieta

Pirmais solis: kur ievietot savu kontaktinformāciju. Nav jēgas izveidot labāko kontaktu lapu pasaulē, ja apmeklētāji to nevar atrast. Jūs varat viņiem palīdzēt, ja ievērojat dažas dizaina tradīcijas.

Parasti kontaktinformāciju var atrast divās vietās:

Galvenā navigācija– ideāla vieta, kur izveidot saiti uz kontaktu lapu. Apmeklētāji parasti meklē kontaktu lapu labajā pusē, jo šķiet, ka tas ir sekundārs elements. Tāpēc jūs vienkārši redzēsit saiti uz kontaktu lapu kā vienu no pēdējiem vietnes navigācijas elementiem.

Mēs varam apskatīt arī mazāko apakšnavigāciju ekrāna augšējā labajā stūrī. Šī ir arī vērtīga pozīcija kontaktu lapai. Starp citu, labāk ir izvairīties no kontaktu lapas ievietošanas nolaižamajā izvēlnē, jo to var viegli palaist garām.

kājene ir arī iecienīta kontaktinformācijas vieta. Tajā var būt saite uz kontaktu lapu:

...vai svarīgākā kontaktinformācija:

Ir grūti paredzēt trafika plūsmu uz jūsu kontaktu lapu, tāpēc, ievietojot saites vismaz divās no minētajām vietām, jūs iegūsit labu apdrošināšanu.

Vissvarīgākais kontaktu lapā

Tagad esi mierīgs, ka apmeklētāji varēs atrast ceļu uz kontaktu lapu, laiks padomāt par reālo saturu. Sāksim ar pamatiem un apsvērsim informāciju, kas būtu jāuzrāda.

E-pasts/kontaktforma

E-pasta adrese ir vienkāršākais veids, kā sazināties tiešsaistē uzņēmējdarbībā. Varat arī izmantot saziņas veidlapu, kas nosūta e-pastu. Izmantojot veidlapu, jūs iegūstat lielāku kontroli pār saturu (obligātie lauki) un tādējādi varat novērst surogātpastu. Par saziņas veidlapām mēs runāsim šajā rakstā tālāk.

Adrese

Uzņēmumam, kuram ir tradicionāls veikals, nevajadzētu aizmirst norādīt savu adresi. Ja jums ir daudz veikalu, vislabāk katram izveidot atsevišķu lapu. Aizpildiet to, norādot konkrētu šī veikala kontaktinformāciju, darba laiku, norādījumus utt. Tas ir ne tikai noderīgi apmeklētājiem, bet arī var palīdzēt jūsu vietnei veikt vietējo meklēšanu.

Tālrunis

Tālruņa numura parādīšana rada uzticības sajūtu. To bieži uzskata par reāla uzņēmuma pazīmi, un tas patiešām palīdz tiešsaistes mazumtirgotājiem.

Daudzas vietnes ir sākušas pievienot sociālo mediju pogas savai kontaktu lapai. Lai gan tas var nebūt ieguvums visām vietnēm, dažiem apmeklētājiem tam ir pievienotā vērtība. Jo īpaši tāpēc, ka arvien vairāk uzņēmumu piedāvā klientu atbalstu caur Twitter (dažkārt pat 24/7).

Turklāt

Labai kontaktu lapai nav universāla risinājuma, kas būtu piemērots visiem. Jebkurai vietnei vai uzņēmumam ir nepieciešami noteikti elementi, kas citās vietnēs var būt nevajadzīgi.

Kontaktu lapā ir daudz papildu informācijas vai rekvizītu, kas jums noderēs. Tradicionālajiem veikaliem ir lietderīgi minēt, teiksim, darba laiku. Lielie uzņēmumi varētu izmantot saiti uz savu tiešsaistes tērzēšanu, un e-komercijas vietnes varētu veidot lietotāju uzticību, parādot savu PVN numuru.

Ērta informācija

Vienkārša informācijas izmantošana pasargās jūsu apmeklētājus no vilšanās kontaktu lapā.
Attēlu vietā iekļaujiet savu informāciju kā HTML tekstu. HTML teksts var kopēt un ielīmēt, tādējādi apmeklētājam ir vieglāk saglabāt jūsu kontaktinformāciju.

E-pasta adresē ir jāizmanto saite mailto. Tas apmeklētājam dod iespēju noklikšķināt uz tā un nosūtīt ziņojumu, nekopējot piegādes adresi un atverot pasta klients. Tomēr šīs metodes problēma var būt mēstuļu roboti, kas apkopo e-pasta adreses, kas saistītas ar saiti mailto:. Tāpēc vispirms varat tos sajaukt, izmantojot tādu pakalpojumu kā mailtoencoder.com.

Sānu piezīme. Tālruņa numuriem ir jābūt noklikšķināmiem. Pagājušajā gadā mēs publicējām nelielu padomu, kā padarīt tālruņa numura jutīgumu pret klikšķiem. Pateicoties nelielam koda fragmentam, viedtālruņi atpazīst tālruņu numurus un ļauj tiem piezvanīt. Tas ir patiešām ērti mobilo sakaru lietotājiem.

Uzņēmumi, kas lielā mērā paļaujas uz saviem tradicionālajiem veikaliem, bieži gūst lielu labumu no interaktīvās kartes, kas ļauj lietotājam ātri atrast ceļu uz mazumtirdzniecības vietām. Parādīt veikala adresi ir labi, bet pievienojot interaktīvā karte labāk.

Pateicoties Google kartesŠī noderīgā īpašuma ievietošana nevar būt vienkāršāka. Vienkārši ievadiet savu adresi pakalpojumā Google Maps un noklikšķiniet uz saites ikonas sānjoslā. Tur jums ir iegulšanas kods.

Vai zinājāt, ka varat pielāgot karti sev atbilstoši? Varat rediģēt kartes krāsas, pievienot pielāgotus kartes marķierus un izveidot leģendu. Vairāk par to varat lasīt vietnē developers.google.com. Varat arī apsvērt iespēju izmantot alternatīvus pakalpojumus, piemēram, diezgan pievilcīgo Mapbox.

Neaizmirstiet par meklētājprogrammu optimizāciju

Kā apmeklētājs jūs uzreiz atpazīsit adresi kontaktu lapā. Meklētājprogrammas tomēr ir nepieciešama neliela palīdzība dažādu elementu atpazīšanā.

Kontaktu veidlapas

Lielākā daļa vietņu savā lapā izmanto saziņas veidlapu. Tomēr dažas veidlapas ir nevajadzīgi sarežģītas un lietotājam nedraudzīgas.

Neatkarīgi no tā, cik vienkārša saziņas forma šķistu, patiesībā tā ir vairāku komponentu kombinācija. Viņiem visiem ir jāstrādā kopā, lai nodrošinātu vislabāko iespējamo lietotāja pieredzi.

Ievades lauki

Ievades lauki, piemēram, teksta lauki, opciju izvēles pogas (radiopogas), izvēles rūtiņas utt., ļauj lietotājam ievadīt nepieciešamo informāciju.

Vietnes apmeklētāji biežāk aizpilda īsas veidlapas, jo tās prasa mazāk pūļu. Ievades lauku skaits ir līdzsvars starp lietotāja pieredzi un biznesa vajadzībām. Hubspot analizēja vairāk nekā 40 000 veidlapu un aplūkoja ievades lauku skaita palielināšanas ietekmi. Viņu pētījumi liecina, ka jums vajadzētu izmantot pēc iespējas mazāk veidlapu lauku un būt īpaši uzmanīgiem ar sarežģītiem teksta apgabaliem un nolaižamajiem sarakstiem.

Palīdziet apmeklētājiem aizpildīt laukus pareizā formātā. Tālruņa numuri un datumi var būt slazds, īpaši starptautiskiem apmeklētājiem. HTML5 viettura atribūts jums palīdzēs.

Pēc tam noteikti atlasiet obligātos laukus (tie tradicionāli ir atzīmēti ar zvaigznīti *). Visdrošāk ir skaidri norādīt obligātos un neobligātos laukus.
Visbeidzot, ir lietderīgi izcelt aktīvo lauku. To var norādīt knapi vai ļoti spilgti - kā vēlaties.

Tālāk ir sniegts Džima Nīlsena apmācības saziņas veidlapas piemērs. Tas izmanto sarkano zvaigznīti obligātajiem laukiem, sniedz padomus par formātiem un izceļ aktīvo lauku.

Veidlapas apstiprināšana

Iekšējā validācija var arī novērst dažas kontakta formas slimības. Veidlapas iesniegšana un atkārtota iesniegšana tāpēc, ka esat ievadījis nepareizus datus vai datus nepareizā formātā, ir ļoti kaitinoši. Kā minēts šeit, vislabāk ir palīdzēt apmeklētājiem, parādot nepieciešamo formātu (piemēram, datumu, tālruņa numuru...).

Pogas

Nav saziņas veidlapas bez iesniegšanas pogas. Tam vajadzētu būt pašās beigās. Pogas tekstam izmantojiet “sūtīt ziņojumu”, nevis “iesniegt”, lai atgādinātu klientiem, ko viņi dara.
Parastais standarts no pagājušā gada ir iekļaut pogu "atiestatīt" vai "notīrīt formu". Nedari tā. Tas tiks nejauši noklikšķināts. Nav nekas sliktāks kā pārdomāta, detalizēta ziņojuma ierakstīšana un tā pazaudēšana atiestatīšanas pogas dēļ.

Atbilde

Apmeklētājs ievadīja savu kontaktinformāciju, uzrakstīja ziņojumu un nospieda pogu “sūtīt”. Ko tagad? Vai ziņa ieradās vai nē?

Pārlieciniet savus apmeklētājus, ka ziņojums ir veiksmīgi nosūtīts, parādot atbilstošu ziņojumu. Apstiprinājuma e-pasts ir arī laba ideja.

Tas pats padoms attiecas uz kļūdām. Kļūdas parādīšana, ja ziņojumu neizdodas nosūtīt, ir nepieciešamība, kas var novērst daudzus turpmākus strīdus. Kļūdas ziņojumam jābūt draudzīgam, tāpēc izvairieties no satraucošu kļūdu kodu rādīšanas.

Kontaktu lapas dizains

Kontaktu lapas noformēšanai ir daudz lietojumprogrammu. tehniskajām prasībām, bet neaizmirsīsim vienu no svarīgākie brīži: vizuālie stili.

Ja izmantojat saziņas veidlapu, padariet laukus lielus, draudzīgus un aicinošus aizpildīt. Baltā vieta un polsterējums jums labi noderēs.

Vietnes apmeklētāji, skatot tīmekļa lapu, ievēro F veida modeli, tāpēc ņemiet to vērā, veidojot marķējumu. Kontaktu veidlapām vislabāk ir sakārtot visus laukus vertikāli, nevis novietot tos blakus. Tas samazina apmeklētājam nepieciešamo acu kustību skaitu, aizpildot veidlapu.

Kontaktinformācijas lapai ir jāatbilst vietnes vizuālajām iezīmēm. Konsekvence ir izcilības atslēga. Piemēram, apskatiet šo kontaktu lapu, kas izstrādāta tā, lai tā izskatītos kā pastkarte.

Un, tāpat kā ar lielāko daļu tīmekļa dizainu saistīto uzdevumu; radošums ļoti atmaksājas. Nīls Patels izveidoja savu kontaktu lapu kā infografiku, trīskāršojot saziņas pieprasījumu skaitu.

Kontaktu formu piemēri

Runājot par labām kontaktu formām, iedvesmai aplūkosim šos piemērus (noklikšķiniet uz attēla, lai apmeklētu atbilstošo vietni):

Secinājums

Pirms veidojat savu kontaktpersonu lapu, pārliecinieties, vai apmeklētāji to var atrast. Saite uz to no galvenās navigācijas vai kājenes. Atcerieties, ka lielākā daļa cilvēku kontaktinformāciju meklē ekrāna labajā pusē.

Apsveriet, kāda informācija jums jāiekļauj. Svarīga ir iespēja nosūtīt ziņojumu pa e-pastu vai saziņas veidlapu. Var noderēt arī adrese un tālruņa numurs. Papildus informācija, piemēram, saites uz profiliem sociālajos tīklos un dažu veidu uzņēmējdarbībai ir nepieciešami arī darba laiki.

Interaktivitāte ir svarīga. Lietojiet atribūtu mailto e-pasta adresēm un tel: atribūtu tālruņu numuri(ļoti noderīgi apmeklētājiem no mobilajām ierīcēm). Varat ievietot interaktīvu karti, piemēram, Google Maps, taču ņemiet vērā veiktspējas ietekmi.

Saziņas veidlapas lietojamība var izveidot vai pārtraukt kontaktu lapu. Jautājiet tikai visnepieciešamāko informāciju. Varat izvairīties no galvassāpēm, parādot pareizu ievades lauku formātu un izmantojot iekšējo validāciju. Iesniedzot veidlapu, neaizmirstiet parādīt veiksmīgu ziņojumu iesniegšanu.

Vai jūsu vietne jau ir optimizēta mobilajām ierīcēm? Ja vēl ne, tas nav pasaules gals. Mūsdienu pārlūkprogrammās ir iekļauti jauninājumi, piemēram, piespiešanas tālummaiņa un automātiska regulēšana fonta izmērs.

Ja jums nav laika vai naudas, lai optimizētu savu vietni mobilajām ierīcēm, šeit ir desmit vienkāršas lietas, ko varat darīt tieši tagad, lai jūsu vietne izskatītos pieklājīga mobilo ierīču apmeklētājiem.

1. Iestatiet pareizos formas lauka atribūtus

Ja savā vietnē izmantojat ievades laukus lietotājvārdam vai adresei, izslēdziet automātisko labošanu un ieslēdziet automātisko lielo burtu lietojumu :

Tavs vārds:

Ja jūs to nedarīsiet, T9 automatizētā ievades sistēma aizstās nosaukumus, piemēram, “Erwan”, ar kaut ko līdzīgu “Erevan”.

Pirmās automātiskās izmantošanas iestatīšana lielie burti vārdos veidi atbrīvos lietotājus no nepieciešamības katru reizi iekļaut lielos burtus - tas ir, katrs vārds sāksies ar lielo burtu (piemēram, “Ken burns” kļūs par “Ken Burns”):

Padomājiet par visām nepilnībām, ar kurām lietotājs var saskarties jūsu vietnē.

Un neaizejot tālu no tēmas. Ja jūsu vietne pieprasa lietotājam e-pastu, izmantojiet e-pasta lauku, lai apmeklētājam nebūtu jāievada simbols @ no mobilās ierīces tastatūras:

Tavs e-pasts:

2. Iestatiet atbilstošu platumu mobilajām ierīcēm

Datora pārlūkprogrammā atveriet savu vietni un samaziniet programmas loga platumu, līdz tajā vairs neko nevarat nolasīt.

Tas būs minimālais pieļaujamais platums. Paņemiet pašreizējo platuma vērtību un iestatiet to uz @viewport rekvizītu, lapas galvā iestatot metatagu:

Nākamreiz, kad jūsu vietne tiks atvērta mobila ierīce, jūsu norādītais platums tiks iestatīts automātiski. Vietnes apmeklētājam nebūs jāizmanto Zoom:

Šajā attēlā ir redzama papildu vieta labajā pusē:

Un šajā attēlā redzama pareizi iestatītā platuma vērtība.

Ja jūsu vietne ir veidota uz mainīga izkārtojuma un darbojas ar visiem ekrāna izmēriem, jūsu uzdevums kļūst vēl vienkāršāks. Jums ir jāeksperimentē ar platumu, kādā vietne izskatās jauki un lasāma mobilajā ierīcē, un iestatiet šo vērtību metatagā.

3. Iestatiet attēlu platumu uz 100%.

Tagad, kad jūsu vietnei ir noteikts platums, daži attēli kļūs ļoti plati. Iepriekš tas nav noticis, jo galddatoru monitoru izšķirtspējas ir diezgan plašas un lielākā daļa attēlu iekļaujas platumā:

Lai no tā izvairītos, iestatiet attēlu maksimālo platumu uz 100%. Tādā veidā attēlu lielums tiks automātiski mainīts gadījumos, kad tie ir pārāk lieli mobilās ierīces ekrānam. Pievienojiet tālāk norādīto kodu savas vietnes CSS stiliem:

img (maksimālais platums: 100%)

Ja izmantojat attēlus kā fonu, kas nav img tags, vienkārši iestatiet CSS fona izmēra rekvizītu, lai tas saturētu . Tas mainīs fona attēla izmēru, ja ekrāna izšķirtspēja nav pietiekama, lai to parādītu 100% mērogā:

Galvene ( fons: url(header.png) 50% bez atkārtošanās; fona izmērs: satur )

Ja jūs uztraucaties, ka attēls kļūs mazāk skaidrs, tad jūs uztraucaties velti. Mūsdienu mobilajās ierīcēs tas nenotiks.

Kad apmeklētājs izmanto palielinājumu, pārlūkprogramma izmanto attēla skaidrības palielināšanas priekšrocības. Tomēr pārliecinieties, vai jūsu vietnes metatagā nav rekvizīta user-scalable=no. Ja tas tā nav, lietotājs nevarēs izmantot tālummaiņu:

4. Iestatiet ievades lauku platumu uz 100%.

Kad attēlu platums ir iestatīts, izmantojot rekvizītu max-width, veiciet līdzīgu triku ar ievades laukiem. Vienkārši pievienojiet savas vietnes CSS failam:

ievade, teksta apgabals (maksimālais platums: 100%)

Skatot vietni mobilajā ierīcē, šī opcija neļaus ievades laukiem paplašināties ārpus ekrāna.

5. Esiet piesardzīgs, izmantojot veidlapas iesniegšanas apstiprinājuma pogas Atspējot

Lai izvairītos no vairākiem klikšķiem uz veidlapas iesniegšanas apstiprinājuma pogas, pēc pirmā noklikšķināšanas uz tās ir jāpadara neaktīva iesniegšana.

Atšķirībā no galddatoriem mobilajās ierīcēs bieži tiek zaudēts savienojums ar tīklu. Ja padarīsit pogu neaktīvu, lietotājs nevarēs uz tās vēlreiz noklikšķināt. Un šajā situācijā paturiet prātā, ka šādas situācijas cēlonis var būt ne tikai tīkla zudums.

Laikā ienākošo zvanu Mobilās ierīces pārlūkprogramma tiks aizvērta. Un pēc tam atkārtosies situācija ar bloķētu apstiprinājuma pogu. Lietotājs nevarēs iesniegt jau aizpildītu veidlapu.

Un, ja joprojām nolemjat deaktivizēt iesniegšanas pogu, dariet to dažas sekundes.

6. Garās rindās izmantojiet vārdu aplaušanu

Dažreiz ir nepieciešams parādīt garas virknes, piemēram, kodu piemērus, saites, bankas kontu numurus. Ja izrādās, ka jūsu vietne ir šaura, lai parādītu visu rindiņu, tā var “iziet” ārpus mobilās ierīces ekrāna:

Izvairieties no šādas situācijas, izmantojot vārdu aplaušanas rekvizītu. Tas tiks aplauzts, kad līnija sasniegs ekrāna malu. Lietotājs redzēs visu nepieciešamo bez ritināšanas:

Tava parole: 435143a1b5fc8bb70a3aa9b10f6673a8

7. Esiet piesardzīgs, izmantojot atstarpes

Izplatīta prakse, parādot garas virknes, ir izmantot atstarpes ik pēc piecām rakstzīmēm. Tādējādi lietotājam būs ērtāk tos atcerēties, lai ievadītu citu lietojumprogrammu.

Tomēr gudrs lietotājs to nedarīs manuāli. Viņš izmantos starpliktuvi. Tomēr atstarpju gadījumā viņam tās būs jānoņem. Cik ērti un ātri ir noņemt atstarpes mobilajā ierīcē?

Lai izvairītos no šādām situācijām, izmantojiet atkāpes, nevis atstarpes starp rakstzīmju grupām:

Jūsu kods: 435143a1b5fc8bb

Kā redzat, “atstarpes” starp rakstzīmēm paliek, taču ar to atšķirību, ka, kopējot un ielīmējot, nekas nav jādzēš. Vismaz tas ir ērti un ietaupa laiku!

8. Mediju vaicājumu priekšrocības

Varat izveidot pielāgotus stilus, kas darbosies tikai, skatot vietni mobilajās ierīcēs (vai redzami nelielā pārlūkprogrammas logā), savukārt parastā tīmekļa lapas versija darbosies galddatorā. Lai to izdarītu, multivides vaicājumos izmantojiet mērķa stilus, kā parādīts tālāk esošajā piemērā.

Tagad jūs zināt vēl vienu triku, kas palīdzēs jūsu vietnei izskatīties labāk mobilajā ierīcē.

9. Izvairieties no fiksētas pozicionēšanas

Ja jūsu vietnes galvene vai sānjosla ir novietota fiksētā veidā, CSS pozīcijas rekvizīts ir iestatīts uz fiksētu . Esi uzmanīgs.

Ja iezīmējat šādi, jūsu nosaukums pieaugs līdz ar lapu un, iespējams, aizņems visu ekrāna vietu:

Vienkāršākais risinājums ir neizmantot fiksētas elementu pozīcijas attēlošanai mobilajās ierīcēs.

Tālāk sniegtajā piemērā, izmantojot multivides vaicājuma metodi, tiks parādīts, kā to ieviest:

10. Izmantojiet standarta fontus

Pielāgotu fontu izmantošana nodrošina vietnei profesionāla produkta izskatu, taču lietotājiem ir jālejupielādē fontu faili. Tas tiek darīts, pirms vietne tiek parādīta ierīcē.

Parasti šādu failu apjoms ir diezgan liels. Mobilajā ierīcē šis process var aizņemt ilgu laiku. Šobrīd teksta vietā ekrānā redzam tukšu vietu.