Ipadala ang tamang
kandidato ng imahe.
Isang pribado, browser-lamang na pagkuha para suriin ang pangunahing metadata ng imahe kasabay ng mga tanong sa paghahatid. Hindi nito ina-upload, iniimbak, ine-optimize, o sinusuri ang file lampas sa metadata at lokal na sukat.
GAMITIN ITO PARA SA: Gamitin upang ihanda ang pag-uusap tungkol sa paglalagay ng imahe, mga responsive na kandidato, accessible na alternative text, at mga kompromiso sa paghahatid.
Suriin ang panimulang punto.
Pumili ng lokal na imahe upang makita ang pangunahing browser-reported metadata at sukat. Hindi ina-upload, ipinapadala, iniimbak, ine-optimize, o sinisave ng SIU ang napiling file.
PUMILI NG LOKAL NA IMAHE — Walang napiling imahe. Walang na-upload o naimbak.
Wala ang lumalabas mula rito.
Ipapakita ng napiling imahe ang pangalan, MIME type na iniulat ng browser, laki sa bytes, oras ng huling pagbabago, at lokal na nadedekod na dimensyon.
Walang preview na gagawin. Pumili lamang ng imahe kung kapaki-pakinabang ang lokal na metadata para sa iyong pagsusuri.
Gawin ang susunod kilalang hakbang.
- Pumili ng isang lokal na imahe. Binabasa ng browser ang pangalan nito, MIME type, byte size, last-modified timestamp, at—kung nade-decode—mga pixel na dimensyon sa memorya lamang.
- Iugnay ang mga dimensyon sa inaasahang rendered na lapad at device density; pagkatapos magpasya kung kailangan ng pahina ng maramihang image candidates o art direction.
- Suriin ang konteksto ng markup: makahulugang alternative text, idineklara na dimensyon kapag angkop, responsive source selection, at loading priority ay magkakahiwalay na desisyon.
- Panatilihin ang orihinal na source asset sa ilalim ng itinatag na proseso ng asset at lisensya ng koponan. Hindi lumilikha ang pahinang ito ng mga derivative file.
Suriin ang na-render na pahina sa mga inaasahang breakpoint gamit ang inaprubahang browser at performance tools ng koponan.
Kumpirmahin ang alternative text ng imahe at ang aktwal na responsive markup sa code review.
Sukatin ang paghahatid sa totoong kapaligiran bago mag-angkin ng pagpapabuti.
Mga tala ng pinagmulan, hindi hiniram na katiyakan.
Batayan ng pagpaplano: web.dev responsive-image guidance and MDN File API documentation
- web.dev — Responsive images ↗Ipinaliliwanag ng web.dev na maaaring malaki ang bilang ng bytes ng imahe at inilalarawan ang responsive candidates, srcset, sizes, at picture para sa angkop na mga kaso ng paggamit.
- MDN — Using files from web applications ↗Dinodokumento ng MDN ang mga user-selected File objects at ang lokal na magagamit na pangalan, type, at laki na metadata.
May-akda: Editoryal na draft ng SIU Enablement; gabay sa pagpapatakbo na nakabatay sa pinagmulan. Sinuri ni: Sini-review ng mga may-ari ng disenyo, accessibility, performance, at rights ang mga imahe sa kanilang konteksto ng paghahatid. Muling beripikahin: Muling beripikahin kapag nagbago ang paglalagay, mga patakaran ng responsive, pinagmumulan ng asset, o provider ng paghahatid.