ポータルサイトのデザイン参考事例14選！最近トレンドも紹介【2026年最新版】

ポータルサイト制作を検討しているなかで、「デザインの正解がわからず、なかなかプロジェクトが進まない」「自社に近い事例が見つからない」と頭を抱えていませんか？

膨大な情報を集約するポータルサイトにおけるデザインは、単なる見た目の良し悪しではなく、ユーザーの行動に影響を及ぼし、最終的な成果を左右する要素です。

本記事では、最新のデザイントレンドから用途別の参考事例、制作で失敗しないためのポイントまでを専門家が徹底解説します。

この記事を読むことで、自社が目指すべきデザインの方向性が明確になり、制作会社へ納得感のある発注ができるようになるはずです。

簡単な質問に答えるだけ！さくっと見積もりが知りたい方はこちらのシミュレーションがおすすめです。回答内容をもとに、Web幹事に登録されている5,000社の料金データから見積もりを算出します。

【無料】費用をシミュレーションする

ポータルサイトの種類と役割

ポータルサイトとは、直訳すると「門・入り口」であり、「インターネット上のさまざまな情報・コンテンツへの玄関口となるサイト」を指します。

身近な例は「Yahoo! JAPAN」です。検索窓という入り口があり、そこからニュース、天気、ショッピングなど多種多様なコンテンツへとユーザーを導いています。

一口にポータルサイトといっても、種類によってデザインが果たすべき役割は異なります。

例えば、不特定多数が使う「総合型」なら回遊性、特定の目的を持つユーザーが集まる「専門型」なら信頼性、毎日業務で使う「社内型」なら利便性といった具合です。

まずは、代表的な5つの種類とそれぞれの概要を整理しましょう。

関連記事：ポータルサイトとは？意味や種類、費用、作り方まで初心者向けに解説

【無料】ポータルサイトのデザインについて相談する

2026年最新！ポータルサイトデザインのトレンド

近年のポータルサイトデザインは、単におしゃれであること以上に、最新のUI（ユーザーインターフェース）やUX（ユーザーエクスペリエンス）に基づいた「ユーザーに選ばれるための設計」が重要視されています。

情報過多な現代において、ユーザーは「自分に関係がある情報か」「ストレスなく操作できるか」を一瞬で判断します。そのため、直感的な操作性と、サイトの世界観を瞬時に伝えるビジュアルの重要性がこれまで以上に高まっているのです。

ここからは、現在の主流となっている具体的なトレンド手法を5つ詳しく見ていきましょう。

1. カード（タイル）型

画像出典：allhawaii

カード（タイル）型は、コンテンツをカード状の枠にまとめて並べるレイアウトで、多くのポータルサイトで採用されているデザインパターンです。

カード型のメリットは、情報を整理しやすく、一覧で内容を把握しやすい点にあります。

コンテンツをカード単位で区切ることで、ユーザーはどこに何があるか理解しやすく、情報量が多いポータルサイトでも目的の情報を探しやすいのが特徴です。

また、スマートフォンなど画面の小さい端末でもレイアウトを保ちやすく、カード全体がタップ領域として機能するため、誤操作を防ぎながら操作性を高められます。

PC・スマートフォンのどちらでも高い利便性を維持できるため、幅広いユーザー層をターゲットにするサイトにおすすめです。

2. シネマグラフ型

画像出典：Google

シネマグラフ型は、静止画の一部だけにループする動きを加えたGIFアニメーションを活用するデザイン手法です。

画像全体ではなく一部分だけが動くため、派手になりすぎずに視線を集めやすいのが特徴です。

人は動きのある要素に自然と目を向けるため、シネマグラフを使うことで、見てもらいたい情報やブランドメッセージへ視線を誘導しやすくなります。

また、一般的な動画よりもデータ容量を抑えつつ、静止画には出せない独特の雰囲気や印象的な動きを演出できる点もメリットです。

サイトに訪れた瞬間の第一印象を強めたいときや、ブランドの世界観をさりげなく伝えたいときに相性の良い表現といえるでしょう。

3. ヒーローヘッダー型

画像出典：PAS-POL

ヒーローヘッダー型とは、サイトにアクセスした際のファーストビューに、画面いっぱいの画像や動画を配置するデザイン手法です。

ポータルサイトに限らず、企業のブランドサイトや採用サイトなど幅広いジャンルで採用されています。

大きなビジュアルと短いコピーを組み合わせることで、「どんなサイトなのか」「どんな価値を提供しているのか」を直感的に伝えやすく、ユーザーに第一印象を強く残せる点が主なメリットです。

言葉を読み込む前に世界観や雰囲気が伝わるため、「自分に関係のあるサイトだ」と感じてもらいやすくなります。

一方で、構成要素が少ない分、使う画像や動画のクオリティ、キャッチコピーの内容やフォント、レイアウトのバランスによって印象が大きく変わります。

サイトの「顔」となる部分なので、ビジュアル任せにせず、ブランドイメージや伝えたいメッセージと整合した設計が求められるデザイン手法と言えるでしょう。

4. 社員ファーストのデザイン（社内ポータル向け）

画像出典：社内ポータル活用事例集 | cybozu

社内ポータルサイトにおける重要なトレンドが、徹底した「社員ファースト」の視点を取り入れたデザインです。

一般的なサイトとは異なり、社内ポータルは社員が「毎日使う」ことを前提としています。そのため、一時的なインパクトや装飾性よりも、ストレスのない導線設計や情報の探しやすさが何より優先されます。

業務の合間に必要な情報へ素早くアクセスできるよう、直感的なアイコン配置や、どこに何があるか一目でわかるカテゴリー分けなど、無駄を削ぎ落としたインターフェースが求められます。

また、PCだけでなくスマートフォンやタブレットからの閲覧・投稿がスムーズに行えるレスポンシブ対応も欠かせません。

社員が「使いにくい」と感じてしまうと、次第にサイトが活用されなくなり、情報共有という本来の目的が達成できなくなります。社内ポータルの価値を最大化させるには、現場の社員が毎日触れることを心地よいと感じるような、利便性の高い設計が不可欠です。

5. 総合機能型のデザイン連携（社内ポータル向け）

画像出典：社内ポータルサイト成功の秘訣！社内に浸透しやすい構築方法 | SITEMANAGE

社内ポータルにおいて、業務効率を向上させる手法として「総合機能型（ダッシュボード的デザイン）」を採用するのも選択肢の一つです。

単に情報を発信するだけでなく、WordやExcelといった業務ソフト、SlackやChatworkなどのチャットツール、さらには勤怠管理システムといったあらゆる外部サービスをポータルサイト上で統合する設計です。

ポータルサイトをすべての業務の起点となる「ダッシュボード」にすることで、ツールごとにログインして探す手間を省き、迷いのないスムーズな業務フローを実現します。

散らばりがちな情報を一箇所に集約し、必要なツールへワンクリックでアクセスできるデザイン連携は、情報の飽和を防ぎ、組織全体の生産性を底上げするために重要な要素となります。

ポータルサイト構築に強いホームページ制作会社17選｜制作のプロが厳選【2026年最新版】 | Web幹事

【無料】ポータルサイトのデザインについて相談する

ポータルサイト制作の費用がいくらかかるか
60秒で診断してみませんか？

全国5,000社の見積もりから算出した、
Web幹事オリジナルの料金シミュレーターを無料でご利用いただけます。

「社内稟議の前に予算を決めたいけれど相場がわからない」
「事前に取った見積額の妥当性に不安がある」
という方は、ぜひお試しください。

まずは最初の質問です
ホームページ制作は初めてですか？
はい いいえ

【社内】業務効率と信頼性を高めるデザイン事例

社内ポータルサイトやBtoB向けのポータルサイトでは、デザインにおいて「日々の業務を滞らせない使いやすさ」と「安心して情報を預けられる信頼感」が特に重視されます。

社内規定やマニュアル、取引データなどを整理し、検索やメニュー構造を工夫して、迷わず目的の情報にたどり着けるよう設計することが求められます。

ここでは、実用性と信頼性をバランスよく実現したデザイン事例を紹介します。

株式会社ユーティル

株式会社ユーティルでは、ホームページ制作やリニューアルの相談を受けた顧客情報（目的や予算など）をポータルサイト上で管理し、社内で共有しています。

同社の社員だけでなく、案件を担当する外部のWeb制作会社も必要な情報を閲覧できる仕組みを構築することで、連絡・伝達・情報共有のロスが大幅に削減され、組織全体の生産性向上につながっています。

また、営業チームや採用チームなど各部署の目標進捗や、教育用マニュアルといった社内のナレッジも同じポータルに集約しています。

今後データが増えていくことを前提に、構成はできるだけシンプルに保っています。「どこに何があるか」を一目で把握できる画面設計にすることで、誰でも迷わず必要な資料にアクセスできるデザインです。

株式会社東横イン

画像出典：DISCOVERIES

株式会社東横インでは、業務の効率化と情報の見える化を目的に、クラウド型の社内ポータルサイトを運用しています。

PCブラウザを立ち上げると最初に社内ポータルが表示され、書類を検索できる機能や、利用頻度の高い書類をまとめたリンク集など、日常業務で使いやすい設計が整えられています。

画面構成は大きく「中央エリア」「右サイドバー」「左サイドバー」の3カラムに分割。中央には最新のお知らせや業務連絡、社内イベントなどの重要情報を集約しています。

左サイドバーにはカレンダーやリンク集など個々の社員がよく使うコンテンツを配置し、右サイドバーにはその他の社内告知をまとめることで、必要な情報にすばやくアクセスできるレイアウトです。

株式会社池田模範堂

画像出典：社内ポータル活用事例集 | cybozu

株式会社池田模範堂は、肌トラブルや虫刺され向けの医薬品を製造・販売している企業です。

かゆみ止め薬『ムヒ』」から『MUHI』へのブランド刷新を進めるなかで、社員同士の活動状況を共有し、変革の方向性をそろえるツールが必要になり、社内ポータルサイトを本格的に活用し始めました。

ポータルのページ左側には、「創業1909年〜“変身への挑戦”をはじめます」といったブランドビジョンを常に表示し、企業としての方向性を日々確認できるようにすることで、社員の意識統一やモチベーション向上につなげています。

あわせて、メールの送受信やスケジュール管理、ファイル管理、業務手続きのフロー確認など、日常業務で使う機能をポータルからまとめて利用できるように設計。アイコンを整理して配置し、各機能へワンクリックで移動できる構成にすることで、「まずポータルを開けば必要な情報と機能にアクセスできる」使い勝手のよい社内基盤となっています。

【無料】ポータルサイトのデザインについて相談する

【地域・観光】魅力を視覚的に伝えるデザイン事例

地域型や観光ポータルサイトにおいて、デザインの役割は「その土地に行ってみたい」とユーザーの感情を動かすことにあります。

そのため、文章での説明以上に、写真や動画といった視覚的な情報を中心に据えたレイアウト設計が重要です。

ユーザーの「行ってみたくなる」感情を引き出し、没入感のある世界観を演出している事例を見ていきましょう。

allhawaii（ハワイの地域型ポータルサイト）

画像引用：allhawaii

『allhawaii（オールハワイ）』は、ハワイを主要エリアとし、現地のグルメやホテル、アクティビティなどの情報を幅広く発信している地域型ポータルサイトです。

トップページの下部にはカード型デザインを採用し、多様なカテゴリーの最新情報が整理されたレイアウトで並べられています。
​
トップページには、ハワイの自然や街並みを切り取った鮮やかな画像を大きく配置。一部コンテンツには静止画の一部だけが動くシネマグラフを取り入れ、視線を自然に誘導しながら世界観への没入感を高めています。

こうしたビジュアル中心の設計により、ハワイの雰囲気や魅力が直感的に伝わり、サイトを閲覧しているうちに「現地に行ってみたい」という旅行意欲が高まりやすい構成になっている事例です。

ふーぽ（福井県の地域型ポータルサイト）

画像出典：ふーぽ

『ふーぽ』は、福井県エリアのグルメ、イベント、子育て、スポット情報などを幅広く掲載する、地域密着型のポータルサイトです。

多くの情報量を扱いながらも、見やすいナビゲーションと整理されたレイアウトを両立している点が特徴です。トップページ上部には「おすすめコンテンツ」やキャンペーン情報などを大きなビジュアルで配置し、まず興味を惹きつける構成になっています。

一方で、その下にはカード型レイアウトで新着記事や各ジャンルの記事を配置。右サイドバーに人気記事ランキングなどを配置することで、目的がはっきりしているユーザーも、なんとなく眺めたいユーザーも迷わず回遊できる導線が整えられています。

余白や区切りの使い方を工夫することで視線を整理し、「今、福井で何が起きているのか」を直感的に把握できるデザインに仕上がっている事例です。

Dive! Hiroshima（広島県観光ポータル）

画像出典：Dive! Hiroshima

『Dive! Hiroshima』は、広島県観光連盟が運営する公式観光サイト。従来の観光ポータルサイトの枠を超えた「雑誌のような」ビジュアルデザインが特徴です。

柔らかな色使いと洗練されたデザインが随所にあしらわれており、アクセスした瞬間に「新しくておしゃれな旅ができそう」というポジティブな印象を与えます。

情報配置の面でも、あえてグリッドを崩した構成と大きな写真を組み合わせることで、「どこから何を見ればよいか」が直感的にわかる画面構成になっています。

観光情報の網羅性を確保しつつ、ブランドイメージや世界観の表現にも力を入れたい地域・観光ポータルにとって、デザイン面での差別化のお手本となる事例といえるでしょう。

【無料】ポータルサイトのデザインについて相談する

【口コミ・専門】膨大なデータを整理するデザイン事例

口コミサイトや専門型ポータルサイトのように、ユーザー投稿やデータ件数が多いサイトでは、デザインの評価は最終的に「どれだけ探しやすいか」に集約されます。

情報量が多いほど、ユーザーは自分に関係のある情報だけを素早く絞り込みたいと考えます。
そのため、検索ボックスの配置などのUIを工夫し、重要な情報から順に目に入るよう優先順位を整理して、ユーザーをできるだけ少ないステップで目的の情報へ導くことが大切です。

食べログ（口コミ型）

画像出典：食べログ

『食べログ』は、日本最大級の飲食店の検索・予約ポータルサイトです。ユーザーからの「口コミ」という膨大なデータを扱いながらも、迷いを感じさせない巧みなUI設計が施されています。

ファーストビューには「検索機能」が配置されています。行きたい日・行きたい時刻、人数といった条件がシンプルに配置されており、ユーザーは迷うことなく絞り込みを開始できます。

検索結果一覧には「カード型」レイアウトを採用。店舗や料理の写真を印象的に配置したうえで、周囲に適切な余白を設けることで、点数（評価）や予算、空席状況といった情報を判別しやすいように工夫されています。

各店舗ページでは「口コミ」や「写真」がタブ形式で整理されており、情報過多を防ぎつつ、信頼性の高い情報へスムーズに辿り着けるよう配慮されています。

信頼感を与える落ち着いた配色と、アクション（予約や電話）を促すためのボタン配置のバランスは、データ量の多いポータルサイトにおいて参考になるデザインです。

ホットペッパービューティー（美容専門型）

画像出典：ホットペッパービューティー

『ホットペッパービューティー』は、美容室やエステサロンなどの予約に特化した専門型ポータルサイトです。

デザイン面では、美容感度の高いユーザーを意識した清潔感のあるトーンと、迷わず予約まで進める直感的な導線づくりが重視されています。

サイト全体は白を基調としたスッキリとしたデザインで統一されており、各サロンのスタイル写真やビフォーアフターのビジュアルが映えるように構成されているのが特徴です。

また、トップページから「ヘア」「ネイル」「リラク」「エステ」といった主要カテゴリーにすぐアクセスできるほか、エリアや現在地、日時などの条件でスムーズに検索できるUIになっています。

予約画面においても、空き状況がカレンダー形式で一目で把握でき、直感的にわかるステップで予約が完了するUIが構築されています。ユーザーが「綺麗になりたい」と感じたタイミングでモチベーションを逃さず、アクション（予約）へとつなげる、完成度の高い導線設計といえるでしょう。

【無料】ポータルサイトのデザインについて相談する

動画幹事（制作会社検索・専門型）

『動画幹事』は、全国の動画・映像制作会社を目的別に探せる専門型ポータルサイトです。

B2B（企業間取引）のマッチングサービスとして、初めて動画制作を依頼する企業でも不安なく比較・検討できるよう、「信頼感」と「条件で探しやすい検索性」の両方を意識したデザインが採用されています。

ブランドカラーであるオレンジ系の背景色を大きく用い、サービス内容やメリットをファーストビューでわかりやすく伝える構成になっています。

また、ページ下部には「地域から探す」「目的から探す」といった切り口で制作会社を探せる導線を用意。エリアや用途から直感的に候補を見つけられる、検索のしやすさが特徴的です。

また、検索UIでは、チェックを入れていくだけで要望に合う制作会社を絞り込めるフォームが用意されています。

「目的から探す」においては、企画から撮影、アニメーション、YouTube運用支援など、ニーズごとに細かく条件を選べるため、はじめて動画制作を検討する担当者でも迷いにくい設計です。

SUUMO（不動産専門型）

画像出典：SUUMO

不動産専門型ポータルサイトの代表格である『SUUMO（スーモ）』は、膨大な物件情報を扱いながらも、親しみやすいデザインで使いやすさを実現している事例です。

大きな特徴は、独自のキャラクターを起用し、サイトカラーを鮮やかな緑色で統一している点です。これにより、無機質になりがちな不動産情報サイトに「親近感」と「オリジナリティ」が生まれ、ユーザーが心理的なハードルを感じることなくサイトを利用できる環境を構築しています。

機能面では、「借りる」「買う」「建てる」といったカテゴリー分けが明確で、なおかつエリアや沿線、こだわり条件など、高度な検索UIがスムーズに動作します。専門分野に特化した膨大なデータベースを、初心者のユーザーでも迷わずに操作できるように整理・構築された、専門型ポータルサイトの理想的な形の一つです。

LIFULL HOME'S（不動産専門型）

画像出典：LIFULL HOME'S

『LIFULL HOME'S』は、スッキリとした印象を与える「余白の使い方」と、情報の優先順位が明確な「タイポグラフィ（文字設計）」が優れた専門型ポータルサイトです。

不動産サイトは掲載すべき項目が多く、画面が煩雑になりがちです。しかし、LIFULL HOME'Sでは各コンテンツの間に十分な余白を設けることで、情報が混ざり合わずにスッと目に入ってくるUIを実現しています。

また、価格や物件名といった重要な情報のフォントを大きく、補足情報を小さくするなど、フォントサイズの強弱を徹底。ユーザーが情報の優先順位を直感的に判断できるため、大量の物件リストの中から自分に合った条件をストレスなく比較・検討することが可能です。

【無料】ポータルサイトのデザインについて相談する

【総合・メディア】ユニバーサルな使いやすさを追求した事例

あらゆる層が利用することを前提とした総合型ポータルや大手メディアでは、特定のターゲットに寄せるのではなく、誰にとっても等しく使いやすい「ユニバーサルな標準化デザイン」が求められます。

子供から高齢者まで、ITリテラシーに関わらず「どこを押せば何ができるか」が直感的に伝わらなければなりません。そのため、奇抜な装飾を避け、情報の配置やボタンの形状、配色のコントラストなどを徹底的に「標準化」することが成功の鍵となります。ここでは、究極の使いやすさを追求し続ける、日本を代表する事例を紹介します。

Yahoo!JAPAN（総合型）

画像出典：Yahoo!JAPAN

『Yahoo!JAPAN』は、検索エンジンをメインに、ニュース、天気、株価、ショッピングなど、生活に不可欠なあらゆるコンテンツを集約した日本最大級の総合型ポータルサイトです。

このサイトの特徴は、情報の密度とクリック率を高いレベルで両立させている点です。サイドバーの各カテゴリーにアイコンを付加して視認性を高めるほか、トップページ上部に「ヤフオク!」や「メール」といった主要サービスを配置。これにより、迷わずに1クリックで目的のサービスへアクセスできるよう設計されています。

また、フォントカラーの統一や、重要な情報を画面中央に寄せる配置など、PC画面においても「スマホライク」な操作感を意識したレイアウトは参考になります。膨大な情報を扱いながらも、時代の変化に合わせて進化し続ける、まさにポータルサイトデザインの王道ともいえる事例です。

Google（検索特化型）

画像出典：Doodle

『Google』のトップページは、ポータルサイトにおける「検索体験」に特化したシンプルデザインの象徴といえます。

情報の入り口である検索窓のみを中央に配置し、それ以外の要素を徹底的に排除したレイアウトは、ユーザーに迷いを与えません。ユーザーの目的が「検索すること」である以上、目的を最短で達成させるための機能美が追求されています。

また、基本はシンプルでありながら、特定の記念日にロゴデザインが変化する「Doodle（ドゥードゥル）」のような遊び心も備えています。

時には「シネマグラフ」を活用したアニメーションロゴを取り入れることで、ブランドへの親近感を醸成しつつ、その日のストーリーを効果的に訴求しています。装飾を削ぎ落とすことが、いかにユーザー体験を生み出すかを証明している事例です。

NewsPicks（経済メディア）

画像出典：NewsPicks

経済ニュースメディアの『NewsPicks（ニューズピックス）』は、スマートフォンでの閲覧に特化した、SNS的なUI設計が特徴です。

従来のニュースポータルが「記事を読む」ことに主眼を置いていたのに対し、NewsPicksは専門家や著名人のコメントをセットで見せ、ニュースを「見て、参加する」能動的な体験へと変えています。

縦スクロールを基本としたスマホライクなレイアウトや、直感的に「Pick（シェア・コメント）」できるUIは、隙間時間での利用を最適化しています。

また、画像とタイトルを際立たせるモダンなデザインは、複雑な経済情報を「自分に関連のある、面白い情報」として捉えさせる効果をもっています。

コミュニティ機能をデザインの中心に据えることで、ユーザーの滞在時間とエンゲージメントを高めている、次世代型のメディアポータル事例です。

【無料】ポータルサイトのデザインについて相談する

ポータルサイトのデザイン制作で失敗しないための注意点

ポータルサイトのデザイン制作でまず避けたいのは、見た目の「おしゃれさ」を優先しすぎて、本来重視すべき「使いやすさ」や「目的達成のしやすさ」を犠牲にしてしまうことです。

ポータルサイトは膨大な情報への入り口で、ユーザーが知りたい情報に迷わずたどり着けるのが価値となります。

あくまでデザインは、ユーザーの利便性を高めるための手段だと捉えたうえで、このあと紹介する2つのポイントを意識しながらポータブルデザインの制作を進めましょう。

広く使われているプログラミング言語、フレームワークで開発する

ポータルサイトをパッケージなどに頼らずゼロから開発する場合は、広く普及しているプログラミング言語やフレームワークを選ぶことが重要です。

理由は、将来的な拡張や保守をスムーズに行うためです。

メジャーな技術は扱えるエンジニアが多く、ドキュメントやナレッジも豊富なため、運用フェーズで別の開発会社に引き継ぐ場合でも対応しやすくなります。

一方、利用者の少ない言語や独自フレームワークで構築してしまうと、トラブル時の調査や機能追加のたびに対応できる人材が限られ、コストや時間が膨らむリスクが高まります。

コンテンツ拡充やUI改善など、長期運用でのアップデートを前提に、「保守しやすく、今後も使い続けやすい技術」を選んでおくことが、ポータルサイトを安定して育てるうえで欠かせません。

公開前後の運用フローを決めておく

デザインのクオリティを保ち、サイトを長く使える状態に育てるには、公開前後の運用フローをあらかじめ整理しておくことは欠かせません。

特にポータルサイトは日々新しい情報が追加されるため、明確な入稿ルールがないと、更新を続けるうちにレイアウト崩れやトンマナのばらつきが起きやすくなります。

画像サイズの目安や文字数の上限、文体・配色などのトーン＆マナーをガイドラインとしてまとめ、誰が更新しても見た目の一貫性が保てる仕組みをつくっておきましょう。

あわせて、本公開の前に一部のユーザーや社内メンバーに実際に操作してもらうテスト運用を実施し、「どこが分かりにくいか」「どこで迷うか」といった声を集めて反映することも重要です。

こうしたフィードバックを定期的に取り入れながら、デザインや導線を少しずつ改善していける体制を用意しておくことが、ポータルサイトで失敗しないための大きなポイントといえます。

【無料】ポータルサイトのデザインについて相談する

ポータルサイトの制作費は？

続いて、具体的な費用についてみていきましょう。ポータルサイトの「デザインだけ」を外注した場合の費用、サイト全体の構築を依頼した場合の費用をそれぞれご紹介します。

デザインだけ依頼する場合は、1ページ5〜10万円ほど

ポータルサイトの「ページ数」に応じて費用が算出されます。1ページあたり5〜10万円程度を見積もっておきましょう。

ひと口にデザインといっても、トップページからカテゴリ別のページ、コンテンツページなどさまざまです。基本的には、まずトップページのデザインを決め、それをベースに他のページをデザインしていく流れになります。

トップページだけで10万円、その他のページは平均5万円程です。またPCとスマホ両方に画面を最適化する「レスポンシブ対応」にする場合は、プラスで10万円程度かかります。

サイト全体を外注する場合は50〜500万円以上と幅が大きい

ポータルサイト全体の構築を依頼する場合は、サイトの規模によって費用は大きく変動します。小規模サイトで50〜150万円、中規模サイトで150〜500万円、大規模サイトになれば500万円以上かかることも。

ポータルサイトの企画からデザイン、コーディング、バックエンド、保守運用までをワンストップで行うため、ある程度の期間と費用がかかることを踏まえておきましょう。

デザインだけ外注するのか、それ以外も依頼するのか

これまで「デザイン」に焦点を当ててきましたが、ポータルサイトの構築はデザインだけではありません。デザイン以外にも、次のような費用がかかります。

• 企画・ディレクション費：サイトの構想と進行にかかる費用（Webディレクターの人件費など）
• コーディング費：デザインを表示させるためのコーディング費用
• バックエンド構築費：サーバーなどユーザーの目に見えないシステムを構築する費用
• 保守運用費：サイト制作後にシステムを保守・運用するための費用
• コンサルティング費：サイト制作後、集客やSEOの提案などコンサルを受ける場合にかかる費用

ポータルサイトに限らずWebサイトは、多くの工程を経てようやく完成します。依頼範囲によって期間や費用も大きく変わるため、デザインだけ外注したいのか、それともポータルサイト全体の構築を依頼したいのかを明確にしておきましょう。

関連記事：ポータルサイト構築に強いホームページ制作会社！制作のプロが目的別におすすめします

【無料】ポータルサイトのデザインについて相談する

ポータルサイトのデザインまとめ

本記事では、ポータルサイトのデザインについて、次のポイントを中心にお伝えしました。

• ポータルサイトには、社内ポータル・専門型・地域型・口コミ型・総合型など、用途に応じた種類がある
• 「カード型」「シネマグラフ型」「ヒーローヘッダー型」など、近年よく使われるレイアウトや表現手法がある
• 社内ポータルでは「社員ファースト」の設計や、業務ツールを集約した総合機能型のデザインが好まれている
• デザイン時は、グローバルメニューの構成、色使い、余白の取り方など、情報の見やすさにつながる基本要素を押さえる
• デザインのみ外注する場合は、1ページあたりおおよそ5〜10万円程度を目安に検討する

ひと口にポータルサイトと言っても目的や想定ユーザーはさまざまで、それによって最適なデザインも変わります。

流行の手法を取り入れつつも、「自社の目的に合っていて、ユーザーが迷わず情報にたどり着けるか」という視点を軸に、デザインを検討していきましょう。

デザイン制作には相応のコストと期間がかかります。自社だけで判断するのが難しい場合は、プロの知見を借りることが成功への一番の近道です。

外注を検討される際は、ぜひWeb幹事にご相談ください。貴社の目的や予算を丁寧にヒアリングし、最適な制作会社をご紹介します。相談料や紹介料は一切かかりません。

【無料】自社に最適なポータルサイト制作会社を紹介してもらう