Layout Cross-browser, "umaakit" sa mga search engine

Kapag ang nilikha ng site ay mahalaga sa mga tuntunin ng pagiging epektibo nito ay isang cross-browser layout. Ano ito? Paano maaari itong gawin? Ano ang pitfalls ay doon?

Ano ang layout cross-browser?

Html / css - ay ang batayan para sa paglikha ng isang site. Maraming mga webmaster ay angkop para sa ito ayon sa prinsipyo: magandang nararamdaman ko - at tama na iyan. At kung paano nakakabigo ay kapag dumating ka mula sa iyong web browser o mobile device, at ang site ay hindi maipakita nang maayos. Sa mga naturang kaso, ang aid na ito ay nakakapag-agpang disenyo at layout cross-browser.

Css at html up sa kasong ito, ang katigasan ng loob, sa pamamagitan ng kung saan ang lahat ipinatupad. Sa ilang mga kaso, para sa hangaring ito ay maaaring kasangkot sa JavaScript. Ngunit ang tunay na layunin ay ang parehong - upang tiyakin na ang lahat ng bagay ay nagtrabaho sa iba't ibang mga bersyon. Samakatuwid, kung nais mong upang matiyak compatibility cross-browser, kaya na ang site ay mahusay na ipinapakita sa lahat ng mga browser, ito ay kinakailangan na mag-isip sa lahat ng oras, mula sa unang sandali ng trabaho sa site.

Walkthrough sa pangkalahatan

Kaya, tingnan natin kung paano gumawa ng layout cross-browser. Sa una ay dapat matukoy kung aling mga programa ay gagana site. Mangyaring tandaan na ang bilang ng mga web browser malapit sa dalawang daan, kaya subukan na mangyaring lahat ng tao - ito ay isang hindi kapani-paniwala kumplikado. Samakatuwid, pumili ng isang numero mula 3 hanggang 8. Upang magpasya kung ano ang mag-focus, maaari mong gamitin at serbisyo ng suporta tulad ng Yandex Metrika at Google Analytics. Pagkatapos na dapat mong malaman kung paano ang problema ay lutasin upang makamit ang cross-browser.

Maraming mga tao gawin ang kanilang banking on kaki. Ang espesyal na code, tagapili at mga panuntunan, na nauunawaan lamang sa isang tiyak na browser. Ngunit, na ibinigay na ikaw ay may na magsulat ng hindi bababa sa ilang sampu-sampung pagsingit para sa iba't ibang mga browser at bersyon ng browser, maraming throws tulad ng isang diskarte dahil sa kanyang mataas na halaga, ang tagal at wala sa matwid. Ang ilang mga umaasa sa ang paggamit ng mga item na iyon, na kung saan ay ipinapakita sa parehong paraan. Ngunit sa parehong oras madalas itong nawala ng isang bilang ng mga mahalagang kalamangan. Upang i-minimize pagkalugi, ang paggamit ng mas parallel at nakakapag-agpang disenyo. Ano ito?

Nakikiramay disenyo

Ito diskarte sa layout ng website, kung saan ang site ay isang goma, samakatuwid nga, yaong iakma sa iba't ibang mga laki ng screen at mga browser. Dapat ito ay nabanggit na ang agpang disenyo at cross-browser compatibility ay magkaugnay, at kapag sila makipag-usap tungkol sa isang bagay, ito ay karaniwang nagpapahiwatig ang ikalawa. Tingnan natin ang isang mabilis na halimbawa.

Mayroong ilang mga browser, tulad ng Opera at Opera Mini. на мобильных телефонах. Unang ginamit sa mga desktop computer, at ang pangalawang - sa mga mobile phone. Sa pangkalahatan ang mga ito ay katulad, ngunit may isang bilang ng mga tampok. Sa naturang mga kaso, ito ay mahalaga upang ikonekta ang mga indibidwal na mga file at / o ang paggamit ng media query. Ano ito? Sa unang kaso, ito ay lumilikha ng isang hiwalay na file, na kung saan ay naglalayong upang gumana partikular na browser, at nagrerehistro ang kanilang hamon. Sa pangalawang kaso, dapat kang mag-file sa media query. Kung ang iyong programa ay nakakatugon sa mga tiyak na mga kinakailangan ng load file sa ang nais na configuration.

Ano ang dapat kong gawin?

Sa una, dapat nating tandaan na kapag nagtatrabaho na may html, layout cross-browser ay nangangailangan ng espesyal na pansin. Samakatuwid, dapat mong gamitin ang pinakamataas na posibilidad ng cascading style sheet para sa higit na kahusayan. Kasabay din na kailangan upang baguhin ang ilang mga paraan ng nagtatrabaho. Kaya maraming mga walang karanasan tao kapag point out nila ang laki ng isang bagay, gamitin pixels - px. Isaalang-alang ang halimbawa ng isang malaking inscription header, na adorns tuktok ng site.

Siya lapad ay itinakda sa isang rate ng 800rh. Sa screen sa 1600rh ito ay lubos na kaakit-akit. Ngunit sa 700rh ito ay tumingin walang katotohanan. Ano ang dapat gawin sa kasong ito? Hindi mo maaaring tukuyin ang sukat sa pixels, at ang porsyento! At i-hold ang inskripsyon ay hindi magiging isang nakapirming haba, at kalahati ang lapad ng screen. porsyento ay maaaring itakda at ang distansya sa kung saan ang isang partikular na elemento ay malalagay sa mga gilid ng screen. Ngunit narito kung ano ang gagawin kung ang screen ay masyadong maliit?

Ipagpalagay na ito ay 300 pixels? Sa kasong ito, tutulungan namin media query na pangangailangan sa pag-aayos rehistro lapad. At kung ito ay katumbas ng 700rh at mas mababa, ito ay posible na magtatag na ang sign ay maghawak 75% ng upuan. At kung ang lapad ay katumbas ng 300 pixels o mas mababa, ito ay posible upang ilantad at 100%. Ang buong paksa ay napaka-kawili-wili at kapaki-pakinabang, kaya maaari itong pinag-aralan nang mas detalyado. Subalit, sayang, may impormasyon sa mga libro, at ilagay ang lahat sa mga artikulo ay hindi gagana.

Bakit agpang layout cross-browser umaakit sa mga search engine?

At ang sagot ay medyo simple: dahil ito ay nagpapakita na ang mga developer sundin ang mga site at gawin itong bilang kasiya-siya hangga't maaari para sa mga gumagamit nito. Ang ibig sabihin nito na ang naturang mga tao ay maaaring ma-hinihikayat sa pamamagitan ng pagbibigay sa kanila ng mas mataas na posisyon sa search engine. Of course, ang iyong site ay hindi agad na ipinapakita sa top-1, ngunit kasabay ng iba pang mga kadahilanan, ito ay lubos na tumaas. Dapat ito ay nabanggit na ito ay hindi lamang walang silbi kinakailangan ngunit ang isang bagay na kung saan Karapat kaya magkano pansin ay babayaran sa.

Matapos ang lahat, sa tingin lamang: ano ang user kapag siya ay makakakuha ng sa isang site na ay hindi masyadong maayang sa hitsura? Ngunit ito ay maaaring dumating sa naniniwala na ang mga search engine ay nag-aalok ng isang mababang kalidad na nilalaman! Samakatuwid, sila ay pinili nang maingat upang sites na dapat na inaalok. Bukod sa ito mayroon ding ng benepisyo sa mga webmaster dahil sila makabuo ng mataas na kalidad na shell para sa nilalaman, na kung saan ang mga tao ay magagawang upang makuha ang mga kinakailangang impormasyon mula sa anumang hardware: computer, laptop, tablet, smartphone o mobile phone. Alinsunod dito, ang mas maraming nasiyahan mga bisita, ang mas mabilis na lumalagong site at antas ng kita.

konklusyon

Imposibleng hindi upang tandaan ang mga mababang-loob katunayan na ang paglikha ng cross-browser na site na may nakikiramay disenyo - ito ay hindi madali, isang napaka-mahaba at matrabaho. Samakatuwid ito ay kinakailangan upang maging matiyaga at tandaan na ang disiplina - ito ay isang mahusay na bagay! Marahil may isang bagay na sa una magkamali, ngunit kailangan namin upang subukan upang tumingin para sa impormasyon, gumamit ng iba't ibang approach at hindi sa retreat. At pagkatapos ay siguraduhin na makakuha gumawa ng isang website na magiging kasiyahan upang ipakita sa mga bisita nito.