2点目のMIMEタイプはHTMLのヘッダーで
が指定されていて、<meta http-equiv="ContentType" Content="application/xhtml+xml">
というケース。DIVタグでbackgroundプロパティを指定したい
ただ、tdタグでの背景色指定はi-HTMLバージョンが6.0以上、i-XHTMLで2.0以上という条件に対し、
<?xml version="1.0" encoding="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=Shift_JIS" />
<title>テスト</title>
</head>
<body>
<div>aaa</div>
</body>
</html>
 | |
 質問なんですがいつも参考にさせていただいております。 質問なのですが、ドコモでCSSとSSIを使いたいと思っております。 SSIを使うために.htaccessにAddType php5-script htmlと AddType application/xhtml+xml .htmlを記述すると、 片方しか適用されません。（順番を替えることでどちらか片方だけ認識） そこで、.htaccessをAddType php5-script htmlだけにして head内に<meta http-equiv="ContentType" Content="application/xhtml+xml">と記述しても CSSが使えません。 SSIとCSSは両立できないのでしょうか？ head内に <meta http-equiv="ContentType" Content="application/xhtml+xml"> を記述しても しん | URL | 2009/11/01/Sun 13:30 [EDIT] はじめまして。かなり勉強になりました！ 失礼ですが質問です！ 私はキノコロウデコメというサイトを運営しているのですが、div要素で背景を区切りたくてやってはみたのですがうまく表示されません。 こちらで紹介しているとおりにしてみようと思いましたがキノコロウデコメは拡張子がphpです。 phpでこの手法を取り入れられないでしょうか？ キノコロウデコメはhttp://kinodeco.pupu.jp/です。 よろしくお願いします！ てつや | URL | 2009/04/24/Fri 17:02 [EDIT] ありがとうございましたshiba様 迅速かつ丁寧な回答ありがとうございました。 本当に助かりました。 おっしゃる通り、PCブラウザのことは考えずに、このまま 製作していこうと思います。 今後も携帯サイトの情報をご提供頂けることを楽しみにしています。 take | URL | 2008/11/24/Mon 09:38 [EDIT] Re : .htaccessファイルについてtakeさんこんばんわ。 携帯用にhtaccessを指定すると、拡張子HTMLに対し、 XHTMLのコンテンツMIMEタイプを出力するようになるため、 PCブラウザでは、閲覧できない場合があります。 サーバーにもよりますが、手元の環境で確認したところ、 IEではダウンロード状態（ただし、HTMLファイルを直アドレスで指定すると閲覧できる）、Firefoxではエラーとなるようです。 ただ、もちろんこれはPCブラウザに限ったことになりますので、 市場にある3Gに対応した携帯端末であればキャリアに関係なくおよそ閲覧できます。 クローラーに対してですが、決して今回のコンテンツMIMEタイプが 携帯に限ったようなイレギュラーな指定方法ではないので、 主要なクローラーは対応しているはずです。 このような指定方法をしている携帯サイトで 特殊な設定（IP、UA制限など）をしていない限り、 クローラーがはじかれたという話は聞いたことがありません。 実は今回指定するコンテンツMIMEタイプは、XHTMLにおいて、そのようなMIMEタイプを出力するようW3Cで推奨されているものです。 しかし、現在多くのPCブラウザが完全に対応していません。 ですから、PCブラウザをそれほど意識しなくてもよいのではないでしょうか。 また、Googleなどのクローラーにインデックスされるか不安がられる方も おられますが、あくまで携帯サイトが存在して、それを容易に検索するために 検索エンジンが存在しているわけですから、何でもかんでも検索エンジンのいいなりになる必要はなく、むしろ携帯サイトを含むWEBサイトの記述方法に対し、 検索エンジン側がそれらの仕様やお国事情（ローカライズ）に併せてカスタマイズしていくべきですから、何も難しく考えることなく、携帯サイトを作ればよいと思います。 shiba | URL | 2008/11/23/Sun 01:42 [EDIT] .htaccessファイルについてとても参考になり、助かっています。ありがとうございます。 質問よろしいでしょうか >>設定されていない場合は、.htaccessで >>「AddType application/xhtml+xml .html」 >>のいう一文を追加します。 このおかげで、確かにドコモ携帯でもスタイルが適用されるように なったのですが、通常のPC用ブラウザからは閲覧できないように なってしまいました。 それはそれで構わないのですが、クローラーからも読み込まれない ということはないでしょうか？ take | URL | 2008/11/22/Sat 14:55 [EDIT] 背景の色が変わりません。。。拡張子 .ｈｔｍｌ で、上記記述をしてdocomo携帯SO705･D902で確認したのですが背景の色が変わりませんでした。 拡張子を .xhtml にすれば変わるのですが、 .html のまま変えることはできないのでしょうか？？ adire | URL | 2008/11/11/Tue 12:02 [EDIT] Re : 教えて下さい。shibaです。 CGIなどのプログラムはHTMLとは違いますから、 ちゃんとHTTPヘッダーを出力してやらないといけません。 例えば、PHPなら header("Content-Type: application/xhtml+xml; charset=Shift_JIS"); という一文を追加しなければ正常動作しません。 同じことがCGIでもできるはずですので、調べてみてはいかがでしょうか。 shiba | URL | 2008/08/01/Fri 22:59 [EDIT] 教えて下さい。今現在i-mode対応HPを作成しているのですが、どうしても文字の背景の色を(下記)変更したいのですが、上手く行きません。 下記に掲載してあるソースをコピペしてサーバーへUPし、ドコモの携帯(N701i)にて確認すると文字の背景色が表示されません。PCで見ると変更されているのですが、何が原因か分かりません。 おわかりでしたら、教えて下さい。 又、必要な情報がありましたらお知らせ致します。 追加 色々試して見た所、「***.html」のファイルだと変更されるのですが、 CGIにて出力「***.cgi」の場合だと変更されません。 何か良い方法を教えて下さい。 ManTan | URL | 2008/05/12/Mon 10:05 [EDIT] 修正させてもらいます。>>管理人さんの書かれているもの <html xmlns="http://www.w3.org/1999/xhtml"xml:lang="ja"> <head> <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=Shift_JIS" /> <title>テスト</title> </head> <body> <div style="background-color:#808080;">aaa</div> </body> </html> これだとモバイルサイトとして検索エンジンに登録するのには、どうしたらいいの？？と、後々苦労されるでしょう…。（特にモバイルサイトとして検索エンジンインデックスされているサイトがまだまったくないかた。） ですので赤文字部分修正され以下のようになります↓ <!DOCTYPE html PUBLIC "-//OPENWAVE//DTD XHTML 1.0//EN" "http://www.openwave.com/DTD/xhtml-basic.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja"> <head> <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=Shift_JIS" /> <title>テスト</title> </head> <body> <div style="background-color:#808080;">aaa</div> </body> </html> なぜ赤文字部分の修正が必要なのか？ ①元のDOCTYPE宣言、DTD XHTML 1.0 Transitionalだとファイルサイズがよほど小さくないかぎり、大手検索エンジンにＰＣサイトとして扱われます。 また、元のDOCTYPE宣言、DTD XHTML 1.0 Transitionalはモバイルプロファイルではありません。（修正には例でopenwaveを記述しました。） ②lang="ja"は現在XHTMLのルート、HTMLの要素に書く必要はありません。 ③もっとも重要な部分です↓ <?xml version="1.0" encoding="Shift_JIS"?> いわゆるXML宣言ですが、省略可能なうちは省略しておくべきです。 これを書いていることによって、携帯からyahooモバイルで採用されているＰＣ→携帯変換ブラウザによって表示することができなくなります。 携帯からＰＣサイトを検索しようとする人は結構います。 解決法がわからず、携帯サイトがＰＣサイトとしてインデックスされている場合にも重要です。 <?xml version="1.0" encoding="Shift_JIS"?>を記述しなくても閲覧できます。 省略不可の時が来れば記述するようにすればよいでしょう。 通行人 | URL | 2008/02/23/Sat 21:06 [EDIT] i-mode HTML Simulator IIでは以下でも背景が付きますが これはSimulatorの間違いなのでしょうか？ <?xml version="1.0" encoding="Shift_JIS"?> <html> <head> </head> <body> <div style="background-color:#808080;">aaa</div> </body> </html> | URL | 2007/10/26/Fri 03:57 [EDIT] |
Author:shiba
フリーのマークアップエンジニア。
PC及び携帯サイト制作のほか、デコメ、SEO、LPO、アフィリエイトなど、WEBサイト全般の業務に携わる。過去に採用サイトの立案、コーポレートサイトの企画及び制作、タイアップバナー広告の作成、Movable TypeなどのCMSテンプレートカスタマイズ、PHPプログラミング等を経験。3年ほど前から携帯サイト制作にｼﾌﾄ。
古くから培ってきたコーディング技術とケータイ世代に生きた若さという空回りな強みをあわせ持つ。
■運営サイト
・HTMLタグボード(dspt.net)
HTML/CSSリファレンスサイト
・monozo.jp
iPhoneなどのApple製品や関連機器、a7iiiやGH5などのミラーレス一眼レフカメラ、その他、心くすぐるガジェットなどを紹介するブログ
当ブログは以下のような方が対象です。
初心者にはちょっと難しい内容かもしれません。
・HTMLやCSSを使ってPC向けのサイトを作成したことはあるが、携帯サイトは作ったことがない方または携帯サイトについて知識に乏しい方
・既存のPC向けサイトを携帯サイトへ焼き直ししようと考えているマークアップエンジニアやWEBデザイナー
リンク・トラックバック・コメント大歓迎です
11
