Eitt af lykilhugtökunum í öllum móttækilegum hönnun er breytingin á skoðunarstærð. Það er vegna þess að hreyfanlegur sjónvarpsþáttur er mjög mismunandi frá skjáborði. Til að stjórna útsendastærðinni notum við venjulega metaplatsið með útsýni.
Hins vegar er viewport metatakið, eins og öllum verstu vafranum, sem er síðasta að eilífu, ekki W3C-gilt. Það var upphaflega kynnt af Apple í Safari og hefur síðan verið samþykkt af öðrum vöfrum. Þetta veldur ósamræmi framkvæmd.
Til hamingju, W3C hefur runnið til bjargar okkar aftur með því að kynna @viewport CSS regluna.
Með því að nota gamla meta tag nálgunina, þetta er hvernig við viljum segja vafranum hvaða stærð viewport ætti að líta á sem:
Alveg í sundur frá því að vera ógilt er sjónarhornið ekki gögn, það er kynning. Þannig að standa við gögnin okkar og kynningu aðskilnað meginreglur, viewport kennsla þarf að vera í CSS, ekki HTML.
W3C lausnin í CSS lítur svona út:
@viewport {width: device-width;}Eða til skiptis er hægt að stilla sýnardaginn með númeri, eins og svo:
@viewport {width: 640px;}Þú getur notað @viewport regluna í tengslum við @media fyrirspurnir til að knýja hvaða útsýni sem er stærri en 960 til að skreppa niður í 960px, eins og svo:
@media screen and (min-width: 960px){@viewport {width: 960px;}}The @viewport reglan gerir okkur einnig kleift að súmma inn á síðu sem vanræksla og jafnvel setja hámarks zoom:
@viewport {width: 960px;zoom: 1;max-zoom: 3;}Það er hægt að loka aðdráttur að öllu leyti með því að stilla notanda-zoom eignina á föstum. Hins vegar er nauðsynlegt að zooma, sérstaklega á smartphones, fyrir aðgengi og ég mæli með að nota þessa eign.
Eitt meira mjög gagnlegt eign leyfir okkur að læsa vefsíðu okkar í landslag eða myndatökuham:
@viewport {orientation: landscape;}Hér eru slæmar fréttir: þessi regla er aðeins studd af Internet Explorer 10 og Opera, og krefst þess að -ms- og -o- vafraforskeyti í sömu röð.
Þó að það sé vonbrigði að minnsta kosti að segja að sú staðreynd að skoða virkni er þegar í boði í flestum vöfrum ætti að þýða að þetta er einföld regla að taka upp. Vonandi munum við byrja að sjá það kynnt í næturbyggingu mjög fljótlega.
Ert þú sama um staðla? Gera W3C hjálp eða hindra framfarir á vefnum? Láttu okkur vita í athugasemdunum.