HTMLやCSSの基本を学ぶ方に
1冊ですべて身につくHTML & CSSとWebデザイン入門講座［第2版］
Kindle版（電子書籍）／Mana／SBクリエイティブ
HTML・CSSの書き方からページのレイアウトまで学ぶ入門書です。
Amazonで見る ↗WEB IMAGE CHECK
ちょっとしたWEB画像診断
WEBに画像を載せる前に、用途別の目安と手元画像のサイズ・容量・比率をブラウザ内で比べるための確認ツールです。
画像はブラウザ内で確認します。サーバーへ送信・保存しません。表示する推奨値は一般的なWEB掲載用の目安です。サイトのデザインや掲載場所によって適切なサイズは変わります。
STEP 1
用途と画像を選ぶ
Hero / トップ画像
- 推奨幅
- 幅 1600〜1920px
- 比率
- 16:9〜横長
- 容量
- 300〜900KB目安
- 形式
- JPG/WebP向き
画像は診断結果エリア内の「画像を選択」ボタン、またはドラッグ&ドロップで投入できます。JPG / PNG / WebP を中心に、ブラウザが読み込める画像を1枚だけ確認します。HEICなどはブラウザによって読み取れない場合があります。
STEP 2
診断結果
画像をここにドラッグするか、画像を選択してください。
サイズ・容量・比率をブラウザ内で確認します。
画像はサーバーへ送信・保存されません。
まだ画像は選択されていません。
- ファイル名
- -
- 形式
- -
- 容量
- -
- 幅
- -
- 高さ
- -
- 縦横比
- -
- 総ピクセル数
- -
- 用途との相性
- -
HOW TO USE
使い方
- 画像を載せたい場所に近い用途プリセットを選びます。
- 手元の画像を1枚選びます。
- 容量、幅、高さ、比率、総ピクセル数、用途との相性を確認します。
- 寸法を変えたい場合は、関連ツールの画像サイズ変更へ進んでください。
ABOUT THIS TOOL
このツールについて
ちょっとしたWEB画像診断は、画像をWEBページへ載せる前の確認用ツールです。画像を編集したり、圧縮したり、形式変換したりするものではありません。
診断結果は一般的なWEB掲載向けの目安です。実際に適したサイズは、サイトのレイアウト、表示領域、画像の内容、運用方針によって変わります。
WEB PRE-PUBLISH CHECK
WEB掲載前チェック
画像、ファイル名、URL、alt文、見出し構造、headタグを、WEBに載せる前に軽く確認できます。入力内容や選択したファイルはサーバーへ送信・保存しません。
HTML・CSSの基本を学びたい方へ （PR）
HTML・CSSの仕組みや書き方を学ぶ参考書です。コードやデータを見直す際の読み物として。
購入前に、商品の内容・仕様・状態をご確認ください。リンク先の価格や在庫、出品者は変わることがあります。
診断結果の見え方や、追加してほしい用途があればコメントで教えてください。
利用者の評価・コメント
0件の投稿
まだ評価・コメントはありません。
評価・コメントを投稿する
星だけでも送信できます。コメントを書く場合は3〜1000文字で入力してください。
暴言、脅迫、個人への攻撃を含むコメントは公開しません。
診断コメント