Webサイトデザインの最適化方法とは？
- WebサイトデザインにおけるFLASHやJavaScript、フレーム、スタイルシートの使い方について悩んでいます。
- FLASH（メニュー）+フレームの形態で作成していたサイトについて、他のページや検索エンジン対策について疑問があります。
- 他社のサイトを参考にして、メニューの最適な配置方法やページデザインの改善方法を考えています。
- ベストアンサー
Webサイトデザイン（FLASH・JavaScript・フレーム・スタイルシート）
今までFLASH（メニュー）+フレームという形態をとってサイトを作成していました。 それ以外のページ（HTMLのみのページなど）は用意していません。 主に取引先とやりとりをするページなのですが、特に不具合等を指摘されたことはありません。 メニューの中身が表示される形態の方が見やすいだろうということでJavaScriptを使おうと思ったのですが、 JavaScriptは結構オフにしている人多いですよね。 なので使うのをためらいます。 特にXPのSP2などではオフの人が多いかと思うのですが。 また、フレームはよくないようなことをききました。 検索エンジンにひっかりにくいから、というような理由のようですが。 特に検索エンジンに引っかかって欲しいと思わない場合、フレームは別に問題ないのでしょうか？ 他社企業様のサイトを見ると、メニュー（上部配置）が画面をスクロールすると一緒に動くので、フレームじゃないんだなぁと 思って見ています。 IFRAMEやスタイルシート等でそれぞれのページの上部にメニューをつけた方がいいのでしょうか？
- w-inty
- お礼率72% (1169/1618)
- CSS
- 回答数2
- ありがとう数3
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
タグの指定順が間違っています。 <!DOCTYPE 宣言、 <html <head の順でなければなりませんが、提示のコードでは、 <html <!DOCTYPE 宣言、 <head となっています。 また、</head>がありません。 include 文は、実際にそのファイルの中身がそこの場所に展開されるので、 展開された結果が正しいHTMLになっていなければなりません。 PHPが使用可能かどうか確認するために、下記のコードをtest.php とでも 名付けてサーバーにアップロードして動作を確認してください。 使用可能であれば、そのサーバーにインストールされているPHPの バージョン情報などが出力されます。 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <title>phpinfo</title> </head> <body> <?php print phpinfo(); ?> </body> </html>
その他の回答 (1)
- RAPTsong
- ベストアンサー率42% (74/175)
関連のスレッドも結構あるので見てみるといいかもしれません。 PHPはサーバが対応しているでしょうか。 対応していれば、共通部を別のファイルに書いて、 必要な場所に、よれを読み込むことができます。 PHPのサンプルコードは、参考URLの#2で投稿してありますのでご確認ください。 また、PHPはDBとも連携可能であり、動的にページを更新することも可能となります。
お礼
回答ありがとうございます。 パッと見た感じ、外部スタイルシートみたいな感じですね。 書き方も似てるし。 スタイルシートが見た目のみの指定なのに対して、PHPはDBと連携可能、動的なページの変更可能、というところが違うのでしょうか？
補足
このようにしてみました。 ●dafault.inc <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html lang="ja"> <head> <style type="text/css"> <!-- body{color:blue; background-color:pink;} --> </style> ●test.html <HTML> <?php include "default.inc" ?> <TITLE>TEST</TITLE> <BODY> TESTです。 </BODY> </HTML> としてみましたが、文字は黒のまま、背景は白のままです。 ということはサーバーがPHPに対応していないということでしょうか？ それともコードに誤りがあるのでしょうか？
関連するQ&A
- JavaScript フレーム内のインラインフレームへのリンク
こんにちは JavaScriptを使って、セレクトメニューのリストから選択すると、同ページ内にあるインラインフレームにページが展開するようにしたいのですが行き詰ってしまったので質問させてください。 ・問題点 下記のようにJavaScriptの記述をしているのですが ブラウザで開いて見ると、「更新情報6月」などを選択しても、もともと開いているページが表示されたままで別のページが開きません。 ・ファイル構成 index.html(フレームセット） －menu.html（フレーム名 menu） －main.html（フレーム名 main） new.html(indexを開いた時に表示されているページ） new6.html（更新情報6月をクリックすると開いてほしいページ） new5.html（更新情報5月をクリックすると開いてほしいページ） main.htmlの中にインラインフレーム(name＝myNew) とセレクトメニューがあります。 こちらの過去ログを見たりして記述することが出来たのですが、main.htmlを単体で開いた場合は動作してindex.htmlで開いた場合は動作しないようなのです 「parent.myNew.」がいけないのかなと思うのですが JavaScriptの細かいことが分からないので どうしたら良いのか・・・ parentを消したり、thisにしたりしてみたんですが うまくいきませんでした。 どなたかアドバイスをお願いいたします ----- 記述内 ------------ <select onChange="parent.myNew.location.href=this.options[this.selectedIndex].value"> <option value="" selected></option> <option value=new6.html>更新情報6月</option> <option value=new5.html>更新情報5月</option> </select> <iframe src="new.html" name="myNew" width="250" height="400"></iframe>
- ベストアンサー
- JavaScript
- inline frameの差し替えをjavascriptでできますか
htmlのページに2つのinline frameとほかにテーブルなどで ページを作成しています。 例） <iframe src="common/header/t_h_top.htm" width="100%" height="120" frameborder="0" scrolling="no" overflow:no></iframe> headerと左menuを作成しています。 現在のページデータを利用したいのでそのままにしておきながら、 headerだけを別のheaderに差し替えて表示したいのですが。 javascriptでA.htmlのheader部分を削除し、B.htmlを参照せよ。と指定することはできますでしょうか。 その場合、 ・元のページを丸ごと参照する指定 ・headerだけを差し替えて表示する指定 を教えてください。よろしくおねがいします。
- 締切済み
- JavaScript
- フレームと横スクロールを使ったサイト
こんにちは。質問お願いします。 今、http://youmos.com/reference/smooth_scroll.htmlのサイト様のような スクロールを使ったサイトを作りたいと思っています。 内容は、上下に分かれたフレームで 上はメニュー、下はコンテンツ、 メニューのボタンを押すと、下のコンテンツが横スクロールして 表示されるというものです。 検索したのですが、いまいちわかりませんでした。 HPについて詳しい方！回答をお待ちしております＞＜
- 締切済み
- JavaScript
- iframe内のshadowbox プレイヤー位置
こんばんわ。 iframe内でshadowboxを使って動画を再生しようと考えています。 iframeはheight1000px位の縦長です。iframe内の画像をクリックするとshadowboxが機能し、動作はするのですがプレイヤーの位置がフレーム中央に表示されロールしないと見れません。 ページの中央にプレイヤーが配置されるようにわざわざプログラミングされているのは理解できますが、なんとかこのプレイヤーの位置を調整できないものでしょうか。できればiframeページの上部に配置したいのです。 cssでやってもうまくいかず、javascriptも詳しくなく、shadow.jsのソースを見てもわかりません。 もしご存知の方がいらっしゃればお手数ですが、宜しくお願いします。
- ベストアンサー
- JavaScript
- JavaScriptで擬似フレーム、読み込み完了を知るには？
サイト内の各ページ上部に、Ajaxで共通のメニュー部分.htmlを読み出し、表示しています。 参考：AjaxでIFRAME的な表示をやってみる http://bizcaz.com/archives/2006/11/13-000253.php 参考：階層メニューにJavaScriptで書き換え http://www.dhtmlgoodies.com/index.html?whichScript=dhtmlgoodies_menu2 <html> <head> <script type="text/javascript" src="prototype.js"></script> <script type="text/javascript" src="ajaxcontents.js"></script> <script type="text/javascript" src="ListbasedDHTMLmenu.js"></script> </head> <body> <span id="ajax_content_block"></span> <script type="text/javascript"> <!-- ajax_content_onload_get('メニュー部分.html','','ajax_content_block','ajax_content_progress'); //--> </script> <div> 本文 </div> </body> </html> ajaxcontents.jsでメニュー部分.htmlを読み出しListbasedDHTMLmenu.jsで階層メニューに書き換えています。 "dhtmlgoodies_menuObjはNullまたはオブジェクトではありません" のエラーが出て、階層メニュー部分が表示されません。 dhtmlgoodies_menuObjは階層メニュー書き換えのListbasedDHTMLmenu.jsで使われています。 ページ読み出しjavascript完了後に、ページ書き換えjavascriptを実行すればと思っているのですが、 方法の検討がつきません。 if ( location.search.indexOf("1") == -1 ) { setTimeout("_reload()",100); } function _reload() { location.href = location.href + "?1"; } ↑でリロードさせて見たのですが、バックすると表示されなくなります。 すいませんがアドバイスをお願いいたします。
- ベストアンサー
- JavaScript
- ＳＥＯ対策とフレームの問題をスタイルシートで。
ＳＥＯ対策として、検索エンジン用のサイトマップを 作成しました。 次に、関連のサイトに相互リンクを申し込み、いくつかは、 相互リンクできました。 直、トップページにリンクを張るのは、デザイン上悪く、 ＳＥＯ対策としては、現在では、効果があまり無いと、よく聞く。 フレームのページだが、どうしても、見やすさでは、必要なので、 トップページのみ、フレームを無くした。 ※そのほかにサイト登録などは、しました。 上記の流れをやってきました。googleのPageRankは、２となっており、 なかなか、あがりません。もちろんPageRankをあげるのが、主で無く、 アクセスアップが、目的です。 そして、目指している競合(ライバル)サイトは、いくつもありますが、 愚者の館が、もっとも、アクセスが高いようです。 そこで、アクセスアップのためには、フレームを使用するのは、 よくないと言うことで、CSSを利用した擬似的フレームを作成 したいのです。項目を何度も、作らなくていい、フレームは、 便利ですので、それも生かした、外部スタイルシートを作成できればと、思います。 ＣＳＳのスキルもHTMLのスキルもありません。 FrontPageを使用しているので。 そんなレベルで、アクセスアップの様々な手法を教えてください。 スタイルシートも重要ですが、アクセスアップを重視します。
- 締切済み
- HTML
- javascriptで、別のフレームをリロード
下記のように、<A>タグ内だけでテキストを押すとページがリロードするようにしています。 <a href="javascript:location.reload();">再読み込み</a> フレームを分けた際、 リロードボタンを name="A"フレームに置き、 name="B"フレームを更新させたい場合、 どのように書き直せば良いのでしょうか。 すみません、簡単なことなのかもしれませんが、javascriptが不慣れで、検索してもわからなかったため、ご質問させていただきました。 何卒宜しくお願い致します。
- ベストアンサー
- JavaScript
- <iframe 内のスクロール
<iframe タグを使って、JavaScript でスクロールをさせたいの ですが、 <iframe width=150 height=200 src="test.htm"></iframe> 上記これだとスクロールしてくれるのですが、 <iframe width=150 height=200 src="http;//google.co.jp"></iframe> これだとスクロールしてくれません。 JavaScript は scroll(); を使ってます。 これは自前ページだけで、既存サイトのスクロールは無理なのでしょうか。 (http: だとアンカーになって見にくいので http; にしてます)
- 締切済み
- JavaScript
- 以前見た、javascriptやHTMLなどがとても分かりやすく紹介されているサイトを探しています
以前見たjavascriptやHTML、CSSなどがとても分かりやすく紹介されているサイトのURLが分からなくなってしまって困っています。 全体的に統一されたきれいにまとまったサイトで、javascriptやCSSやHTMLなどが本当に基礎の部分から解説されているのがとても印象的でした。 Javascriptの配布もされていて、画面の左上のメニューがページを縦にスクロールするとついてくる仕掛けのJavascriptを配布されていました。 その仕掛けをご自身のページにも使われていました。 赤い目の男の人がタバコを吸っているイラストが入っていて、管理人の方は、リョウとか、リュウとか、そんな名前の男性（と思われる）方だったと思います。 もし分かる方がいらっしゃったら教えて頂けたらと思います。
- ベストアンサー
- その他（インターネット・Webサービス）
- 別フレームへのリンク設置方法を教えてください
縦長のページの上部に<iframe>下部にも<iframe>で設定している サイトの上部<iframe>内の１テキストリンクをクリックすると、下部のフレーム内で展開される該当ページにリンクが飛び、上部の画面はそのままで、下部のフレーム内のページが変わる設定を調べておりますが、なかなか希望の情報にリーチできません。 普通にファイル名でリンクさせると、フレーム内のページが、フレームから飛び出して表示されます。（そりゃ当然ですよね）。何とか、 上部のフレーム内の各リンクをクリックすると、下部フレーム内のページが展開し、上部、下部同時に見れるページを制作したいのですが、どなたかご教授いただけますと、幸いです。宜しくお願いします。
- ベストアンサー
- HTML
お礼
回答アリガトウございます。 試してみます！！