HTMLの最近のブログ記事

IEで互換表示させない

| コメント(0)
弊社でも何度か問題になったことのあるIEの互換表示。
IE10あたりからは簡単に設定できなくなったため「誤クリックで設定してしまった」という状況は少なくなっていますが、それでも一度問題になったことがあったのでこのタグを入れておくと良さそうです。

<meta http-equiv="X-UA-Compatible" content="IE=edge"/>


<head>内の外部ファイル読み込みよりも前に入れます。

それぞれのIEの標準モードで表示されます。
130115_oshi.gif

上記のように、
大枠(contents)にピッタリになるようにfloatを使って要素を並べたとき、
その内部の最後の要素が落ちてしまうバグの対処法です。

※テキストだと複製され、その分が落ちるようです。
 今回は画像だったためか落ちただけでした。

■余白を作る
上記の場合、contentsの横幅を少し大きく作ると(内部要素1つにつき1px?)
解消されるようです。

■コメントを入れる
余白が作れない場合、最後の要素(3つ目のblock)の後に適当な
コメントを入れると解消されます。
コメントなのでバグで複製されてしまっても見えません。


ページを右クリック禁止にする

| コメント(0)
めったに使うようなものではないと思いますが、
実装の方法が少し思いがけないものだったのでメモ。

ページでの右クリックを禁止にしたい場合は次のように記述します。

<body>
 ↓
<body oncontextmenu='return false'>

これだけ。
CSSに記述するか、JSを使うかと思っていたので意外でした。

文字コード

| コメント(0)
通常
Shift_JIS / CR+LF

多言語
UTF-8 / CR+LF
HTMLファイルがどの文字コードで書かれているか宣言する。
titleタグなどの日本語を書く前に明示しないと、文字化けする場合がある。

■Shift_JIS
別名、SJIS。マイクロソフトが制定した文字コードで、Windows95やMacの文字コードとして採用されていた。
MTなどCMSツールも採用しているコード。

■EUC-JP
日本語版UNIXで採用されている文字コード。
MySQLなど、データベースがからむシステムでよく使われている。

■UTF-8
ユニコード・コンソーシアムが制定した文字コードで、全世界の文字を一つのキャラクターセットで表示できる仕様。
1ページ内に日本語と韓国語、中国語など混在させることが可能だが、文字データの量は他のコードに比べて多くなる。
WebサービスAPIを利用する祭によく使われる。

画像のalt指定について

| コメント(0)
画像タイトル等の文言は、文字数制限なしで使用されている文章をそのまま記述する。
文言のない画像等は、どんな画像か分かるように短い説明や単語を入れる。
何も入れなくていい場合は、空(alt="")で挿入。

meta について

| コメント(0)
■meta content
<meta http-equiv="content-type" content="text/html; charset=shift_jis" />
<meta http-equiv="content-style-type" content="text/css; charset=shift_jis" />
<meta http-equiv="content-script-type" content="text/javascript" />
■meta description
<meta name="description" content="○○○○○○○○○○" />

ページについての説明を書く。各ページにそれぞれ説明を入れる。
あまり長くなりすぎないようにする。
検索結果に表示されるホームページ内容の要約として表示されることがある。
検索結果を見た人に内容が伝わるように書きく。

■meta keyword
<meta name="keywords" content="○○,○○,○○" />

カンマ区切りでキーワードとなる単語をいれる。

各ページにそれぞれのキーワードを入れる。キーワードの数は10個以内くらい。

多過ぎたりまったく関係ないキーワードを羅列っするとスパムと判断されてしまう。


title について

| コメント(0)
ページ名 | 会社名(サイト名)

基本的には上記の用にする。
指定がある場合はそれに従う。

DOCTYPE宣言

| コメント(0)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

宣言文では、HTMLまたはXHTMLのバージョンと文書型を宣言する必要がある。

■HTML/XHTMLのバージョン
最新のバージョンはXHTML1.1だが、このバージョンは、ファイルのメディアタイプ指定を「application/xhtml+xml」にしないとXML文書として認識されない。しかしこの指定は、IEで対応していないためXHTML1.0を使用する。

■文書型

下記2種類がある。
Strict ..... そのバージョンのHTML文書に厳密。
Transitional ..... 一部非推奨の要素も使っている。
どちらを使ってもブラウザ上では何の問題も起きない。

このアーカイブについて

このページには、過去に書かれたブログ記事のうちHTMLカテゴリに属しているものが含まれています。

前のカテゴリはCSSです。

次のカテゴリは確認です。

最近のコンテンツはインデックスページで見られます。過去に書かれたものはアーカイブのページで見られます。