タグ ‘ホームページ制作’ の一覧
ホームページ制作者がheadタグの間でチェックしてしまう10のポイント
2009年 10月 2日 (金) / PM 2:13
ホームページ制作の仕事をしていると気になったページはソースコードを見てしまいます。
これって職業病でしょうね。
HTMLソースの上部にあるheadタグの間の記述内容を見て制作スキルをある程度判断している10のポイントを公開します。
基本的な記述
有って当たり前だけど、細かい部分にまで気を使っているサイトは素敵。
1. ページのタイトル
<title>***</title>
検索結果で目立つように表示されるのでSEO対策的にも費用対効果が高い項目。
30文字以内でページの内容とサイト名が分かるものがベストですよ。
これが無いと論外ですね。
2. ページに関連するキーワードと紹介文
<meta name="keywords" content="キーワード" /> <meta name="description" content="紹介文" />
本来はSEO的に重要視されるはずなのですが、悪用したSEOスパムが増えたため最近は信用度低下。
それでも無いよりは有った方が良いものです。
そのページのキーワードと紹介文なのでページ内容にあった記述内容にするべきなのですが、実際にページ毎に変更するとなると非常に大変な作業です。
見つけると「勉強されてますね」と思わせる記述
数年前には無かった情報が当たり前になってしまう業界ですから。
3. GoogleWebマスターツールの認証用メタタグ
<meta name="verify-v1" content="***" />
Googleに対してサイトの管理者である事を認証するタグ。
認証用の専用HTMLファイルをアップロードする方法もあるので注意。
サイトのGoogle検索に関する様々な情報を取得することが出来るので、少しでもSEO対策を考えるのであれば登録を推奨します。
4. Yahoo! Site Explorer の認証用メタタグ
<meta name="y_key" content="***" />
Yahoo!Japanに対してサイトの管理者である事を認証するタグ。
認証用の専用HTMLファイルをアップロードする方法もあるので注意。
サイトのYahoo!Japan検索に関する様々な情報を取得することが出来るので、少しでもSEO対策を考えるのであれば登録を推奨します。
5. Favicon(ファビコン)の指定
<link rel="shortcut icon" href="http://***/favicon.ico" type="image/vnd.microsoft.icon" /> <link rel="icon" href="http://***/favicon.ico" type="image/vnd.microsoft.icon" />
ブックマーク(お気に入り)リストやウィンドウアイコン・タブなどに表示される独自のアイコンの指定。
6. モバイルサイトの指定
<link rel="alternate" media="handheld" href="http://モバイルサイトのURL" />
この記述があると検索からパソコン用のサイトにたどり着いた時にモバイル用サイトを表示してくれるので便利。
見つけると「無駄なのに」と思わせる記述
数年前には当たり前だった情報が無意味になってしまう業界ですから。
7. ロボット型検索エンジンへの無駄な登録指定
<meta name="robots" content="index,follow">
検索エンジンに対して「このページもリンク先のページも検索結果に反映して下さい」とお願いしているのですが、無くても全く同じなので無駄です。
8. 使用しているエディタの表示
<META name="GENERATOR" content="IBM WebSphere Studio Homepage Builder Version 12.0.0.0 for Windows">
Windowsのパソコンでホームページビルダーのバージョン12を使って作りましたよと教える必要は無いと思いますよ。
比較的ホームページビルダーを利用している方に初心者の方が多いため、見つけると思わず初心者の方が作ったページだろうなと思ってしまいます。
ちなみに私が最初に作ったWebサイトで記述するとしたら下記になります。
<meta name="generator" content="SEGA Dream Passport Version 1.0 for Dreamcast" />
見つけると「お疲れ様です!」と思わせる記述
人間ですから疲れます。
9. IE8のレンダリングモード指定
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
この記述だとIE7としてページを描画します。
IE8以前に制作されたページで「IE8で見たら崩れる、何とかしろ!」と言われた時にやる気無く作業した結果。
10. 内部スタイルシートに.style1
<style type="text/css">
<!--
.style1 { *** }
-->
</style>
Adobe Dreamweaverで急いで作っちゃったスタイルシートに良くある記述。
完成したはずのページで「ここの文字色を赤にして!」と言われた時にやる気無く作業した結果。
番外編
世の中には分かる人にしか分からない事もあります。
面白いコメントタグ
<!-- どうもソースを見ていただきありがとうございます。 使えそうな部分がありましたら、どうぞお持ち帰りください! 問題がある部分を見つけましたら、お手数ですがご連絡くださいませ。 https://www.kayac.com/contact/ -->
面白法人カヤックさんのページに記載されているコメントタグ。
このセンスが好きだなぁ。
ホームページは誰のためのもの
2009年 7月 28日 (火) / PM 11:22
個人のBlogであれば、それはその本人のためのものですが、企業サイトの場合はどうなんでしょうか?
企業サイトの最終的な目的はその企業の売上・利益となるはずなので「企業のため」と思われがちです。
それも間違いではないと思うのですが、最も優先されるべきは「利用者のため」だと思います。
よくありがちなミスケースとしては「自社のサービスだから」と企業向けサービスと個人向けサービスがごちゃ混ぜになっている企業ページ。
酷いのになるとトップページに土木建築系と飲食系が一緒に表示されていたり・・・
客観的に考えればそんな雰囲気の飲食店が「美味しそう」と思われる事は絶対に無いと思うんですがねぇ。
【教訓】
ホームページはそのサービスを利用するお客様が気持ちよく情報収集できる事を最優先して考えよう。
ペルソナマーケティングまでやれればベストですよ。
ホームページのデータは整理できてますか?
2009年 7月 25日 (土) / PM 11:27
時々、別のホームページ制作会社さんが作られたページの管理を委託されるケースがあるのですが、FTPで接続してサーバー内にあるデータを見ると混沌として手がつけられない事が多いです。
test~.htmとか明らかに使ってないと分かるデータは良いのですが、殆どは使っているのかどうか一見では分からない場合が殆ど。
なかには.exeとか名簿.xlsとか「おいおい」と突っ込みたくなるデータを見たこともあります。
「専門家なんだから常に整理しているのがあたりまえ」と思わないでください。
ホームページには表に見えるページ以外にもCGIやPHPと呼ばれるプログラムもあり、下手に消してしまうとページが見れなくなったり動かなくなったりと管理は大変なんです。
と言う事で個人的に注意しているポイントは以下の3つ
- 最初に画像やプログラムなど分類別にフォルダを分ける
- デモや確認用で制作したページは不要になったら確実に削除
- どうしても残しておかないといけないファイルにはコメントタグやメモ用ファイルなどに必要な情報を記述しておく
一人で制作していても数ヶ月前に作ったデータの内容を100%覚えているわけは無く、HTMLコーディングやプログラム制作、コンテンツ管理など複数で制作している場合は特にカオスですから。
WordPressのテーマを製作中
2009年 7月 23日 (木) / PM 11:00
お仕事で既存サイトにWordPressでブログ機能を埋め込む作業を進行中。
ある程度見れるレベルには作れますが、コメント入力のエラーやら複数記事の表示、画像埋め込み時のレイアウト処理などなど、じみーな調整作業に苦労しています。
まだまだWordPressの全体構成を把握できてないなぁっと感じます。
その意味でこの「WordPressテーマを作るためのWordPressテーマ」って便利かなとおもって一応メモ。
ホームページ制作で大切なたった一つの事。
2009年 6月 29日 (月) / PM 11:49
“誰” に “何” を伝えるためのホームページですか?
単純だけど、これが一番重要だなぁっと思うこの頃。
ゴールが見えないわけですから、SEO対策にしてもユーザビリティ検証にしてもウェブデザインにしても、これがぼやけていると駄目ですね。
逆にこれがしっかりと決まっているプロジェクトの場合は大体ホームページ制作の効果が出てきますし、効果的な手段は幾らでもあるはずです。