中堅デザイナーのおさらい

グラフィックデザイナー8年目。 しかし、会社に未来を見いだせず転職を決意。 転職先は気合いの入った広告代理店。 小さな制作会社で汚染された自分のデザインに不安を覚え、もう一度勉強しなおそうと決意!

    --.--.--(--) --:--

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
    2011.06.07(Tue) 16:58

作ったHPをチェック・採点しよう

2343395804_4653459a1e.jpg
by blakespot

俺はグラフィックデザイナーだが、現在の会社ではWEB制作も任されている。
だが、グラフィックデザイナーがコーディングまでを完璧にこなすのは、はなかなか難しい話しだ。

今回受けた仕事でも、古いブラウザでcssが機能しないというバグが起きた。
かなり古いブラウザだったので無視したいところだったが、なるべく多くのブラウザに対応出来るWEBページを作りたいと思い、恩師の坂本さんという別会社のWEBマスターにスカイプで質問をした。

その際に教わったノウハウの一部を書きたいと思う。



バグの原因とは、タグの使い方、推奨されていない運用方法、ドキュメントタイプによっての互換性、文字コードの指定、cssの指定方法など、無限に考えられるのだ。

タグをひとつひとつ見ながら人間の目でミスを探し出そうとするのは不可能に近い。
それを解決してくれるのが、今回坂本さんに教えて頂いたAnother HTML-lint gatewayというサイトだ!!

ここにある、入力フォームに自分のHPのURLを入力、もしくはHTML文書を入力し、チェックボタンを押すと▼

チェックの結果は以下のとおりです。

http://◯◯◯◯◯◯.com/ を XHTML1.0 Transitional としてチェックしました。
◯◯◯個のエラーがありました。このHTMLは -◯◯点です。タグが ◯◯種類 ◯◯◯組使われています。文字コードは UTF-8 のようです。

先頭の数字はエラーのおおまかな重要度を 0~9 で示しています(減点数ではありません)。少ない数字は軽く、9 になるほど致命的です。


といったように、URLドキュメントタイプエラー数点数タグの種類タグの数文字コードが表示される。
エラー数は少なく、点数は100点に近いほど優良なHTML文書と言える。

その下に、重要度エラー箇所エラー内容解説リンクが一覧表示される。
一覧表示の下には、HTML文書も行数付きで表示されるので分かりやすい。

解説リンクは正直俺には難し過ぎてかどうか分からんが、理解しずらかった。
エラー内容をgoogle検索した方が解決しやすかった。



新しいブラウザはある程度のエラーなどは、なるべく補正して表示出来るようになっているようだが、ユーザーが必ずしもそういった環境で観覧しているとは限らないので、新しいブラウザに頼る事なく自分で出来るところまでエラーの少ないHTML文書にしておきたいものだ。

« 書体・フォント・タイポグラフィを区別する|Top|ふと気になった言葉の由来 »

コメント:

コメントの投稿

管理者にだけ表示を許可する

トラックバック:

http://osarai2011.blog.fc2.com/tb.php/11-9000f0ea

Top

ホーム

MdN

Webデザインに優れたサイトのリンク集

DotsDomino


グラフィックデザイン

09 | 2017/10 | 11
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31 - - - -

ビリー

Author:ビリー
ビリーです。
めちゃ個人的なデザインのメモを書いていこうと思っています。

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。