5 īsti reaģējošas tīmekļa vietnes iezīmes

Vai jums ir " atsaucīga tīmekļa vietne "? Šī ir vietne ar izkārtojumu, kas mainās atkarībā no apmeklētāja ierīces un ekrāna izmēra. Atbildīgs web dizains tagad ir nozares labākā prakse. To ieteicis Google un atrast miljoniem vietņu visā tīmeklī. Tomēr pastāv liela atšķirība starp to, ka vietne ir vienkārši pielāgota dažādiem ekrāna izmēriem un ir patiesi atsaucīga vietne.

Es regulāri redzu, ka uzņēmumi pārveido savu tīmekļa vietni un izspiež preses relīzi, atspoguļojot jaunā mobilā draudzīgā dizaina iespējas. Kad es apmeklēju šīs vietnes, tas, ko es bieži atrodu, ir izkārtojums, kas patiešām mērogojas un mainās, lai tas ietilptu dažādos ekrānos, bet tas ir tik tālu, cik viņi pieņem domu par atsaucību. Tas nav pietiekami. Patiesi atsaucīga tīmekļa vietne ir ne tikai mēroga, bet arī mazāka vai lielāka. Šajās vietnēs jūs atradīsiet arī šādas svarīgas iezīmes.

1. Optimizēta veiktspēja

Neviens nevēlas gaidīt vietnes ielādi, un, kad kāds izmanto mobilo ierīci ar savienojumu, kas, iespējams, ir mazāks par ideālu, vietnes ielādes nepieciešamība ir vēl svarīgāka.

Tātad, kā jūs optimizēt savas vietnes veiktspēju? Ja no jauna izveidojat vietni, kas ir pārprojektēšanas daļa, jums vajadzētu dot punktu, lai izveidotu izpildes budžetu kā daļu no šī projekta. Ja jūs strādājat ar esošu vietni un sākat no sākuma, pirmais solis ir pārbaudīt savas vietnes veiktspēju, lai redzētu, kur jūs šodien esat.

Kad būsit novirzījis vietni, kurā jūsu veiktspēja ir izturīga, varat sākt veikt nepieciešamos uzlabojumus, lai palielinātu lejupielādes ātrumu. Lieliska vieta, kur sākt, iespējams, ir ar jūsu vietnes attēliem. Pārāk lieli attēli ir # 1 vaininieks, kad runa ir par lēnu ielādes vietņu darbību, tāpēc attēlu optimizēšana tīmekļa piegādei patiešām var palīdzēt jūsu vietnei darboties.

Realitāte ir tāda, ka uzlabota vietnes veiktspēja un ātrs lejupielādes ātrums ir ieguvums, kuru visi apmeklētāji novērtēs. Galu galā neviens nekad nav sūdzējies, ka vietne ielādēta "pārāk strauji", bet, ja vietne aizņem pārāk ilgu laiku, lai to ielādētu, tā absolūti novērsīs cilvēkus, vai tas atbildīs "ekrānam" ekrānā vai nē.

2. Smart satura hierarhija

Ja lielajā ekrānā tiek parādīta vietne, jūs varat noformulēt saturu dažādos veidos, jo ir pieejams ievērojams ekrāna nekustamais īpašums. Varat uzreiz vienlaicīgi pielāgot svarīgus ziņojumus un attēlus, ziņu atjauninājumus, informāciju par notikumiem un vietnes navigāciju. Tas ļauj apmeklētājam viegli un ātri skenēt visu lapas saturu un izlemt, kas viņiem ir svarīgs.

Šis scenārijs mainās diezgan strauji, kad jūs izmantojat šīs vietnes dizainu un pārveidojat to mazās ekrānā, piemēram, mobilajā telefonā. Pēkšņi jūs strādājat ar daļu no ekrāna nekustamā īpašuma jums bija pirms. Tas nozīmē, ka jums ir jāizlemj, kas vispirms parādīsies vietnē, kas seko tam utt. Tā vietā, lai viss tiek uztverts uzreiz, jums visticamāk ir tikai vieta, lai parādītu vienu vai divas lietas (no kurām viena ir iespējama navigācija). Tas nozīmē, ka ir jāpieņem hierarhijas lēmumi. Diemžēl tas, kas bieži nosaka to, kas vispirms tiek rādīts ekrānā, un pēc tam otrais utt, ir veids, kā pati lappuse tiek kodēta. Visvieglāk, veidojot atsaucīgu vietni, vispirms ekrānā tiek parādīts viss, kas vispirms ir kods, kam seko otrais kods kodā un tā tālāk. Diemžēl tas, kas var būt vissvarīgākais vienā ierīcē, var nebūt tik kritisks citam. Patiesi atsaucīga vietne saprot, ka satura hierarhija ir jāmaina atkarībā no dažādām situācijām, un tai jābūt saprātīgai par to, ko tā parāda.

CSS izkārtojuma metožu uzlabojumi, tostarp CSS režģa izkārtojums, Flexbox un daudz kas cits, ļauj tīmekļa izstrādātājiem un izstrādātājiem vairāk saplūstoša satura noteikšanas iespēju, nevis HTML koda precīzu satura secību secību. Šo jauno izkārtojuma paņēmienu izmantošana kļūs vēl svarīgāka, jo ierīces ainava un mūsu vietnes lietotāju vajadzības turpina attīstīties.

3. Pieredze, kas ņem vērā ierīces stiprās un vājās puses

Uzturēšanās uz ierīču tēmu - katrai ierīcei, ko var izmantot, lai apmeklētu jūsu vietni, ir gan stiprās puses, gan vājās puses, kas raksturīgas šai platformai. Lieliska atsaucīga vietne saprot dažādu ierīču iespējas un ierobežojumus, un tās izmanto, lai izveidotu pielāgotu pieredzi, kas vislabāk atbilst jebkurai ierīcei, kuru apmeklētājs šobrīd var izmantot.

Piemēram, mobilajā telefonā ir vairākas funkcijas, kuras tradicionālajā galddatorā neatradīsiet. GPS ir viens no mobilajām ierīcēm paredzētas funkcijas piemērs (jā, jūs varat iegūt vispārīgu atrašanās vietas informāciju arī galddatoros, bet ierīces GPS ir daudz precīzāka). Jūsu vietne var izmantot GPS informāciju, lai viedprātīgi nosūtītu personai ļoti detalizētu un specifisku detalizētu informāciju par virzienu vai īpašiem piedāvājumiem, pamatojoties uz to, kurā brīdī viņi atrodas.

Cits šī principa piemērs praksē būtu vietne, kas saprot, kāda veida ekrāna displejs jūs izmantojat, un nosūta attēlus, kas vislabāk atbilst šim attēlam. Ja jums ir ekrāns ar augstu pikseļu blīvumu, varat izlemt nosūtīt uz šo ekrānu augstākas kvalitātes attēlus. Tomēr šie paši attēli būtu bezjēdzīgi mazāk ekrānā, un papildu kvalitāte tiktu zaudēta, bet papildu faila izmērs tiks lejupielādēts, ja nav konkrēta iemesla.

Really great responsive sites apsver visu lietotāju pieredzi un strādā, lai pielāgotu šo pieredzi, balstoties ne tikai uz ierīces ekrāna veidu vai lielumu, bet arī par citiem svarīgiem aparatūras aspektiem.

4. Saturs ar kontekstu

Sākotnēji pielāgojamais web dizains saņēma savu nosaukumu, ņemot vērā domu par vietnes izkārtojumu, kas atbilda dažādiem ekrāna izmēriem, bet jūs varat atbildēt tik daudz vairāk nekā tikai ekrāna izmērs. Izmantojot iepriekšējo ierīces stiprās un vājās puses izmantošanas piemēru, varat tos izmantot, kā arī citus datus, piemēram, datumu un laiku, lai patiešām pielāgotu vietnes pieredzi.

Iedomājieties lielas izstādes notikumu tīmekļa vietni. Lai gan pielāgojama vietne mainīs vietnes lapu izkārtojumu, lai mērogotu ar dažādiem ekrāniem, varat arī izmantot datumu, lai noteiktu, kurš saturs ir vissvarīgākais, lai to parādītu. Ja tas ir laika posms pirms pasākuma, jūs, iespējams, vēlēsities skaidri uzrādīt reģistrācijas informāciju. Ja tomēr notikums faktiski notiek šajā brīdī, reģistrācija var nebūt vissvarīgākais saturs. Tā vietā jūs varat izlemt, ka dienas notikumu grafiks ir kritisks, jo tas ir vairāk saistīts ar lietotāja tūlītējām vajadzībām.

Tālāk, veicot pasākumus, varat pieskarties ierīces GPS, lai noteiktu, kur viņi patiesībā atrodas izstādē. Varat viņiem sniegt interaktīvu saturu, ņemot vērā viņu atrašanās vietu, rādot tuvumā esošās kabīnes vai sesijas, lai sāktu darbu.

5. Pieejamība

Pēdējais piemērs, kurā mēs aplūkosim, kā vietne patiešām var apmierināt apmeklētāja vajadzības, ir domāt par vietnes pieejamību . TīmekĜa vietnēm vajadzētu būt iespējai izmantot pēc iespējas vairāk cilvēku, tostarp tos, kuriem ir invaliditāte. Jūsu vietnei vajadzētu būt iespējai izmantot to personu, kam ir nepieciešams ekrāns lasītājs vai cita palīgprogrammatūra, lai piekļūtu tā saturam. Tādā veidā jūsu vietne reaģē uz viņu vajadzībām, jo ​​esat nodrošinājis, ka pieredze, lai arī atšķirīga apmeklētājiem ar invaliditāti, joprojām ir piemērota.

Reaģējot pēc iespējas vairāk datu punktu, nevis tikai ekrāna izmēru, vietne var būt tik daudz vairāk kā tikai "mobilizēta". Tas var kļūt par patiesi atsaucīgu pieredzi katrā frāzes izteiksmē.