<img src=”” alt=”” />
ホームページ制作(ウェブサイト制作)の際に使用する<img>タグについてのご説明です。
ホームページを制作する時<img>(イメージ)タグを使用することで、「埋込みイメージ」としてホームページ(ウェブサイト)内のページに画像を設置することができます。
<img> 埋込みイメージ、画像を表示

Image。イメージ。ウェブページ内に画像を表示します。ホームページ制作でよく使用するタグで、サーバーに画像をアップロード後、その画像のURLパスを元にこの<img>タグでページに画像を呼び出す形になっています。
<img>タグ使用の際には、画像ファイルがある場所へのパスと、画像が表示できない場合の代替テキストの指定(alt属性)は必須になっています。
src
ソース(情報源)。画像ファイルが置いてある場所を指定。
画像ファイルを指定(.gif .jpg .png)
src=”URL”
URL
画像ファイルのパスは、相対パス、絶対パスどちらでも指定可能です。
alt
代替テキスト。画像が表示できない場合の代わりのテキスト記述。オルト属性。
imgタグの必須項目。<h></h>(見出し)の間に画像を配置する場合は、確実に指定。
alt=””
読み方 オルト
width
画像の幅を指定
ピクセル、もしくはウインドウに対する%を指定
width=””
px %
height
画像の高さを指定
ピクセル、もしくはウインドウに対する%を指定
height=””
px %
align
テキストとの位置関係
align=””
top middle bottom left right
align=”top”
画像とテキストが上揃え
align=”middle”
画像とテキストが上下センター揃え
align=”bottom”
画像とテキストが下揃え
align=”left”
画像が左端、その右にテキストが回り込む
align=”right”
画像が右端、その左にテキストが回り込む
border
境界線。画像の周りの線
無指定の場合は原則、画像周りの境界線は表示されないが、リンクの指定などで境界線が表示されてしまう場合は、cssなどでimg aのボーダーを0に指定する。
border=””
hspace
画像の左右余白
hspace=””
vspace
画像の上下余白
vspace=””
hspace,vspace 代替CSS
margin系
usemap
srcで指定した画像ファイルに適用するマップ設定の名称を指定
指定する名称は<map name=””>と同様の属性値
usemap=”#”
decoding
- auto
- async
- sync
loading
- auto
- lazy
- eager
読み方 イメージ
画像の非同期デコードと遅延読み込み
画像の非同期デコード decoding=”async”で、画像を読み込む時に他のコンテンツの読み込みを妨げることを防ぐことができます。また、loading=”lazy”で、画像の遅延読み込みを実装できます。これらにより、ページのファーストビュー(画面内に表示される領域)速度を向上させることができます。
画像の非同期デコード「decoding=”async”」と遅延読み込み「loading=”lazy”」
alt属性とSEO

画像の代替テキストを指定するalt属性は、<img>タグにおいて必須指定項目です。かつ、SEOの基本になります。alt属性は画像が表示できない場合の代替テキストを指定しますが、同時に画像がどのようなキーワードにマッチした画像なのかを示す属性のため、ページのテーマに沿った画像が設置されていることを検索エンジンに示す属性になります。ウェブサイト、ページの検索エンジン最適化の必須項目と言えるでしょう。
<img src=”” alt=”” />
ホームページ(ウェブサイト)制作・作成に役立つHTMLタグ一覧は
⇒html5 tag reference index ホームページ制作の基本タグ
ホームページ制作・SEOの1ポイント

ホームページ制作で、テキストの次に重要なコンテンツはおそらく画像でしょう。ただし画像の設置はSEOにもプラスに働くものの、サーバー負荷が増えたり、alt無指定などのSEOの省略をしてしまいがちな項目です。逆に言えば、画像を軽量化したり、きちんとalt属性やキャプションを設定することで、SEOにプラスに働きます。画像を差し替えたときなどはalt設定を忘れがちですが、SEOを考えるのであれば、ページのSEOスコアや画像検索対策のためにもしっかりと設定を確認する必要があります。
ホームページ(ウェブサイト)のHTML編集方法
ホームページのHTML編集方法について。ホームページ(ウェブサイト)は基本的にHTMLで構成されています。かつてはHTML単独でHTMLの文書スタイルを設定していましたが、現代ではページの基本構成はHTMLで、外観はスタイルシート・CSSで設定されています。ホームページ制作・作成、ホームページ修正の基本はこのHTMLとCSSの編集で行います。
ホームページ制作実績
新規ホームページ制作・カスタマイズ実績のある業種・エリアや、ホームページ制作事例・サイトカスタマイズ事例などホームページ制作実績のご紹介。企業の公式ホームページをはじめ、各種ホームページ制作(ホームページ作成)に対応しています。
ホームページ制作実績
ホームページの更新・修正
ホームページのページ更新やページ追加、文章や価格の修正、リンクの修正をはじめ、ホームページ内部の様々な箇所の修正など、各種ホームページの更新・ホームページの修正の代行に対応しております。 ホームページの更新や修正にかかる単発のご依頼で対応させていただいておりますので、軽微な修正でもお気軽にご相談ください。スマホ対応化やSSL化、ホームページのエラー修正・エラー復旧にも対応しております。
ホームページの更新・修正料金 価格表







