He aha ka hoʻolālā pane? (Video wikiō a me infographic)
Lawe ʻia i ʻumi mau makahiki no hoʻolālā hoʻolālā pūnaewele (RWD) e hele i ka mainstream mai Hoʻokomo mua ʻia ʻo Cameron Adams ka manaʻo i ka makahiki 2010. He akamai ka manaʻo – no ke aha e hiki ʻole ai iā mākou ke hoʻolālā i nā pūnaewele e hoʻololi i ka ʻike o ka hāmeʻa e nānā ʻia nei?
He aha ka hoʻolālā pane?
ʻO ka hoʻolālā pūnaewele pane he ala hoʻolālā e hōʻoia i ka hāʻawi ʻana o kahi pūnaewele i kahi ʻike nānā maikaʻi loa ma kekahi mea hana, me ka nānā ʻole i ka nui o ka pale a i ʻole ka hopena. Hoʻohana ʻia ia i ka hoʻohana ʻana i nā hoʻolālā maʻalahi, nā hoʻonohonoho pili pūnaewele, a me nā nīnau media e hana i kahi pūnaewele e hoʻololi i ka nui o ka pale e nānā ʻia ana. ʻO ia ke ʻano o kahi pūnaewele i hoʻolālā ʻia me ka hoʻolālā pūnaewele pane e nānā a hana maikaʻi ʻia ma kahi kamepiula papapihi, papa, a i ʻole kelepona.
I nā huaʻōlelo ʻē aʻe, hiki ke hoʻoponopono ʻia nā mea e like me nā kiʻi a me ke ʻano o ia mau mea. Eia kahi wikiō e wehewehe ana i ke ʻano o ka hoʻolālā pane a me ke kumu e hoʻokō ai kāu ʻoihana. Inā loaʻa iā ʻoe kahi hoʻolālā pūnaewele hou a i ʻole palapala noi pūnaewele i kūkulu ʻia, pono ka hoʻolālā pūnaewele pane, ʻaʻole he koho, ʻoiai ʻoi aku ka nui o ka hapalua o nā kaʻa pūnaewele āpau e hele mai ana mai nā polokalamu kelepona ʻokoʻa ka laulā viewport a me ke kiʻekiʻe.
ʻO ka hoʻolālā pane ka mea maikaʻi loa no nā mea hoʻolālā pūnaewele, ʻaʻole pono lākou e kūkulu i nā ʻike kūʻokoʻa kūʻokoʻa ma muli o ka hāmeʻa a i ʻole nā viewport. Hiki ke hoʻokō ʻia ka hoʻolālā pūnaewele pane me ka hoʻohana ʻana CSS.
Nā Nīnau Hōʻike Manaʻo CSS Viewport
Eia kekahi laʻana o kahi stylesheet e hoʻoponopono ana i ka nui o ka font ma muli o ka viewport me ka hoʻohana ʻana i kahi nīnau media:
/* Default styles for all devices */
body {
font-size: 16px;
line-height: 1.5;
}
/* Style changes for devices with a viewport width between 600px and 900px */
@media (min-width: 600px) and (max-width: 900px) {
body {
font-size: 18px;
}
}
/* Style changes for devices with a viewport width between 900px and 1200px */
@media (min-width: 900px) and (max-width: 1200px) {
body {
font-size: 20px;
}
}
/* Style changes for devices with a viewport width greater than 1200px */
@media (min-width: 1200px) {
body {
font-size: 22px;
}
}
Hoʻomaopopo pono nā polokalamu kele i ko lākou nui a hoʻouka lākou i ka stylesheet mai luna a lalo. Ma ka noiʻi ʻana i nā ʻano kūpono no ka nui o ka pale, hiki iā ʻoe ke hoʻonohonoho i nā mea hoʻonaninani kikoʻī no kēlā me kēia liʻiliʻi a me ka laulā nui. ʻAʻole kēia manaʻo he pono ʻoe e hoʻolālā i nā pūnaewele like ʻole no kēlā me kēia ʻāpana nui, pono ʻoe e hoʻololi i nā mea e pono ai me ka hoʻohana ʻana i nā nīnau media.
ʻO ka hana me ka noʻonoʻo noʻonoʻo-ʻo ka pae kumu maʻamau i kēia lā. Ke noʻonoʻo nei nā māka ʻoi aku ka maikaʻi ma loko o ka papa ʻaʻole wale no ka launa pūnaewele akā pili i ka ʻike o ka mea kūʻai aku.
ʻO Lucinda Duncalfe, Luna Hoʻokele o Monetate
Eia kahi infographic mai ʻO Monetate e hōʻike ana i nā pono kūpono o ka hana ʻana i hoʻokahi hoʻolālā pane no nā polokalamu he nui:
Hiki i kāu Pūnaewele ke pane?
ʻO kahi ala maʻalahi e ʻike ai inā pane mai kāu pūnaewele, ʻo ia wale nō ka ulu a hōʻemi paha i kāu puka aniani e ʻike ai inā neʻe nā mea e pili ana i ka laula o ka polokalamu kele pūnaewele.
No ka pololei, kuhikuhi i kāu Google Chrome polokalamu kele pūnaewele i kāu pūnaewele. E koho Nānā> Mea hoʻomohala> Mea Hana Mea Hoʻolālā mai ka papa kuhikuhi. E hoʻouka kēia i kahi pūʻulu o nā mea hana i kahi panel a i ʻole pukaaniani hou. Kaomi ma ka ikona liʻiliʻi ma ka ʻaoʻao hema o ka papa kuhikuhi Mea Hana Hoʻomohala e like me ke kiʻi kelepona a me ka papa. Hiki iā ʻoe ke koho i kekahi mau hāmeʻa maʻamau a hoʻololi paha inā makemake ʻoe e nānā i ka ʻaoʻao ma ke alo a i ʻole ke kū pololei.
Hiki iā ʻoe ke hoʻohana i nā koho hoʻokele ma luna e hoʻololi i ka ʻike mai ka ʻāina a i ke kiʻi, a i ʻole koho i kekahi o nā nui viewport i hoʻomākaukau ʻia. Hiki paha iā ʻoe ke hoʻouka hou i ka ʻaoʻao, akā ʻo ia ka mea hana ʻoi loa o ka honua no ka hōʻoia ʻana i kāu hoʻonohonoho pane a hōʻoia i ka maikaʻi o kāu pūnaewele ma nā hāmeʻa āpau.