frontendmemo

このサイトは、「html、css、js、ツールなどについて、自分が覚えたこと、またはいつも忘れて調べることを書き溜め、それが結果といて勉強したての初心者の方や自分と同じような技術レベルの人の助けになることを目的とするWebログ」、略してブログです。挨拶→http://frontendmemo.hatenablog.com/entry/2016/06/25/115845

【html】実装ページを量産する時にする7つの自己チェック

スポンサードリンク

Webサイトは、ページ数が多ければ多いほど元となるテンプレートページを量産していく作業があります。

量産については、いかに効率よく、間違いやミスなくページを作れるかがカギとなりますので、その際必ずやっておくべき、自己チェックを挙げていきたいと思います。

validator

バリデートエラーのチェックでタグの閉じ間違えやミスがないかのチェックをします。
またそれ以外にも不明なエラーがあれば設計者に連絡をとりましょう。

ぱんクズ

ページがあちこちするとぱんクズの修正が手間になります。また、コンテンツとヘッダーの境界にあるため、意外と忘れられがちです。笑
チェック項目に入れておくと忘れずに修正することができます。

テキスト

原稿を流し込むにあたって要なのがテキスト比較ですね。コピーして検索していくのは効率的でないので、比較ツールのWinmergeなどを使用するといいでしょう。
WinMerge 日本語版

アンカーリンク、リンク

リンクのチェックは、Firefoxで「情報」→「リンクのパスを表示」でパスが表示されます。

画像、alt

altのチェックは、Firefoxで「画像」→「altの属性値を表示」でaltが表示されます。

JSなどの動き

量産ページにJsが含まれているものは、ちゃんと動いてるかの挙動を確認しましょう。

崩れ、スマホ

モジュールやコンポーネントを組み合わせた時、テキスト量が増えた時など設計者が意図ししていない崩れが発生する可能性があります。
その為に、レスポンシブデザインであれば、タブレットやスマホのwindowサイズでも崩れがないかチェックすると良いです。

まとめ

以上、実装ページを量産する時にする7つの自己チェックでした。

効率よく、ミスのないページ作りを心がけましょう。