賢いポイント生活をはじめよう >>

ホームページを自作で作成し、完成したのですが
現在、スマホとPCのきりかえするボタンを
こちらのタグにて設定しました。

<script type="text/javascript">
// iPhoneまたは、Androidの場合は振り分けを判断
if (document.referrer.indexOf('本サイトのアドレス') == -1 && ((navigator.userAgent.indexOf('iPhone') > 0 && navigator.userAgent.indexOf('iPad') == -1) || navigator.userAgent.indexOf('iPod') > 0 || navigator.userAgent.indexOf('Android') > 0)) {
if(confirm('スマートフォン用サイトを表示しますか?')) {
location.href = '携帯サイトのアドレス';
}
}
</script>

しかし、ガラケーで見ると、PC版、スマホ版、どちらもデザインが崩れていて見にくい状態です。

それにこのジャバスプリクトはガラケーでは表示されません。

そこで詳しい方に質問なのですが、ガラケーで、わたしのホームページにアクセスした場合
アメブロに飛ぶように設定などできませんか?
またこのような「スマートフォン用サイトを表示しますか?」というようなコメントも出すことは可能でしょうか?

このQ&Aに関連する最新のQ&A

A 回答 (2件)

    • good
    • 0

>ホームページを自作で作成し、完成したのですが


 残念ですが、最初の最初から間違えられてしまった。
 現状ではfirefoxなど他の標準ブラウザとの表示差もあるのじゃないかと。
 ホームページを作ろうとしたら、まず最初に仕様書を読まれたと思いますが、肝心なところを読み飛ばされた??
【引用】____________ここから
 HTML文書が、ブラウザやプラットフォームの違いを超えてうまく働くべきであるということは、多くが認めるところである。 相互運用性の達成は、コンテンツプロバイダのコストを低下させる。なぜならただ1種類の文書しか作る必要がなくなるからだ。
 ・・・【中略】・・・
 HTMLは、どんな環境からもWebの情報を利用できるようにすべきだという方針の下に開発されている。例えば、様々な解像度や色深度のグラフィックディスプレイを持つPCや、携帯電話、モバイル機器、音声入出力機器、帯域が広いコンピュータや狭いコンピュータ、等の環境である。
 ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ここまで[Introduction to HTML 4 (ja)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )]より

 「どんな環境からもWebの情報を利用できる」ただ、そのために、わざわざHTMLを使ってウェブページを作るのですよ。ホームページビルダーなどのツールを使うとこの互換性で行き詰ってしまいます。→ ホームページ・ビルダー - Wikipedia( http://ja.wikipedia.org/wiki/%E3%83%9B%E3%83%BC% … )

 本来は、きちんと作成されていればPC、スマホは無論、携帯電話、プリンター、スクリーンリーダー、点字出力、そして検索エンジンにも対応したページができるはずです。そのためのHTMLですから。そうでなきゃPDFなどの他の方法がある。

 とりあえず<body>の次に
<p id="MessageForTTY"><a href="[携帯サイトのアドレス]">スマートフォン用サイトを表示しますか?</a></p>
とでもかいて、<head></head>内に
<meta http-equiv="Content-Style-Type" content="text/css">
<style type="text/css">
<!--
p#MessageForTTY{display:none;}
-->
</style>
を入れておけば、スタイルシートを解釈するブラウザは、この部分は消滅する。

★HTMLはウェブ標準で作成すること、すなわち、HTML5を目前にした今日だと
 HTML4.01strict + CSS2.1 がベストでしょう。
★DOCTYPEを、ブラウザが標準モードで動作するよう記述すること
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
★Another HTML-lint gateway( http://cetus.sakura.ne.jp/htmllint/htmllint.html )
 Another HTML-lint gateway( http://cetus.sakura.ne.jp/htmllint/htmllint.html )
 などで文法チェックて大きな減点は無いようにすること

 これで最低限、PCやスマホは対処できるはずです。

 その上で
★リキッドでデザインすること floatは使わない
 width:100%;min-width:600px;max-width:1000px
 あたりでよいかと

この回答への補足

詳しく回答していただきありがとうございます。

やはり自作では難しいところがたくさんありますね。
独学とホームページビルダーでホームページをつくってしまったので 色々な不具合が出ています。

お答えいただいた部分は一度修正をかけてみようかとおもいますが
自分でだれからでもみやすいホームページをつくるのはやはり専門業者さんに委託するほうがいいのでしょうか(._.)

文法チェックでもたくさん チェックがはいり、くじけそうです。

補足日時:2014/02/24 10:54
    • good
    • 0

このQ&Aに関連する人気のQ&A

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aを見た人が検索しているワード

このQ&Aと関連する良く見られている質問

QUser Agentでの振分けについて

プログラム超初心者ですがよろしくお願いしますm(__)m

既存サイトでPC・スマホ・ガラケーで、User Agentで振り分け、別ディレクトリに飛ばしたいのですが、サーバーの規定でhtaccessを使用することができません。

他に方法がありますか?
PC・スマホの振り分けではよくJavascriptで記述しているのですが、ガラケーはJavascriptの動かないものが多いのではと思っております。

サイトはHTMLで作成しており、PHPやASPのファイルにはしたくないです。

Aベストアンサー

javascriptが使えない前提でページをかき
つかえる環境のブラウザを別ページに飛ばせばよいでしょう
もしくはnoscriptタグのなかでmetaタグで飛ばす手も考えられます

<noscript>
<meta http-equiv="refresh" content="0;URL=hoge.htm">
</noscript>

いずれにしても環境依存なので、きっちりやるなら
トップページにPC用、スマホ用、ガラケ用のページへのリンクを貼り
ユーザーに任意で選ばせることです


人気Q&Aランキング

おすすめ情報