HTMLやCSSの基本を学ぶ方に
1冊ですべて身につくHTML & CSSとWebデザイン入門講座［第2版］
Kindle版（電子書籍）／Mana／SBクリエイティブ
HTML・CSSの書き方からページのレイアウトまで学ぶ入門書です。
Amazonで見る ↗WEB FORM CHECK
ちょっとしたWEBフォームチェック
HTML本文を貼り付けて、form、input、textarea、select、button、label の構造を掲載前に確認する小さなツールです。
このツールはフォーム送信しません。セキュリティ診断ではありません。入力したHTMLはブラウザ内だけで処理し、サーバーへ送信・保存しません。
STEP 1
HTMLを貼り付ける
DOMParserでHTML構造だけを読み取ります。実際のフォーム送信、外部action先へのアクセス、CSRF/SQLインジェクション/XSSなどの判定は行いません。
STEP 2
確認結果
HTMLを貼り付けると、フォーム構造の目安を表示します。
form-
input-
textarea-
select-
button-
label-
autocompleteあり-
注意あり-
注意ありフォーム要素一覧
まだチェックしていません。
全フォーム要素一覧
| # | 種別 | name / id | type / method | 説明 | 注意 |
|---|---|---|---|---|---|
| HTMLを貼り付けると一覧を表示します。 | |||||
CHECK POINTS
確認できること
- form、input、textarea、select、button、labelの数
- form actionの空欄、method未指定、GET指定、外部URL風action
- input、textarea、selectにlabelが紐づいていない箇所
- placeholderだけで説明している入力欄、requiredなのに必須表示が見当たりにくい箇所
- buttonのtype未指定、submit buttonの複数配置
- email、tel、url風の項目がinput type="text"のままの箇所
- name / idが空の入力欄、hiddenが多いフォーム、autocompleteの有無の目安
ABOUT THIS TOOL
このツールについて
ちょっとしたWEBフォームチェックは、WEB掲載前チェック棚のフォーム構造確認枠です。貼り付けたHTML内の入力欄まわりを一覧化して、公開前に気づきやすい抜けを確認しやすくします。
実際のフォーム送信、外部action先へのアクセス、セキュリティ診断、個人情報の保存は行いません。完全なアクセシビリティ診断ではなく、掲載前の目安確認として使ってください。
WEB PRE-PUBLISH CHECK
WEB掲載前チェック
画像、ファイル名、URL、リンク、フォーム、alt文、見出し構造、headタグを、WEBに載せる前に軽く確認できます。入力内容や選択したファイルはサーバーへ送信・保存しません。
HTML・CSSの基本を学びたい方へ （PR）
HTML・CSSの仕組みや書き方を学ぶ参考書です。コードやデータを見直す際の読み物として。
購入前に、商品の状態・接続方式・配列などをご確認ください。リンク先の価格や在庫、出品者は変わることがあります。
WEBフォームチェックで気づいたことや、追加してほしい判定があればコメントで教えてください。
利用者コメント
まだコメントはありません。
コメントする
暴言、脅迫、個人への攻撃を含むコメントは公開しません。