ＷＥＢサイトの幅はもちろん、表示するモニターの解像度から割り出せます。
しかし、モニターといってもいろいろありますよね☆
う～ん。ほとんどの機種クリアしているワイドは、1024pxですかね☆
でもタブレット系で、ワイド800ｐｘがチラホラあったんで、
公共性の高いＷＥＢサイトはＷ800にこだわるべきかも。
それでは公共性の高いＷＥＢサイトの幅はどうでしょうか？
各サイトの幅はバラバラですが、基本は幅950ｐｘという感じですかね☆
できればデザイン的にはサイト幅を広く使いたいんで、
amazonさんのように980ｐｘがいてくれると、980ｐｘがＯＫという一つの指標になりますね。
一部のタブレット（Ｗ800ｐｘ）では、上記ほとんどのサイトが幅がはみ出てしまうけど、大丈夫なのか？
そこに合わせるメリットより、情報量が少なくなるデメリットの方が大きいということか？
とにかくまとめです。
WWWあり・なし＋/ (スラッシュあり・なし）＋index.html
- http://www.designwork-s.jp/
- http:/designwork-s.jp/
- http://www.designwork-s.jp
- http:/designwork-s.jp
- http://www.designwork-s.jp/index.html
- http:/designwork-s.jp/index.html
問題はURLが分散しているということ。
これではリンクやユーザーが見るページもバラバラになってしまいSEOに不利ですよね。
URLの中でどのURLに統一すればいいのか？
一昔前はYAHOO!さんがwwwあり表示だったので、wwwありが標準だったのですが、
現在は検索がGoogle化されているので、wwwなしでもOKです。
スラッシュはもちろんありで。うちの場合これになります。
いくつかURL統一の方法はあります。
Google ウェブマスターで設定する
これはウエブマスターツールに入れば、わかると思います。
簡単にWWWあり・なしを設定できます。
レンタルサーバーなどでhtaccessが使用可能であるならば、下記のように記述してアップロードすると、どちらかに統一することができる。
wwwありに統一
RewriteEngine on
RewriteCond %{HTTP_HOST} ^example\.com
RewriteRule (.*) http://www.example.com/$1 [R=301,L]wwwなしに統一
RewriteEngine on
RewriteCond %{HTTP_HOST} ^www\.example\.com
RewriteRule (.*) http://example.com/$1 [R=301,L]
http://www.designwork-s.jp/のページ（トップページ）のhead要素に、次のように記述する。
<link rel="canonical" href="http://www.designwork-s.jp/" />
参照：rel="canonical"属性について - ウェブマスター ツール ヘルプ
サイト作成ツール使用時のリンク指定の注意事項
たとえば、Dreamweaverやホームページビルダーなどを使って、このページからトップページへリンクを張ると
<a href="../index.html">トップページ</a>となる。これを、「index.html」を抜いて内部リンクを設定する。
<a href="../">トップページ</a>
]]>謝辞
今回の記事はこちらのサイトさんを見本にさせていただきました。
SEO塾 www有り無し、index.html有り無し、CMSなどのURL正規化を
三毳山の中腹にある「わんぱく広場」までは、南面入口から徒歩で20～30分。
面倒な場合は、フラワートレイン（有料）で上まで一気に行けちゃいます☆
遊具はかなり充実してます。
飛んだり跳ねたりする「フワフワドーム」や、
すり鉢状になっている「アリ地獄すべり台」
すべり台やジャングルジム等が一体になった遊具、etc。
ウチの子達は「フワフワドーム」にハマったみたいで、ずっと飛んでました(笑)
※以前なった売店は閉店してました。
飲み物とアイスの自動販売機くらいしかないので、お弁当持参がおすすめです。
]]>
Firefox 1.5 と Firefox 2.0 を共存させる
※なお、Firefox 共存の動作を保証はいたしません。予めご了承ください。
Step1.プロファイルのバックアップ
windows XPの場合、firefoxのプロファイルは、
C:\Documents and Settings\ユーザー名\Application Data\Mozilla\Firefox\Profiles\
上記にあると思います。万一の為に、バックアップを取りましょう。
※本作業中にFirefoxを起動してしまうと、Firefox のプロファイルが上書きされ、ダウングレードしなければならない場合があります。面倒です。。
Step２.Firefox8のダウンロード
mozillaよりFirefox８をダウンロードする。
※この時、アップデータを使用しない。
Step３．インストール
上記でダウンロードを、実行（インストール）する
インストール時の注意点
- 既存のFirefox と異なるフォルダにインストールする
- カスタマイズが終わるまでFirefox は絶対に起動しない
- カスタムインストールを使用する
- インストール先フォルダの設定を「firefixバージョン名」にする
Step４．新しいプロファイルの作成
4-1.タスクバーの[スタート]-[ファイル名を指定して実行]を選択し、"firefox -p" を入力して[OK]をクリック
4-2.ダイアログの左上の[新しいプロファイルを作成]をクリック
4-3.新しいプロファイルの名前に "Firefox+バージョン名" を入力して[完了]をクリック。
4-4.[今後このプロファイルを使用する]のチェックを外して[終了]をクリック
Step5．Firefox 2 のショートカット作成
リンク先例
"C:\Program Files\Mozilla Firefox8\firefox.exe" -p firefox8 -no-remote
※アプリへのリンクパスと「-p ここにプロファイル名 -no-remote」
これで設定は完了です☆
あとは同時起動ですが、毎回プロファイルを選択してブラウザを開く形になります。
その時注意として「今後はこのプロファイルを使う」にチェックはしないこと。
Firebug
これを入れないわけにはいきませんね。ディフォルトです☆
ColorZilla
制作中にこの色、#いくつだっけ？ってりますよね☆スポイトで調べてコピペできます。
MeasureIt
画面の中のサイズを測ります。線引をモニターに当てるよりずっと便利っす。
Pearl Crescent Page Saver Basic
スクリーンショット。フラッシュもキャプチャできますよ。
SearchPreview
yahoo!やGoogleの検索画面にサイトのプレビューを表示してくれます。