• Skip to main content
  • Skip to secondary menu
  • Skip to primary sidebar
  • Skip to footer
  • HOME
  • SugaiDesignOffice

横浜ホームページ制作|菅井デザインオフィススタッフブログ

Elementor
  • ホームページ制作の基礎知識
  • ホームページ運用・保守
  • AI活用
  • SEO・Web集客の基礎
  • システム開発・業務効率化
  • 経営・起業に役立つWeb活用術
  • その他
ホーム / ホームページ制作の基礎知識 / ホームページ制作の流れ — 依頼から公開までに何をするのか

ホームページ制作の流れ — 依頼から公開までに何をするのか

2026年5月19日

ホームページは順番に組み立てていくものです

ホームページ制作をはじめて依頼される方から、「依頼したあと、どのように進んでいくのかがわからない」というお声をいただくことがあります。デザインが提案されて、いつの間にか公開されている、というイメージを持たれている場合もあります。

実際には、ホームページは家を建てるときと似た流れで進みます。どんな建物にするかを相談し、間取りを決め、内装を決め、工事をして、確認してから引き渡す。この順番があるからこそ、後戻りの少ない形で完成します。

ここでは、一般的な制作の流れを工程ごとにご紹介します。

1. 打ち合わせ・目的の確認

最初に行うのは、どのようなホームページにしたいかを話し合う打ち合わせです。

このとき話題になるのは、デザインの好みだけではありません。ホームページを通じて何を実現したいのか、どんな方に見てもらいたいのか、公開後は誰が更新するのか、といった点を確認していきます。

「まだ考えがまとまっていない」という状態でも問題ありません。むしろ、この段階で一緒に整理していくことが打ち合わせの目的です。

2. 構成の設計

目的が見えてきたら、どんなページを用意し、どの情報をどこに置くかを設計します。

ページの一覧を整理したものをサイトマップ、1ページごとの要素の並びを簡単な図にしたものをワイヤーフレームと呼びます。色や写真が入る前の設計図のようなもので、この段階で情報の並び順を固めておくと、あとの工程が進めやすくなります。

3. 原稿・写真の準備

掲載する文章や写真をそろえる工程です。制作全体のなかで、もっとも時間が読みにくいのがこの部分です。

社内で用意する場合は、担当の方の通常業務と並行することになるため、早めに着手できるとスケジュールに余裕が生まれます。原稿の作成や撮影を依頼できる場合もありますので、負担が大きいと感じたときは相談してみてください。

4. デザイン

設計と原稿をもとに、実際の見た目を作っていきます。多くの場合、まずトップページのデザイン案を確認していただき、方向性が決まってから下層ページへ進みます。

修正の希望は、この段階でまとめてお伝えいただくとスムーズです。あとの工程になるほど、変更にかかる手間が大きくなります。

5. 組み立て

決まったデザインを、インターネット上で見られる形に組み立てる工程です。パソコンとスマートフォンの両方で読みやすく表示されるように調整したり、お問い合わせフォームを設置したりします。

自分で更新できる仕組みを導入する場合は、この段階で設定を行います。

6. 確認・修正

組み上がったものを実際の画面で確認していただきます。文字の誤りや情報の間違い、リンク先の指定などをこの段階で洗い出します。

社内の複数の方に見ていただき、指摘をまとめて共有していただくと、確認が一度で済みやすくなります。

7. 公開と、公開してから

確認が終わったら、いよいよ公開です。ただし、公開はゴールではなく出発点にあたります。

公開後は、内容の更新、システムの更新作業、ドメインやサーバーの契約管理といった運用が続いていきます。誰がどこまで対応するのかを、公開前に決めておくと安心です。

打ち合わせの前に整理しておくと話が早い3つのこと

すべてを準備してから相談する必要はありませんが、次の3点について社内で話しておくと、最初の打ち合わせが具体的に進みます。

1つ目は、ホームページを作る目的です。 問い合わせを増やしたいのか、会社の信頼性を示したいのか、採用の応募を集めたいのかによって、必要なページも見せ方も変わってきます。

2つ目は、公開したい時期です。 展示会や事業の開始に合わせたい場合は、その日から逆算して工程を組みます。時期がはっきりしていると、原稿や写真の準備をいつまでに終えればよいかも見えてきます。

3つ目は、社内の担当体制です。 誰が窓口になり、誰が最終的に決めるのかを決めておくと、確認のたびに時間がかかることを避けられます。

期間の目安と、進行をスムーズにするために

規模にもよりますが、小規模なホームページで1〜2か月、ページ数が多い場合や撮影・原稿作成を含む場合は3か月以上かかることもあります。

期間が延びる原因として多いのは、原稿や写真の準備が間に合わないことと、確認や決定に時間がかかることです。社内で決められる方をあらかじめ決めておくと、進行が安定します。

まとめ

ホームページ制作は、打ち合わせ、構成の設計、素材の準備、デザイン、組み立て、確認、公開という流れで進みます。

どの工程でも、依頼する側の判断や情報提供が必要になる場面があります。全体の流れをつかんでおくことで、「いま何を決める段階なのか」がわかり、落ち着いて進められるようになります。

カテゴリホームページ制作の基礎知識 関連タグ:ホームページ制作, 制作期間, 流れ, 発注

本記事の情報について
本記事は公開日時点で調査・検証した内容を掲載しています。掲載後のアップデートや仕様変更により、記載の手順・画面・価格などが現在と異なる場合があります。内容には十分注意を払っていますが、正確性・完全性を保証するものではありません。本記事を参考にした結果生じた損害等について、当方では責任を負いかねますので、あらかじめご了承ください。

最初のサイドバー

Entry

ホームページ制作の依頼先はどう選ぶ?制作会社とフリーランスの違い

2026年8月4日

AI対策は検索エンジン対策に置き換わるのか — 中小企業が押さえておきたい考え方

2026年8月2日

ホームページと連携させるSNSの選び方と、無理なく続ける運用のコツ

2026年8月1日

WordPressの更新通知、そのままにしていませんか — 更新が必要な理由

2026年7月31日

WordPressに向いたレンタルサーバーの選び方とおすすめ3社の比較

2026年7月30日

CATEGORY

  • ホームページ制作の基礎知識
  • ホームページ運用・保守
  • AI活用
  • SEO・Web集客の基礎
  • システム開発・業務効率化
  • 経営・起業に役立つWeb活用術
  • その他

TAG

AI活用 Elementor Gemini Notebook Search Console SNS Web活用 wordpress サーバー システム保守 セキュリティ ターゲット データ管理 パスワード不要 プラグイン プロンプト ホームページ ホームページ制作 ホームページ 更新 ホームページ更新 ホームページ運用 ホームページ 集客 ホームページ集客 ログイン方法 中小企業 中小企業 情報発信 仕組み 保守 写真 初心者 動画活用 問い合わせ対応 学習方法 文章作成 日本語フォント 検索エンジン 検索順位 業務システム 業務効率化 準備 独自ドメイン 生成AI 経営 航空法 運用 選び方

SEARCH

X

菅井デザインオフィス Follow 514 5

SugaiDesignOffice web designer, programmer, video creator/filmmaker, drone pilot, photographer I enjoy cars, traveling, and gaming.

SugaiDesign
Retweet on Twitter 菅井デザインオフィス Retweeted
cursor_ai avatar Cursor @cursor_ai ·
3 8月 2084376701539405904

Cursor can now read, write, and act across your Google Workspace.

New plugins give agents direct access to Gmail, Google Drive, Calendar, Docs, and Sheets.

Image for the Tweet beginning: Cursor can now read, write, Twitter feed image.
Reply on Twitter 2084376701539405904 184 Retweet on Twitter 2084376701539405904 359 Like on Twitter 2084376701539405904 5315 X 2084376701539405904
Retweet on Twitter 菅井デザインオフィス Retweeted
DJIGlobal avatar DJI @DJIGlobal ·
31 7月 2083091656677413016

Slowed 60x in the DJI Lab: a hovering #DJIMavic4Pro reveals steady, orderly tip vortices. Through blade shape, spacing, and more, airflow is efficiently turned into lift — keeping it stable and controllable.
What test would you like to see next?
#DJI #CameraDrone #DJILab

Image for the Tweet beginning: Slowed 60x in the DJI Twitter feed video.
Reply on Twitter 2083091656677413016 21 Retweet on Twitter 2083091656677413016 48 Like on Twitter 2083091656677413016 221 X 2083091656677413016
Retweet on Twitter 菅井デザインオフィス Retweeted
AnthropicAI avatar Anthropic @AnthropicAI ·
30 7月 2082965101083320543

In a review of our cybersecurity evaluations, we found three incidents in which a Claude model reached the internet from within or while interacting with a third-party evaluation environment, and then gained unauthorized access to the real systems of three different

Reply on Twitter 2082965101083320543 1947 Retweet on Twitter 2082965101083320543 2291 Like on Twitter 2082965101083320543 13644 X 2082965101083320543
Load More

Footer

LINK

  • Google Gsuite
  • Elementor
  • crocoblock
  • divi

CATEGORY

  • ホームページ制作の基礎知識
  • ホームページ運用・保守
  • AI活用
  • SEO・Web集客の基礎
  • システム開発・業務効率化
  • 経営・起業に役立つWeb活用術
  • その他

© 2026 Moon rose inc.