.htaccessによる携帯サイト転送方法

質問

小さな会社で自社サイトの管理を担当している者です。
現在はPCサイトと支店サイトのみなのですが、新たにモバイルサイトを構築することになりました。
このような構成です。

http://www.○○○.jp/　（本店PCサイト）
├ http://www.○○○.jp/●●●/（本店モバイルサイト）
└ http://www.○○○.jp/□□□/（支店PC＆モバイルサイト）

携帯電話からPCサイトにアクセスした際、同じURLでモバイルサイトに自動転送したいです。
しかし問題なのが支店PCサイトです。
.htaccessを上の階層（ここではPCサイトの階層）に置くと、それ以下の階層にまで影響を与えるということなのですが
http://www.○○○.jp/□□□/に携帯からアクセスしたら、http://www.○○○.jp/●●●/に転送されてしまうのでしょうか？

支店サイトは別な担当者が管理しているのですが、シンプルなサイトでPCと携帯用でワンソース、javascriptで携帯用のスタイルシートに振り分けているようです。
そのため、本店のモバイルサイトの影響がないようにしたいです。

.htaccess以外にも、携帯電話からのアクセスを自動振分けするようなプログラムはありますか？
いろいろなサイトで調べているのですが、この問題でずっとつまずいており先に進めません。

お手数ですが、何かアドバイスをいただけると助かります。
宜しくお願い致します。

回答No.2

ORUKA1951 · ベストアンサー

同じURLで、複数の端末に利用させる方法は.htaccessで行う場合、Rewriteを使用します。
欠点は、
・端末ごとにファイルを用意する必要がある。
・UserAgentの設定漏れがあると期待通りのRewriteが行われない
・複雑なRewriteRuleを書く必要がある。
です。
　そこで、スタイルシートで表示自体を変える方法が楽です。すなわち
<link rel="stylesheet" type="text/css" href="default.css">
<link rel="stylesheet" type="text/css" media="screen" href="./styleSheet/screen.css">
<link rel="styleSheet" type="text/css" media="print,handheld" href="./styleSheet/print.css">
とか・・スマートホン用にディスプレイの幅で振り分けることもできます。
<link rel="stylesheet" type="text/css" media="only screen and (max-device-width:480px)" href="./stylesheet/smart.css">
<link rel="stylesheet" type="text/css" media="screen and (min-device-width:481px)" href="./styleSheetpc.css">

　HTML本体は、率直にデザインは無視して文書構造だけをマークアップして記述しておきます。

<object>要素を利用してflashが表示できない場合の代替HTMLを書いておく
<object ****flash>
　<object *****MPEG>
　　<ol>
　　　<li><a href=""></a></li>
　　　<li><a href=""></a></li>
　　　<li><a href=""></a></li>
　　</ol>
　</object>
</object>
　これでflashを利用できないブラウザは、順次利用可能なコンテンツを表示します。
→13.3 一般的包含: OBJECT要素 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/struct/objects.html#h-13.3 )

　また、スタイルシートで内容を置き換えても良いでしょう。
div.nav ol:after{content:url([flash]);display:block;}
とか・・

　また、SSIを使用して、ユーザーエージェントによって表示するデータ自体を変化させる方法も良く使われます。--大規模サイトはサイト全体がこの方法ないし、PHPやCGIで同等機能を持たせています。

お礼

詳しく教えていただきありがとうございました。
FLASHの<object>要素内に携帯電話用のHTMLを記述したところ、携帯用の内容がきちんと表示されました。
このような方法は知らなかったのでとても参考になりました。
今後はメディア別にスタイルシートで表示切替ができるように直していきたいです。
本当にありがとうございました。

回答No.1

ORUKA1951

支店で行っている方法が次善の策でしょう。

　そもそも、
【引用】＿＿＿＿＿＿＿＿＿＿＿＿ここから
HTML文書が、ブラウザやプラットフォームの違いを超えてうまく働くべきである・・・【中略】・・・。
なぜならただ1種類の文書しか作る必要がなくなるからだ。
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
　もし【相互運用性確保の】努力が成されなければ、Webは互換性のないフォーマット毎に分け隔てられた世界に分割され、すべての関係者にとっての商業的可能性が減少することとなるであろう、大きなリスクを負うこととなる。
　・・・【中略】・・・
　HTMLは、どんな環境からもWebの情報を利用できるようにすべきだという方針の下に開発されている。例えば、様々な解像度や色深度のグラフィックディスプレイを持つPCや、携帯電話、モバイル機器、音声入出力機器、帯域が広いコンピュータや狭いコンピュータ、等の環境である。
￣￣￣￣￣￣￣￣￣￣￣￣￣ここまで［2.2.1 HTMLの略歴( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/intro/intro.html#h-2.2.1 )］より

　これが、HTMLでウェブの本体を作成する最も重要な理由なのです。よって
「端末ごとにページを作成する」ことは、最初に避けなければなりません。
また、当然「転送するとURLが変わります」から、わが社のウェブサイトはここです。なんてできなくなります。

　携帯サイトが、スマートホン(screen)のことなのか、携帯電話(handheld/tty)なのかわかりませんが、それだけではありません。検索エンジンも訪問しますし、視覚障害者はユーザースタイルシートや、読み上げソフトを利用されているかもしれません。今後の技術の普及で、ますます端末の種類は増えていきます。
　それぞれに、ページを作成していくのは大変な労力になりますし、そもそも何のためのウェブサイトかわからなくなります。

1) ひとつのHTMLで、複数の端末が利用できるようにすること
　プレゼンテーションはスタイルシートの切り替えで行うこと
2) データ量の少ない携帯電話対象のページを作成する場合は、共通のページからリンクする。
　パソコン用ページへのリンクはスタイルシートなどで隠してもよい。

　が基本になるでしょう。公共性が多少でもある企業サイトの場合は特にこの方法をとります。支店によくわかってらっしゃる方がいるようですので、一度聞かれてみたらいかがでしょう。

お礼

回答いただきありがとうございました。
現在作成しているのはスマートフォンではなく携帯電話(handheld/tty)向けのサイトです。
一つのHTMLで様々な端末に対応すべきというのは、確かにそうだと思います。
支店のサイトはごくシンプルで文字情報がメインなので、携帯への対応が簡単なようです。
しかしながら、本店のPCサイトはコンテンツ量が多く画像も多用しているため、スマートフォンなら可能だと思うのですが、スタイルシートで携帯電話対応にするには、直すところが多すぎて無理がある状態です。

新たに作る携帯電話のサイトはコンテンツを絞り文章を短くし、ページ内リンクを多く採用、データ通信量の負担を少なくするために最初から画像サイズを240ピクセルまでで作るなどの工夫をしております。

ヤフーや楽天市場なども携帯電話専用のサイトを用意しているように思うのですが、これもPCと同じHTMLで作っているのでしょうか？

>2) データ量の少ない携帯電話対象のページを作成する場合は、共通のページからリンクする。

それならば、index.htmlをPCと携帯電話で共通にすることで.htaccessによる転送を使わずに済みそうですね。
PCサイトのindex.htmlはFLASHでオープニングムービーが流れるだけです。ムービーが流れた後にボタンが出てクリックしてもらい、トップページに進みます。
携帯からのアクセスはFLASHを表示しないようにして、携帯用のコンテンツを表示する。
これをHTMLで対応させるとしたら、どのような記述になりますでしょうか。
ヒントでも良いので、もしお分かりでしたら教えていただけると助かります。
宜しくお願い致します。