デザインデータを機能的なWebページに変換。
WordPress実装からサイト公開まで対応いたします。
目次
概要
ご提供いただくデザインデータを、HTML/CSS/JS/WordPressを使って、高機能なWebサイトに変換いたします。サーバー設定からWordPressインストール、サイト公開までをトータルにサポートいたします。開発するサイトは、スマートフォンやタブレット表示に対応。WordPressと呼ばれるCMSを採用し、サイト修正とブログの投稿をワープロ感覚で行うことが可能です。
開発期間はプロジェクトの規模により変動しますが、最短で着手から1ヶ月です。
開発Webサイトスペック
弊社にて開発するWebサイトのスペック（搭載機能・性能）は以下の通りです。
WordPress納品
レスポンシブ（スマホ対応）
JSアニメーション
スライドショー
お問い合わせフォーム
ブログ機能
お知らせ記事投稿機能
SEOフレンドリー
追加オプション
下記の機能はオプションとして追加することが可能です。
追加フォーム
フォーム送信確認画面実装
レスポンシブ（タブレット対応）
フロントエンド開発の実施内容
フロントエンド開発の実施内容は以下の通りです。
-
1
デザインデータ抽出・最適化
提出いただくデザインデータから、コーディングに必要な要素を画像データとして抽出します。画像データを抽出した後、画像データを最適化し、Webサイトに適した形式に変換いたします。
-
2
HTMLコーディング
WebページのデザインデータをHTMLコードに変換いたします。HTMLコーディングは、デザインデータをWebページに変換するための作業で、Webページの構造をHTMLコードとして表現します。
-
3
CSSコーディング
HTMLコード開発が完了したら、CSSを使ってHTMLコードに装飾（デザイン）を実装していきます。CSSコーディングは、Webページのデザインを実現するための作業で、HTMLコードにスタイルを適用し、Webページのデザインを表現します。
-
4
JavaScriptコーディング
CSSによるサイトデザイン構築が完了したら、JavaScriptを使ってWebページに動きを実装していきます。JavaScriptコーディングは、Webページに動きや機能を追加するための作業で、Webページにインタラクティブな要素を実装します。
-
5
WordPressテーマ化
WordPressテーマ化とは、HTML/CSS/JSで制作したWebページをWordPressテーマに変換する作業で、WordPressでWebサイトを管理できるように、開発したHTML/CSS/JSデータを元にWordPressテーマを作成します。Webサイトの管理をしやすくするために、制作するWebサイトにWordPressというコンテンツ管理システムを導入しています。
-
6
お任せレスポンシブ化
もしご提供いただくデザインがデスクトップ版のみで、スマートフォンやタブレットデザインを制作されていない場合、弊社にてお任せでレスポンシブデザイン化をいたします。スマートフォン版のデザインがある場合は、デザインの指示通り忠実にコーディングいたします。
-
7
ドメイン・サーバー設定・WordPressインストール
Webサイトの運用に必要なドメイン（Webサイトのアドレス）とサーバーのセットアップ（WordPressのインストール）を行い、Webサイトの構築環境を準備をします。（ドメインとサーバーはお客様にてご契約をお願いしています）
-
8
ページ制作・サイト構築
制作したWordPressテーマをインストールし、WordPress上でWebページの構築を行います。全ページの制作、お問い合わせフォームの設定、SSL対応の設定、セキュリティ対策の設定など、Webサイトを完成させるための作業を行います。
-
9
サイト公開作業
テストサイトにて最終確認を行った後、Webサイトを公開いたします。Googleサーチコンソールへの登録や、Googleアナリティクスの設定など、Webサイト公開に必要な作業を行います。
フロントエンド開発の流れ
-
1
ヒヤリング
お問い合わせをいただいた後、打ち合わせの日程を決め、ヒヤリング（情報収集）を行います。お客様のご要望や、達成したいこと、他ご相談事など、ご依頼内容をお伺いいたします。希望スケジュールや予算感・費用、ドメイン・サーバーなどについても、こちらのヒヤリングにてお伺いいたします。
-
2
ご提案・お見積り提出
ヒヤリング内容に基づき、サイト構成案（サイトマップ案）のご提案と仕様書、お見積りを提出いたします。
-
3
ご契約・制作費の半分のご入金
ご提案内容とお見積り内容に問題なければ、ご契約となります。お見積り金額を半分をご入金いただき次第、制作を開始いたします。
-
4
プロジェクト開始
ご契約とご入金が完了しましたら、プロジェクトを開始いたします。大まかなスケジュールも、プロジェクト着手と同時に改めてご案内いたします。
-
5
必要な素材のご提出
デザインデータや写真、テキストなど、Webサイト制作に必要な素材をご提出いただきます。
-
6
コーディング
必要な素材を提出いただきましたら、早速デザインデータをWebページに変換するコーディングの作業（フロントエンド開発）に着手いたします。素材の最適化、レスポンシブ化など、機能的なWebページ開発に必要な作業を行います。
-
7
WordPress開発
コーディングで仕上がったWebページデータを、WordPressテーマに変換いたします。この作業もコーディングの一環ですが、WordPressに特化したコーディング作業となります。
-
8
ドメイン・サーバー設定
お客様指定のドメインとサーバーを設定し、Webサイトの公開準備を行います。WordPressのインストールなども行い、Webサイトを公開するための準備をします。
-
9
全Webページ構築・お問い合わせフォーム実装・テストサイトアップ
インストールしたWordPress上にて、全Webページの構築を行います。お問い合わせフォームの実装や、SSL対応の作業、セキュリティ対策の設定なども行い、Webサイトを完成させていきます。
-
10
サイト最終確認
構築が完了したテストサイトにて最終確認を行います。この段階にてお客様にも確認に入っていただき、修正などがあれば対応を行います。すべての確認作業が終わり、問題がないことが確認出来次第、公開作業に移ります。
-
11
サイト公開作業
テストサイトを指定ドメインにて閲覧できるよう、テストサイトを本番サイトに切り替えます。サイトマップの送信や、Googleアナリティクスの設定など、Webサイト公開に必要な作業を行い、Webサイトを公開いたします。
-
12
ご納品・管理画面へのログイン情報譲渡
サイトが公開されましたら、晴れてご納品となります。また、WordPressの管理画面へのログイン情報もお渡しいたします。Webサイトの更新や、ページの編集、ブログ記事の執筆などを管理画面にて行うことが可能になります。
-
13
プロジェクトの完了・制作費の残金のお支払い
以上を持ってプロジェクトは完了となります。制作費の残金をお支払いいただき、プロジェクトは完了となります。
よくある質問
-
Q
制作費用はどれくらいになりますか？
Aフロントエンド開発はプロジェクトごとに完全オーダーメイドとなり、作業工数も異なるため、一概にはお答えできません。お客様のご予算・ご要望に合わせたご提案をさせていただきますので、まずはお気軽にお問い合わせください。
-
Q
納期（制作期間）はどれくらいかかりますか？
Aこちらもプロジェクトごとに異なりますが、最短で着手から1週間での納品も可能です。お急ぎの場合は、お気軽にご相談ください。
mailお問い合わせはメール、またはフォームより承っております。
ホームページ制作に関するご質問、ご不明点などはございますか？
お問い合わせフォームよりお気軽にお問い合わせください。
電話もしくはZoomにて相談も可能です。詳細はお問い合わせページにて。
