1

Webアプリケーションがあり、レイアウトにフレームセットを使用しています。（例）。しかし、フレームは非推奨であり、ベースのサイトはADAに準拠しておらず、Googleやその他の検索エンジンでは、フレームを設定したページのみが検出され、フレーム自体のコンテンツは検出されないため、何も検出されないことを読みました。 。だから私の質問は、フレームの代替手段は何ですか？ありがとう、ラヴィ

4

2 に答える 2

1

div タグを使用します。次のようなことを試してください：

<div id="header">
    HEADER STUFFS
</div>
<div id="below-header">
    <div id="menu">
        MENU STUFFS
    </div>
    <div id="content">
        CONTENT STUFFS
    </div>
</div>

次の CSS を使用します。

#header {
    height: HEADER HEIGHT;
}
#below-header {
    position: absolute;
    top: HEADER HEIGHT;
    right: 0;
    bottom: 0;
    left: 0;
}
    #menu {
        width: MENU WIDTH;
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
    }
    #content {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: MENU WIDTH;
    }

もちろん、自分の好みに置き換えてください。幅と高さにパーセンテージを使用できます。

次に、本当の課題は、メニューのリンクが押されたときに content-div にコンテンツをロードする方法です。そのためには、AJAX を使用することをお勧めします (できれば jQuery のようなライブラリを使用することをお勧めします。これは、はるかに簡単になるからです)。もう 1 つの解決策は、ヘッダーとメニューがすべて同じでコンテンツが異なる多数のページを作成することですが、これを行うことはお勧めしません。あなたはそれを永遠に後悔するでしょう。

簡単なスクリプトは次のようになります。

$(function() {
    $("a").each(function() {
        var pat = /^https?:\/\//i;
        var url = $(this).attr("href");
        if(!pat.test(url)) {
            $("body").on("click", "a", (function(e) {
                e.preventDefault();
                $.get(url, function(data) {
                    $("#content").html(data);
                });
            });
        }
    });
}

ここでは、すべての相対リンクが、ページをリロードせずにコンテンツ div にコンテンツをロードするように設定されています。そう：

<a href="contact.html">Contact us!</a>

contact.html のコンテンツを content div に読み込みます。

<a href="http://www.google.com">Google.com</a>

ページを google.com にリダイレクトします。

他に考慮すべきことは、コンテンツを変更するときに URL を変更することです。しかし、それはまったく別の話です。

お役に立てれば。

于 2013-01-12T20:39:06.223 に答える
0

フレームは間違いなく非推奨であり、あなたが正しく指摘しているように、主要な Web サイトでは非常に積極的に推奨されていません。最近の多くの Web サイトでは、動的なレイアウト フレームを提供するために、Javascriptと連携して (特にjQuery (特に UI 部分) やDojoなどのライブラリを使用して) CSS を使用しています。

これは特に、ページ全体をリロードせずにページの一部をリロードする必要がある場合に当てはまります。この場合、通常、ページの一部をロードするために AJAX が使用されます。これを達成し、以前に提供されていたフレームと同様のレイアウトを実現する方法については、ここにはリストしません (Google はあなたの友達です!) 素晴らしいチュートリアルがたくさんあります。

これは間違いなく最も一般的な答えですが、単純なWebサイトを立ち上げる簡単な方法がたくさんあるため、コーディングスキルレベルや予算（時間またはお金）がわからないためです（Sites.google.com、多くの中でその他）。

于 2013-01-12T20:10:58.187 に答える