Prilagodljiva postavitev za spletna mesta

Kazalo:

Prilagodljiva postavitev za spletna mesta
Prilagodljiva postavitev za spletna mesta
Anonim

Bolj priljubljene so mobilne naprave, bolj neprijetno je pomikanje na večini spletnih mest. Zato že od leta 2012 spletni skrbniki uporabljajo rešitev, ki omogoča bolj udobno gledanje virov na zaslonih z nizko ločljivostjo - prilagodljivo postavitev.

Moderni trend

Prilagodljiva postavitev
Prilagodljiva postavitev

Danes približno pet milijard ljudi na Zemlji uporablja mobilne telefone, od tega jih ima tretjina pametne telefone. Zato postaja mobilni promet vse pomembnejši za lastnike spletnih mest. Verjetno se bo tak vir obiskovalcev sčasoma le povečal. Iskalniki so se hitro odzvali na ta trend. Veliki korporaciji "Yandex" in Google sta bistveno spremenila svoje algoritme za razvrščanje spletnih mest v rezultatih iskanja, pri čemer sta upoštevala razpoložljivost prilagodljive postavitve in oblikovanja. Preprosto povedano, bodo spletni viri, optimizirani za mobilne telefone, pametne telefone in tablice, imeli nekaj prednosti pred konkurenti.

Odzivna definicija postavitve

Prilagodljiva postavitev je način ustvarjanja okvirja spletne strani,samodejno spreminjanje lokacije blokov v skladu z ločljivostjo zaslona naprave, na kateri se gleda. To pomeni, da se s tem pristopom ustvarijo ločeni slogi za različne ločljivosti. Ta učinek se doseže s pisanjem posebnih datotek CSS.

prilagodljiva postavitev ločljivosti
prilagodljiva postavitev ločljivosti

Prej je bil problem rešen nekoliko drugače. Razvijalci so morali narediti veliko več "gibov telesa", pri čemer so ustvarili postavitev in zasnovo glavne različice spletnega mesta in naredili enako za mobilno. Glede na zaslon naprave, na kateri si je ogledal internetni projekt z razpoložljivo mobilno platformo, se je zagnala ustrezna različica spletnega mesta.

Ta pristop se v mnogih pogledih ni upravičil in večina spletnih skrbnikov se nikoli ni lotila ustvarjanja mobilne različice. Zdaj je ta vrstni red nadomestila prilagodljiva postavitev. Z ustvarjanjem okostja spletnega mesta s to tehnologijo, spletni skrbnik vse svoje napore osredotoči na ustvarjanje ene različice projekta, obiskovalci pa si ga lahko ogledajo z enako stopnjo udobja tako na velikem računalniškem zaslonu kot na mobilnem telefonu, pametnem telefonu ali tablici.

Prednosti odzivne postavitve

Kakšne so prednosti prilagodljive postavitve spletnega mesta? Prej je bilo omenjeno, da je prednost pravilen prikaz vseh blokov strani na kateri koli napravi. Tudi pozitiven vidik tega pristopa pri ustvarjanju predloge je hitrost izvajanja sprememb. Kaj to pomeni?

odzivna predloga postavitve
odzivna predloga postavitve

Če je imelo spletno mesto dve platformi, so morale biti spremembe v postavitvinajprej implementirajte v delovno različico, nato pa v mobilno različico. Če bi bile spremembe v kodi precej pomembne, bi lahko postopek takšnih sprememb trajal dolgo. S prilagodljivo postavitvijo se delo na spletnem mestu izvaja v eni datoteki. Spremembe postavitve spletne strani se bodo kmalu odrazile enako v produkcijski in mobilni različici.

Pomanjkljivost tega pristopa nekateri spletni skrbniki imenujejo zapletenost njegove izvedbe. Toda s prihodom CSS 3 je postalo ustvarjanje odzivne predloge postavitve precej preprosto. Tudi neizkušeni spletni skrbniki lahko svoje spletno mesto naredijo prijazno do mobilnih naprav.

Načela in značilnosti prilagodljive postavitve

Katera načela temeljijo na metodi odzivne postavitve v spletnem oblikovanju?

- Uporaba Fluid Layout Type.

- "gumijaste" slike.

- Uporaba medijskih poizvedb (predstavnostnih poizvedb).

- Potreba po razmišljanju o mobilnih napravah od samega začetka postavitve.

Iz teh temeljnih načel te metode ustvarjanja predloge sledijo naslednje značilnosti prilagodljive postavitve:

1. Oblikovanje in izdelava oblikovanja spletne strani ob upoštevanju dela na celotni paleti ločljivosti: od mobilnih do širokozaslonskih zaslonov.

2. Postavitev s kaskadnimi slogovnimi listami z uporabo tehnologije medijskih poizvedb, predstavljene v CSS 3.

3. Programiranje na strani odjemalca in strežnika za pošiljanje slik na mobilne naprave manjše velikosti in ločljivosti.

Pomemben vidik, ob upoštevanju, katera prilagodljiva postavitev je ustvarjena, jematrika ločljivosti priljubljenih elektronskih naprav. S tem pristopom k razvoju dizajna bo brskanje po spletu na katerem koli zaslonu zelo udobno. Toda kako veš, katere vključiti v sloge?

Kje začeti z odzivno postavitvijo?

Večina spletnih strani je narejena tako, da se na zaslonih pametnih telefonov in tablic pojavljajo drsne vrstice, ki niso tako priročne za brskanje, zasnova in postavitev številnih internetnih projektov pa preprosto "plavajo". Spletna mesta, ustvarjena za poučevanje spletnega oblikovanja, vsebujejo različne ločljivosti zaslonov različnih naprav, pod katerimi je vredno razporediti strani svojega spletnega mesta.

primeri prilagodljive postavitve
primeri prilagodljive postavitve

Prilagodljiva postavitev, katere primere lahko najdete precej pogosto, ima veliko prednosti. Kaj morate upoštevati, ko se lotevate postavitve strani na ta način?

Ko začnete delati na predlogi, je pomembno, da občasno preizkusite, kako dobro so bloki vsebine in postavitve prikazani na različnih zaslonih. Če želite to narediti, je včasih dovolj, da spremenite širino okna brskalnika. Datoteka s slogi prejme medijsko poizvedbo in prestavi bloke, s čimer naredi pomembne spremembe. Dobro orodje za testiranje odzivne predloge postavitve so lahko spletna mesta, ki posnemajo zaslone mobilnih naprav različnih modelov. Takšne storitve vam bodo omogočile, da natančno razmislite in ocenite, kako izgleda dizajn na zaslonih različnih mobilnih naprav.

Čeprav tehnologija tako odzivne postavitve ni tako preprosta, bo njeno obvladovanje zelo kmalu obrodilo sadove.

Priporočena: