Agpang layout para sa mga website

Ang unting popular na mobile device, mas malaki ang kakulangan sa ginhawa nadama kapag pag-scroll karamihan ng mga site. Iyon ay kung bakit, dahil 2012, ay naging mga webmaster gamitin na solusyon na gumagawa ng pagtingin sa mga mapagkukunan na may kaunti mas kumportable na screen resolution - agpang layout.

Ang kasalukuyang kalakaran

Ngayon, tungkol sa limang bilyong katao sa mundo ang gumagamit ng mobile phone, na may isang third sa kanila ay may smartphone. Samakatuwid, mobile data ng trapiko ay nagiging unting mahalaga sa mga may-ari ng website. Marahil, tulad ng isang pinagmulan ng mga bisita sa paglipas ng panahon ay lamang taasan.

Mga search engine mabilis reacted sa trend na ito. Malalaking mga korporasyon "Yandex" at ang Google na ginawa ng makabuluhang mga pagbabago sa kanilang algorithm para sa ranggo ng mga website sa mga resulta ng paghahanap, nang isinasaalang-alang ang availability ng agpang layout at disenyo. Sa madaling sabi, web-based na mga mapagkukunan na naka-optimize para sa mga mobile phone, smartphone at tablet, ay magkakaroon ng isang kalamangan sa kanilang mga kakumpitensiya.

Kahulugan ng agpang layout

Agpang layout - isang paraan ng paglikha ng isang framework ng mga web page, awtomatikong baguhin ang lokasyon ng ang mga bloke alinsunod sa mga resolution ng screen na aparato na kung saan ito ay tiningnan. Iyon ay, na may ganitong diskarte lumikha ka ng hiwalay na mga estilo para sa iba't ibang mga pahintulot. Ang epektong ito ay nakamit sa pamamagitan ng espesyal na pagsusulat CSS-file. ang problema ay malulutas medyo naiiba bago. Mga Nag-develop ay nagkaroon na magkaroon ng isang pulutong ng higit pa "muwestra", ang paglikha ng vorstku at disenyo ng mga pangunahing bersyon ng site at ang parehong napupunta para sa paggawa ng mobile. Depende sa screen aparato, na kung saan ay tiningnan sa isang proyekto sa Internet gamit ang mga umiiral na mobile platform, tumatakbo ang naaangkop na bersyon ng site.

Diskarte na ito ay sa maraming respeto hindi na-justify na, at karamihan sa mga webmaster ay hindi itakda ang tungkol sa paglikha ng isang mobile na bersyon. Ngayon palitan tulad ng isang order ay dumating agpang layout. Kapag lumilikha ng isang site framework sa tulong ng teknolohiyang ito, ang webmaster ay isip nang lubusan ang lahat ng mga pagsisikap nito sa paglikha ng isang bersyon ng proyekto, at mga bisita ay maaaring magkaroon ng parehong antas ng kaginhawaan, ang mga ito bilang isang malaking computer screen at sa iyong mobile phone, smartphone o tablet.

Bentahe ng agpang layout

Ano ang mga pakinabang ng isang agpang site layout? Dati ito ay nabanggit na ang bentahe ay ang tamang pagpapakita ng lahat ng mga bloke ng pahina sa anumang device. Isa rin itong positibong aspeto ng mga ito diskarte sa paglikha ng mga template ay maaaring tinatawag na ang bilis ng pagpapatupad ng mga pagbabago. Ano ang ibig sabihin?


Kapag may ay unang ipinatupad sa site ng dalawang platform vorstku ginawa upang ang mga pagbabago na kinakailangan sa pagtatrabaho bersyon, at pagkatapos - sa mga mobile. Kung ang mga pagbabago sa code ay lubos na matibay, ang proseso para sa paggawa ng mga naturang pagbabago ay maaaring lubos na maantala. Kapag agpang vorstke trabaho sa site ay isinasagawa sa isang solong file. Pagbabago na ginawa sa ang layout ng web page magiging pareho sa lalong madaling panahon lumitaw tulad ng sa isang gumaganang bersyon, at mobile.

Ang downside ng ito diskarte, ang ilang mga webmaster na tinatawag na ang pagiging kumplikado ng pagpapatupad nito. Ngunit sa pagdating ng CSS 3 upang lumikha ng isang agpang template layout ay napaka-simple. Hindi kahit na ang pinaka-nakaranas ng mga webmaster ay maaaring gumawa ng iyong site madaling upang tingnan sa isang aparatong mobile.

Ang mga prinsipyo at mga tampok agpang layout

Anong mga simulain maging batayan ang paraan ng agpang layout sa disenyo ng web?

- Ang paggamit ng "rubber" uri ng layout.

- "goma" na larawan.

- Gumamit ng media query (media-mga tanong).

- Ang kailangan mag-isip ng mga mobile na aparato na may ang umpisa ng layout.

Mula sa mga pangunahing mga prinsipyo ng ang paraan na ito ng paglikha ng isang template nagmula agpang layout sumusunod na tampok:

1. Disenyo at paglikha ng mga disenyo ng site, nang isinasaalang-alang trabaho sa buong hanay ng resolution: mula sa mga mobile sa malaking display format.

2. Positioning sa pamamagitan ng paggamit ng cascading style sheet sa media query gamit ang teknolohiya na lumitaw sa CSS 3.

3. Programming sa gilid ng parehong client at server para sa pagpapadala ng mga imahe sa mga aparatong mobile ng mas maliit na sukat at resolution.

Isang mahalagang aspeto, sa view ng kung saan lumilikha ng isang agpang layout - resolution matrix popular na electronic device. Ang ganitong mga isang diskarte sa disenyo ay gagawing web pag-browse sa anumang screen ay napaka-kumportable. Ngunit kung paano ang kilala mo kung alin ang nagkakahalaga upang isama sa estilo?

Pagsisimula vorstku agpang layout?

Karamihan sa mga site ay ginawa upang sa smartphone at tablet screen lumitaw ang mag-scroll bar na hindi gaanong madali upang mag-surf, at ang disenyo at layout ng maraming proyekto Internet simpleng "float". Sa Web site, nilikha upang turuan ang disenyo ng web, ay naglalaman ng iba't-ibang mga screen resolution ng mga iba't-ibang mga aparato, na kung saan bear ang mga pahina typeset ng iyong site.
Agpang layout, mga halimbawa ng na maaaring matagpuan ganap madalas, ay may maraming mga pakinabang. Ano ang dapat tandaan na may ganitong diskarte sa paglikha ng isang pahina ng layout?

Pagkuha upang gumana sa template, ito ay mahalaga na panaka-nakang upang subukan kung gaano kahusay ang ipinakitang nilalaman at layout ng mga bloke sa iba't-ibang mga screen. Upang magawa ito, minsan kailangan lang baguhin ang lapad ng window ng browser. File na may mga estilo ng mga natanggap query media at baguhin ang lokasyon ng ang mga bloke, paggawa ng makabuluhang pagbabago. Ang isang mahusay na tool upang subukan ang mga agpang template layout ay maaaring maging sites na gayahin ang mga screen ng mga mobile na aparato ng iba't ibang mga modelo. Ang mga serbisyong ito ay magbibigay-daan sa maingat na isaalang-alang at masuri kung gaano ang disenyo asta sa pagpapakita ng iba't-ibang mga mobile device.

Kahit na ang teknolohiya ng agpang layout ay hindi sobrang simple, ang pag-unlad ay magbunga lalong madaling panahon.