第4回 (2022/11/16)

画像の種類

ベクター画像

画像や文字などの2次元情報を数値化して記録している形式のこと。 主に、アイコンや地図、平面的なイラストなどを作成するときにはベクター形式が採用されている。

<< 種類 >>

ai・pdf・svg

SVG

SVG（Scalable Vector Graphics)は画像フォーマットの一種。 画像ファイルであるが、XMLに準拠しており、テキストエディタで編集することも可能。

<< 例 >>

<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512">
  <circle cx="150" cy="200" r="100" fill="#06f"></circle>
</svg>

ラスター画像

画像をピクセルという点の集まりで表現する形式のこと。 主に写真などの画像を保存する形式に使われる。

<< 種類 >>

WebP・gif・jpg・png

WebP

画像の圧縮率が高く、表示速度の高速化に有利。

【参考資料】

ikel.co.jp

強調したい文章

em

文字をイタリック体（斜体）にして文章を強調する。

テキストにニュアンスを与えるタグ

strong ・mark・i・b

※strong / b / em / i を検索エンジンは同じように評価するので、基本的にはstrongを使っておけば問題ない。

<< 例 >>

<p>htmlでの<em>見出しタグ</em>の使い方の説明</p>

表

table

1つのテーブル全体を囲う。

thead

表の列の見出しを定義する行のセット。

tbody

表 (

) の本体部分を構成することを表す。

tr

table rowの略。 テーブルの行を表す。

th

table header cellの略。 ヘッダー（見出し）となるセル（1つ1つのマス目）を表す。

td

table data cellの略。その他（見出し以外）のセルを表す。

【参考資料】

developer.mozilla.org

宛先

addressタグ

その文書の連絡先や問い合わせ先を示すタグ。

<< 例 >>

<address>
    <p>カピバラランド湖のほとり 11-33-12 ファームカピぞう　宛て</p>
    <p><a href="080-xxx-xxxx">080-xxx-xxxx</a></p>
</address>

【参考資料】

developer.mozilla.org