Funda ukuthi iziphequluli zewebhu zizinquma kanjani ukubonisa usebenzisa amanani wephesenti
Abafundi abaningi be- web design esabelayo banenkinga enzima besebenzisa amaphesenti wamanani ombanzi. Ngokuqondile, kukhona ukudideka nokuthi isiphequluli sinquma kanjani amaphesenti. Ngezansi uzothola incazelo eningiliziwe yokuthi amaphesenti asebenza kanjani ukubala okubanzi endaweni ye-respondent.
Ukusebenzisa ama-pixel wezimiso zokubanzi
Uma usebenzisa amaphikseli njengenani elibanzi, imiphumela iqondakala kakhulu. Uma usebenzisa i-CSS ukusetha ububanzi obuningi besici esihlokweni sedokhumenti kuma-pixels angu-100 ububanzi, leso sici sizoba usayizi ofana nowasetha kumaphikseli angu-100 ububanzi kokuqukethwe kwewebsite noma ezinye izindawo ikhasi. Ama-pixel ayinani eliphelele, ngakho-ke amaphikseli angu-100 angamaphikseli angu-100 kungakhathaliseki ukuthi kudokhumenti yakho isakhi sibonakala. Ngeshwa, kuyilapho ama-pixel amanani elula ukuwaqonda, awasebenzi kahle kumawebhusayithi aphendulayo.
U-Ethan Marcotte wahlanganisa leli gama elithi "umklamo wewebhu ophendulayo", echaza le ndlela njengoba inezihloko ezintathu eziyinhloko:
- Igridi yamanzi
- Imithombo ye-flux
- Imibuzo yemidiya
Lawo maphuzu amabili okuqala, igridi yamanzi nohlobo oluthambile, atholakala ngokusebenzisa amaphesenti, esikhundleni samaphikseli, ngamanani we-sizing.
Ukusebenzisa Amaphesenti Wezimiso Zokubanzi
Uma usebenzisa amaphesenti ukuze uthole ububanzi besici, ubukhulu obungempela bokuthi i-element ebonisa kuzohlukahluka kuye ngokuthi ikuphi kudokhumenti. Amaphesenti ayinani elilinganiselwe, okusho ukuthi ubukhulu obubonisiwe buhlobene nezinye izakhi kumadokhumenti wakho.
Isibonelo, uma ubeka ububanzi besithombe ku-50%, lokhu akusho ukuthi isithombe sizobonisa ingxenye yesayizi yayo evamile. Lona ukungaqondi kahle okuvamile.
Uma isithombe sinamaphikseli angu-600 ngobubanzi, bese usebenzisa inani le-CSS lokulibonisa ngo-50% alisho ukuthi lizoba ngamaphikseli angu-300 ububanzi kusiphequluli sewebhu. Leli nani lephesenti libalwa ngokusekelwe kwisici esinezithombe, hhayi ubukhulu bomdabu bomfanekiso ngokwawo. Uma isitsha (esingase sibe ukuhlukaniswa noma esinye isici se-HTML) singamaphikseli angu-1000 ububanzi, khona-ke isithombe sizoboniswa ngamaphikseli angu-500 kusukela lelo xabiso lingu-50% ububanzi besitsha. Uma i-element equkethe amaphikseli angu-400 ububanzi, isithombe sizoboniswa kuphela kuma-pixel angu-200, ngoba lelo xabiso lingu-50% we-container. Isithombe esicatshangelwe lapha sinamazinga angu-50% ancike ngokuphelele kwisici esiqukethe.
Khumbula, ukuklama okuphendulayo kuyamanzi. Izakhiwo namasayizi azoguquka njengoba usayizi weskrini / idivayisi ishintsha . Uma ucabanga ngalokhu emibhalweni engokwenyama, engekho yewebhu, kufana nokuba nebhodi lebhodibhodi ukuthi ugcwalisa izinto zokupakisha. Uma uthi leli bhokisi kufanele libe yingxenye igcwele lelo lwazi, inani lokupakisha oyidingayo lizohluka kuye ngobukhulu bebhokisi. Okufanayo kuqinisile kumaphesenti ama-width kumklamo wewebhu.
Amaphesenti asekelwe kwamanye amaphesenti
Esikhathini somfanekiso / isitsha, ngisebenzise amanani wephikelli ngento equkethe ukubonisa ukuthi isithombe esabelayo sizobonisa kanjani. Eqinisweni, isici esinezinto esingahle sibekwe kumaphesenti kanye nesithombe, noma ezinye izakhi, ngaphakathi kwalesi sitsha kuzothola amanani azo ngokusekelwe kumaphesenti wephesenti.
Nasi esinye isibonelo esibonisa lokhu ngokusebenza.
Ngithi unayo iwebhusayithi lapho isayithi lonke liqukethe khona phakathi kwesigaba "sesitsha" (umkhuba ovamile we-web design). Ngaphakathi kwaleso sigaba kukhona ezinye izigaba ezintathu oyogcina isitayela ukuze ubonise njengamakholomu amathathu aqondile. Leyo HTML ingabonakala kanje:
Manje, ungasebenzisa i-CSS ukusetha usayizi waleso sigaba "sesitsha" ukusho 90%. Kulesi sibonelo, ukuhlukaniswa kweziqukathi akunalo esinye isici esisizungezile ngaphandle komzimba, esingasethelanga kunoma yiliphi inani elithile. Ngokuzenzakalelayo, umzimba uzokhipha iwindi lesiphequluli esingu-100%. Ngakho-ke, iphesenti lehlukaniso "lesitsha" lizosekelwa ngobukhulu bewindi lesiphequluli. Njengoba leso swayindi sesiphequluli sishintsha ngosayizi, kanjalo nokho ubungakanani bala "isitsha". Ngakho uma iwindi lesiphequluli lingama-pixel angu-2000 ububanzi, lesi sigaba sizoboniswa ngamaphikseli angu-1800. Lokhu kubalwa njengamaphesenti angama-90 ka-2000 (2000 x .90 = 1800)), okuyisayizi wesiphequluli.
Uma ngabe ukuhlukaniswa komunye "kolol" okutholakala ngaphakathi "kwesitsha" kusethelwe esilinganisweni se-30%, ngamunye wabo uyoba ngu-540 amaphikiseli ububanzi kulo mzekelo. Lokhu kubalwa ngamaphikseli angu-1800 angu-3000 lapho isitsha siguqula khona (1800 x .30 = 540). Uma sishintshe iphesenti yalesi sigqebhezana, lezi zingxenye zangaphakathi nazo zizoshintsha ngobukhulu abazinikela ngoba zixhomeke kuleso sici esiqukethe.
Ake sicabange ukuthi amafasitela wesiphequluli ahlala ngamaphikseli angu-2000 ububanzi, kodwa sishintsha inani lephesenti lesitsha kuya ku-80% esikhundleni se-90%. Lokhu kusho ukuthi kuzokhipha amaphikseli angu-1600 ububanzi manje (2000 x .80 = 1600). Ngisho noma singashintshi i-CSS ngobukhulu bezinhlaka zethu ezingu-3 "zekholomu," futhi sibashiye ngo-30%, zizokwenza ngokuhlukile manje kusukela isici sabo esineziqu, okuyisimo esibekiwe, sesishintshile. Lezo zigaba ezintathu manje zizohlinzeka ngamaphikseli angu-480 ngamunye, okungama-30% we-1600, noma ubukhulu besitsha (1600 x .30 = 480).
Ukuthatha lokhu nakakhulu, uma ngabe kukhona isithombe ngaphakathi kwalawa maqembu "ekolishi" futhi leso sithombe sasilinganiselwe besebenzisa iphesenti, umongo wokulinganisa kwawo wawuyoba "ikholomu" ngokwayo. Njengoba leso sigaba "sekholomu" sashintsha ngosayizi, kanjalo nesithombe singaphakathi kuso. Ngakho uma ubukhulu besiphequluli noma "isitsha" sishintshiwe, lokho kuzoba nomthelela ekuhlukaneni "kwamakholomu" amathathu, okuzokwenza ushintshe ubukhulu besithombe ngaphakathi "kolol." Njengoba ubona, konke lokhu kuxhunyiwe lapho ifika kumazinga wokulinganisa okwenziwe ngamaphesenti.
Uma ucabangela ukuthi into engaphakathi ngaphakathi kwekhasi lewebhu izokhipha uma inani lamaphesenti lisetshenziselwa ububanzi bayo, udinga ukuqonda umongo lapho lesi sici siphelela emakethe yekhasi.
Ngokufigqiwe
Amaphesenti adlala indima ebalulekile ekwakheni isakhiwo sewebhusayithi ephendulayo . Kungakhathaliseki ukuthi uhlaziya izithombe ngokuphendula noma usebenzisa amaphesenti amaphesenti ukwenza igridi yamanzi kagesi abama-size ahlobene, ukuqonda lezi zibalo kuyodingeka ukuze kufinyelele ukubukeka okufisayo.