【UXデザイン第5段階: 表層】文字の大きさを指定する単位、pxピクセル編

これまでの回では、フォントについてを中心に「文字の形」についてのトピックを見てきました。今回からは「文字の大きさ」を指定する際の単位について見ていきましょう。

ホームページなどのWEBデザインにおいて、もしくはポスターなどの印刷物においても、見出しや本文などの各文字には大きさが指定されています。その際には「24px(ピクセル)」「18pt(ポイント)」「20Q(キュウ)」といった形で、いくつかの単位が使われています。今回はそのなかでも、ホームページなどのWEBデザインにおいて使われる単位「px(ピクセル)」についてご紹介します。

px – ピクセル

px(ピクセル)はおもにホームページなどのWEBサイトにおいて使用される単位です。かんたんな表現をすると、PCやスマートフォンのモニターは小さな点の集まりでできており、この「点」を基準として作られた単位がpx(ピクセル)です。たとえばモニターの画素数が1920×1080pxの場合は、横に1920個、縦に1080個の点が並んでいることになります。

このpxという単位は、「1px = 〇〇mm(ミリメートル)」と置き換えることはできません。これは、同じ画素数の画面であってもモニター自体のサイズが異なればpxの大きさが変わってしまうためです。

例：26インチ、1920×1080のモニター　→　1px = 0.3mm

例：32インチ、1920×1080のモニター　→　1px = 0.4mm

今回はWEBデザインで使用される単位、px(ピクセル)についてご紹介しました。このpxは文字のサイズのほかにも、画像の幅や、ページのそのものの幅を表現する際にも使用される単位で、ホームページ制作をするうえで基本となる単位です。

次回はpxとは異なる単位についてご紹介します。

皆さまからのリクエストも募集しています。 Webサイトの構築に関わるこんな情報が知りたい！などご希望がありましたら、是非こちらからリクエストをお願いします！

一覧に戻る