移行中の知識
ピクセル
Pixel
定義
ピクセル（pixel）とは、raster imageを構成する離散的なsample単位です。画像file上のpixelとdisplayの物理的なdevice pixel、CSS layout上のCSS pixelは同じ「px」という語で接する場面がありますが、役割が異なるため区別して考えます。
実例
実際の場面で考える
同じ概念を異なる制作文脈へ持ち込み、何を観察して判断するかを見る。
Web image optimization
1200×800画像のdata量を見る
見るポイント
画像の見た目のcmやinchではなく、幅1200・高さ800というpixel dimensionsがsource dataの基本的な量を決めていると理解する。
High-DPI display
Retina表示で画像がぼやける
見るポイント
CSS上では同じ300px幅でもdevice側ではより多いphysical pixelへ描画される場合があり、source imageのpixel数が足りるか確認する。
注意
誤解しやすい点
- image pixel、device pixel、CSS pixelを常に同じ物理的な点として扱う。
- pixelが小さいほど画像品質が高いと単独で評価する。
- pixelという単位だけでphysical sizeが決まると考える。
関連
関連する概念
出典