今までサイト作成時にあまり気にしていなかった文字コードですが、YAHOO!をはじめGoogleやMSN、livedoorなど大手検索サイトがほとんどutf-8を用いていたので、それに倣ってshift_jisから変換してみた。 注意点など。 ・htmlファイルヘッダーに書くutf-8文字…

SEOを考えたサイト制作初期にやるべきこととしてwwwあり・なし統一、index.htmlあり・なし統一があります。今まで某サーバーにてドメイン直下に.htaccessファイルを入れてRewriteEngine on RewriteBase / RewriteCond %{THE_REQUEST} ^.*/index.html Rewrite…

CSSファイルでhtml{overflow-x:hidden;}と一行書き加えます。これで横スクロールバーは消えます。 しかし問題も。ウィンドウサイズを細くしたときも横スクロールバーが出てこないので、サイトをスクロールして見ることができなくなります。IE6なんてもうほと…

ＨＰ作りに欠かせない配色の設定。 背景やborderなどサイトの雰囲気を左右します。以下は色見本のサイト。http://www.finitojapan.com/cltable.htmlhttp://color.uic.jp/http://www.colordic.org/http://www.colordic.org/blend.php

検索ロボットに特定のページを閲覧されないようにorさせるように指示する。 ルートフォルダ（ドメイン直下）にrobots.txtという名前のファイルを作る。ファイル記述法は User-agent: * Disallow:url User-agent: *は全てのUser Agentに対してという意味。特…

class="robots-nocontent"というクラス要素を指定することでクローラーにその部分を無視させられる。ヘッダーやメニュー部分でのキーワード調整などに有効。

contentの幅、高さがディスプレイの大きさ以下で固定されているときなどに使える。 (body) (div id="contents") (/div) (/body) の場合、CSSファイルに #contents { width: 920px; height: 580px; position: absolute; top: 50%; left: 50%; margin: -310px …

http://htmllint.itc.keio.ac.jp/htmllint/htmllint.html

①見出し hx ②段落 p ③リスト li ④強調 strong 同一段落（p要素内）でキーワードを重複させない。

(dl) (dt)定義1(/dt) (dd)解説1(/dd) (dt)定義2(/dt) (dd)解説2(/dd) (/dl) 定義1 解説1 定義2 解説2 (dl conpact="conpact") (dt)定義1(/dt) (dd)解説1(/dd) (dt)定義2(/dt) (dd)解説2(/dd) (/dl) 定義1 解説1 定義2 解説2

(ul) (li)こめ(/li) (li)さけ(/li) (li)みそ(/li) (/ul) ・こめ ・さけ ・みそ (ol) (li)こめ(/li) (li)さけ(/li) (li)みそ(/li) (ol) 1. こめ 2. さけ 3. みそ

http://www.finitojapan.com/cltable.html

http://e-words.jp/p/r-htmlentity.html

簡単バナー Version2.0 http://www.netwalker.ne.jp/~punpun/kbanner/help/

bodyのセンタリング。左右の余白幅を同じにする方法。モダンブラウザではスタイルシートに body{ margin-left:auto; margin-right:auto; } と書けばよい。が、これは古いIEや互換モードでは読み込めないので左詰めで表示されてしまう。古いIEや互換モードで…

タイトル 最重要。 （記事タイトル） （カテゴリ） （サイト名） のように書く。 meta name="description" content="（80字程度の文章）" Yahooでは表示されない。googleでは表示されるが、敢えて何も書かずに検索結果にマッチした箇所をロボットに自動で表…

お気に入りに登録（ブックマーク）したときに表示されるアイコンタグにと書く。type="image/vnd.microsoft.icon"は.ico形式の指定。 image/gifやimage/pngでもよいが、 IEでは.icoしか対応していない。 ファビコン作成は http://www.favicon.jp/ でできる。…

メインカラムとサイドカラムの高さを揃える方法。 ex) #container { width:340px; height:auto; overflow:hidden; } #container .main { float:left; width:160px; padding-bottom: 30000px; margin-bottom: -30000px; } #container .side { float:right; wi…

余白marginは外余白、paddingは内余白の指定。#{ margin:0px 0px 0px 0px; padding:0px 0px 0px 0px; }で上、右、下、左の順に指定できる。margin-topなど個別指定も可。 right,-bottom,-leftなど。 marginはマイナスの数も指定可。 枠線#{ border-style:sol…

リンクまわりの指定A:link { color: #0000ff; } 未訪問 A:visited { color: #0000ff; } 訪問済 A:hover { color: #ff0000; } onカーソル で全体の指定ができる。順番はこの順でないとうまく機能しない。 全体指定をすると、各classやidで指定したものが反映…

タグ内に ファイル名.css内 {margin:0;padding:0;} 各ブラウザでの基準合わせ body{} body指定 .xxx class指定 #xxx id指定

ページの共通部分の外部化。 ヘッダー、フッター、ナビゲーション（メニュー、コンテンツ）部などに適用。ssi専用フォルダを作る。 深い階層に→相対パスで指定。 (!--#include file="ファイル名"--) 浅い階層に→絶対パスで指定。 (!--#INCLUDE VIRTUAL="ファ…

をタグに入れる。 指定したURLがそのページの正規のページだとrobotに伝える。 特にindex.htmlなどを./に正規化するときに使う。 リンクジュースの操作にも。