Ads by Google
新しい記事を書く事で広告が消せます。
- TB(-) |
- CO(-)
- [Edit]
- [No Tag]
Enterページを作りたい
最近のWebデザインでは、Enterページ(エンターページ)というのはあまり好まれません。にもかかわらず一定の需要があるのは、アダルトサイトのような年齢認証を必要とするサイトや、特定のジャンルで見る人を限定したいサイトが、それを必要としているからなのですね。ここをこれから読もうとしている方は、そういう方々であろうと推定して、書き進めていきます。
何となくEnterページがあるほうがかっこいい、とか、「ようこそ!」なんて入れて最初に挨拶したい、なんて思っている方は、もう一度考え直してみてください。あんまり意味がないし、閲覧者に余計な1クリックをさせるという意味で、好まれないケースもあるためです。→末尾の参考リンクをご覧ください。
以下、2つの方法を示します。
最も簡単なEnterページの作り方
ブログに全体にパスワードをかけて、プライベートモードにしてください。(設定の仕方はこちら→FC2ブログ公式マニュアル:【ブログの設定】 アクセス制限 プライベートモード) メッセージ欄に、断り書きと閲覧パスワードを入れます。 プライベートモードは、本来閲覧パスワードを知っている者のみがログインできる仕組みですが、メッセージ部分に閲覧パスワードを入れることで「ログインできる意思のある者が選択して閲覧することのできる仕組み」になります。 この「プライベートモードの認証ページをEnterページとする」方法です。方法のメリット・メリットは以下のとおり。- 簡単です
- 何の知識もなくても、管理画面でアクセス制限の設定さえできれば、確実に簡単にEnterページを作ることができます。
- 必ずEnterページを経由させることができます
- ブログは、どのページからも見られることができます。検索エンジンや誰かのブログから直接記事がリンクされていた場合、訪問者は、トップページを経由することなく、直接そのページ(記事)を開きます。けれど、プライベートモードにした場合、必ずパスワード入力が面が表示されます。「私のブログを見る人には、必ずこのことだけは読んでほしい。」というものがある場合には、プライベートモードにしてメッセージを入れるのが一番です(ただしメッセージは全角100文字内となります。それ以上の場合には、読んでほしい記事のリンクを入れることでしょう。それを読むかどうかは閲覧者の判断になりますが)。
- デザインがFC2ブログのものとなります
- 「デメリット」と明記するのは申し訳ないのですが、FC2ブログのユーザは、こだわりを持って自分のブログのデザインであるテンプレートを選択していることが多いと思われます。そこに、自分のブログの訪問者に一番最初に目に触れるページが、あの「とても特徴のある」FC2ブログの赤いタイトルのページデザインである、というのは、ちょっと……というのがあるかもしれません。
- 検索エンジンに個別ページはインデックスされません
- 認証しなければブログの中身が見られません。いくら閲覧パスワードが書いてあっても、サーチエンジンのロボットはログインしてくれませんので、クロール(記事を収集)することができません。したがって、Yahoo!JapanやGoogleなどの検索サイトにはトップページのみ掲載されることになります。
それじゃ厭、という場合は、「訪問者はEnterページを経ないこともある」ことを承知の上で、トップページをEnterページにカスタマイズする方法を取りましょう。
独自のEnterページを設置する
Enterページというのは、トップページに配置したいページですね。したがって、<!--index_area-->〜<!--/index_area-->、<!--not_index_area-->〜<!--/not_index_area-->というエリア(モード)変数を利用します。
エリア(モード)変数というのは、表示モードを切り分ける際に使います。ちなみに、このエリア(モード)変数、公式マニュアルではこのように記されています(テンプレートのカスタマイズの際には、公式マニュアルのテンプレート用変数一覧は必見です)。
| 変数 | 意味 |
|---|---|
| <!--index_area--> 〜 <!--/index_area--> | トップページ(インデックスページ、?mode 等のクエリが何も付かないURL)のみで表示されるブロック |
| <!--not_index_area--> 〜 <!--/not_index_area--> | トップページ(インデックスページ、?mode 等のクエリが何も付かないURL)以外で表示されるブロック どの場所でも有効 |
つまり、トップページに表示したいものは、テンプレート上で<!--index_area-->〜 <!--/index_area-->で囲み、表示したくないものは、<!--not_index_area-->〜 <!--/not_index_area-->で囲む、これだけです。
ただ、「これだけ」と書きましたが、テンプレートのカスタマイズに慣れておられない方々は、テンプレートの「どこ」を囲んでいいのかが分からないと思います。
ここで、2つほど、公式テンプレートをサンプルに、実際のソースを提示してみますが、その前に、この方法のメリット・デメリットをおさらいしておきましょう。
- ちょっと手間が必要です
- テンプレートのHTMLを読んで、編集しなければなりません。
- すべての訪問者にEnterページを読んでもらうことはできません
- 前述の通り、ブログは、どのページからも見られることができます。直接個別ページ(記事)を開くこともあります。すべての訪問者がEnterページを経由しているという思い込みは避けねばなりません。
- デザインは独自のものを適用できます
- ブログデザインのままにできますので、自分のブログの雰囲気を壊すことはありません。
- 検索エンジンにはそのままインデックスされます
- Enterページもブログのページの1ページに過ぎませんので、検索エンジンはどのページもまんべんなくクロールします。検索サイトには個別記事も掲載されます。
「プライベートモードの認証ページをEnterページとする」方法とメリット・デメリットが正反対になっています。
公式テンプレートdefaultにEnterページを設置
htmlの該当部分に太字部分を追加。
<%introduction></p>
</div><!--index_area--><div id="top"><p id="topmsg">(メッセージ文言。改行が必要な場合は<br />で改行)</p><p id="enter"><a href="<%url>page-0.html ">Enter</a></p></div><!--/index_area--><!--not_index_area--><div id="left" class="column">(中略)<!--/plugin_second--><!--/plugin--><!--/not_index_area--><div id="footer">
スタイルシートに以下を追加。
#top{width:400px;/*Enterブロックの幅はの数値は適宜*/margin-left:auto;/*中央寄せのためのタグ*/margin-right:auto;/*中央寄せのためのタグ*/border:10px #ffa500 ridge;/*枠はお好みで。枠の幅、色、スタイルを設定*/padding:2em;/*ブロックの内側の余白(枠とコンテンツの間の余白)*/}#enter{font-size:24px;}/*Enterの文字サイズ。変更の必要なければ#enterからここまで不要*/
このカスタマイズを施したdefaultのトップページは、こんな感じです。
カスタマイズ後のトップページにアクセス
公式テンプレートchic_eleganceにEnterページを設置
htmlの該当部分に太字部分を追加。
</div><!-- /header --><!--index_area--><div id="top"><p id="topmsg">(メッセージ文言。改行が必要な場合は<br />で改行)</p><p id="enter"><a href="<%url>page-0.html ">Enter</a></p></div><!--/index_area--><!--not_index_area--><div id="left" class="main">(中略)</div><!-- /right --><!--/not_index_area--><div id="footer"><!-- footer -->
こちらは右上に画像が配置されているため、スタイルシートにカスタマイズしなくても、デフォルト(初期設定)の左寄せでいい感じだと思いますが、いかがでしょう?

カスタマイズ後のトップページにアクセス
「私のお気に入りテンプレート」でEnterページを作りたい
ここまで、2つの公式テンプレートでのカスタマイズを載せましたが、これを読んでくださっている方は、今お使いのお気に入りの公式あるいは共有テンプレートでのカスタマイズを望む方が大半と推察します。「今のテンプレートをカスタマイズする手がかりを得るには」についても書く機会を設けたいと思います。
参考リンク
- 2u WebDesign.com:エンターページ(扉ページ)
- ホームページ工場計画:エンターページはいらない
- 二次創作同人娘のためのアクセスアップ講座:enterページは必要? 同人サイトでのenterページについて


Comment[この記事へのコメント]
Comment_form