動的ページの設計

以前ホームページには表示させるだけの「静的ページ」、新着情報のように毎回掲載されてる内容が固定ではない「動的ページ」の2種類を簡単に説明しました。

今回は動的ページの設計、どんな流れになっているのかを解説します。

例として、データベースに保存されている情報を、ホームページで表示という依頼があったとします。

データーベースとはお客様情報や社内で扱っているデータの倉庫のようなものです。「商品名」「値段」「発売日」「写真」という内容があって、それがExcelのような形で保存されているという感じです。発売日順の並び替えや、一定のルールに該当するものを表示させたりすることが可能です。Excelと似ている部分も多いのですが、データーベースはデータまとめるのに特化したもの。Excelは計算機能に特化してると思えばわかりやすいかもしれません。

このデータベース。集めた情報をホームページに掲載することも可能です。ホームページ上で見かける、わかりやすいデータベースの例としてはショッピングサイトなどがあります。ショッピングサイトのデータベースでは「商品名」「商品ジャンル」「金額」「画像」などがデータベースとしてあり、買う側はそのデータベースから検索をし、購入したい商品を絞って検討するという流れになります。

・会員登録機能がほしい
・検索で商品を探すシステムがほしい
・会員登録した人にだけ見える写真を設けたい

上記の条件を踏まえた上で、ページの設計をしてみたのが下の図です。

これが最低限必要だと思われるページです。

動的ページを作成する場合、〇〇に該当する人はページA、それ以外の人はページBというように、一つのクリックボタンから条件次第で別のページを表示させることがあります。
条件次第で次のアクション(動きや表示させるもの)が変わって来るため、動的ページを作成する場合には「何をどう表示させたいか」を事前にしっかりと設計しないと、条件の数(ページA・ページB・ページC等)がどれくらい必要なのかがわからず、納期や見積もり金額がぼんやりしてしまいます。
表示させる内容や条件が多くなればなるほど、複雑なページ構成にはなってしまうのですが、このようなシステム。ホームページを見る側としては必要な内容だけを探し出せて便利な機能なので、興味がある方はお問い合わせください。