Web

Webページを検証する各種サービス

投稿日:

1. はじめに

Webページに問題がないかチェックすることができるサービスをいくつか紹介します。

2. Webページを検証するサービス

(1) HTMLを検証する

Ready to check – Nu Html Checker

Nu Html Checker

Check by address」という部分の下に URL を入力して [Check] ボタンを押すと、検査が始まります。

(2) CSSを検証する

W3C CSS 検証サービス

CSS Validation Service
CSS Validation Service

アドレス」に URL を入力して [検証する] ボタンを押すと、検査が始まります。

オプションは、分からなければそのままで良いですが、[Profile] の選択項目によってエラーになる内容に違いがあるので、少し注意しておくとよいです。

(3) アクセシビリティを検証する

WAVE Web Accessibility Evaluation Tool

WAVE Web Accessibility Evaluation Tool
WAVE Web Accessibility Evaluation Tool

Web page address のところに URL を入力して Enter キーを押すか、右側にある矢印をクリックします。

(4) Web Vitals (ページの読み込みパフォーマンス) を検証する

PageSpeed Insights

PageSpeed Insights
PageSpeed Insights

中央のフィールドに URL を入力して、[分析] ボタンを押します。

3. おわりに

各サービスの結果を理解するには知識と経験が必要ですが、まずは使ってみないと始まらないとも言えます。

「検証する」→「結果の中に分からない用語があれば調べる」を繰り返しましょう。

または、以下のサービスからご質問も受け付けております。

HTML/CSS/JS/PHPの質問をお受けします Webに関して疑問をお持ちのあなたへ

📂-Web

執筆者:labo


comment

メールアドレスが公開されることはありません。

関連記事

Google App Engine

Google App Engine にデプロイしてあるファイルをダウンロードする

Google App Engine にデプロイしてあるファイルをダウンロードする方法について説明します。

WordPress

「Build a Custom WordPress User Flow」を試してみました

目次1. はじめにソースコード2. 全体3. Part 1: Replace the Login Page使用している関数アクションフィルタ4. Part 2: New User Registrati …

DokuWiki

DokuWiki のアクセス設定チェックが面白い

目次1. It seems your data directory is not properly secured.2. 対応方法3. 珍しいアクセスチェックの仕組み4. おわりに 1. It see …

Web Vitals

Chrome UX Report API を使う手順 (cURL の場合)

Chrome UX Report API を使う手順 (cURL の場合)を紹介します。

Chrome

Chrome の通信ログ(TCP/IPも含む)を記録する

Chrome の通信ログ(TCP/IPも含む)を記録する方法を紹介します。