業務アプリの​受託開発 お問い合わせ

ホームページ制作

見る​人が​迷わない、
あとから自分で​直せる
ホームページを。

会社や​お店の​サイト、​採用ページ、​LPを​作ります。​スマホで​見やすく、​検索で​見つかる​ための​基本の​設定を​して、​公開した​あとも​更新できる​形で​お渡しします。

このサイトのトップページ

作る​もの

  1. 01会社の​サイト事業の​内容、​実績、​会社の​情報、​お問い合わせ。​名刺の​代わりに​なる、​きちんとした​サイト。
  2. 02お店・​サロンの​サイトメニューと​料金、​雰囲気の​伝わる​写真、​地図、​予約の​入口。​スマホで​見る人が​ほとんどです。
  3. 03採用ページ仕事の​中身と、​働く​人の​様子。​応募の​入口までを​1つの​流れに​します。
  4. 04LP​（1枚の​ページ）1つの​サービスや​催しを、​上から​下へ​読み進めるだけで​伝わるように。
  5. 05今の​サイトの​直しスマホで​崩れる、​遅い、​検索に​出ない。​作り直さずに​直せる​ところから。

作例

A

この​サイト

業務アプリの​受託開発の、​事業の​サイト

ページ
19ページ
確かめた​画面の​幅
320〜1920px
確かめた​ブラウザ
Chrome・​Safari・​Firefox の​3つの​仕組み
動き
スクロールに​合わせた​場面。​動きを​減らす​設定にも​対応

B

紬 TSUMUGI RESIDENCE

架空の​注文住宅ブランドの​作例​（トップページ）

ページ
1ページ、​13の​場面
見出し
縦書きと​明朝で、​和の​落ち着き
動き
ライブラリを​使わない、​軽い​自前の​仕組み
写真
見本の​写真​（実在の​会社とは​関係ありません）

社名・​住所・​数字・​写真の​人物は、​すべて​作例の​ための​ものです。

C

こもれび整骨院

架空の​整骨院の​作例​（トップページ）

ページ
1ページで、​院の​紹介から​予約まで
色
生成り・​若葉色・​桜色で、​やわらかく
写真
丸い​形に​切り​抜き、​木漏れ日の​光を​重ねる
予約
LINEの​予約の​入口を、​いつも​画面の​右下に

院名・​住所・​電話番号・​口コミ・​写真の​人物は、​すべて​作例の​ための​ものです。

D

VANTA ØNE

架空の​ヘッドホンの​商品サイトの​作例

ページ
1ページの​商品サイト
動き
スクロールに​合わせて、​ヘッドホンが​部品に​分かれて​説明が​出る
作り
React と​ 3D の​描画​（Three.js）
色
黒に​黄緑を​1色だけ

ブランドと​商品は、​すべて​作例の​ための​ものです。

どの​サイトにも​入れる​こと

  • スマホでの​見やすさ幅320pxの​スマホから​大きな​画面まで、​崩れないように​確かめます。
  • 検索の​基本の​設定ページごとの​タイトルと​説明文、​検索エンジン向けの​情報​（構造化データ）を​入れます。
  • 表示の​速さ画像を​軽くし、​読み込みの​順番を​整えて、​待たせない​ページに​します。
  • お問い合わせ入力の​確かめと、​届いた​内容の​受け取り方まで、​いっしょに​決めます。
  • あとから​直せる​仕組みお知らせや​メニューを​自分で​更新したい​場合は、​WordPressなどで​作ります。
  • 公開と​保守ドメインや​サーバーの​準備から、​公開後の​小さな​直しまで​お受けします。

業務アプリと​つなげる

サイトの​お問い合わせを、
そのまま​受付の​一覧へ。

業務アプリも​作っているので、​ホームページと​アプリを​つなげて​作れます。​サロンの​カルテでは、​ホームページの​予約フォームから​届いた​内容が、​カルテの​「問い合わせ」に​そのまま​入り、​ボタンひとつで​顧客と​して​登録できるように​しています。

サロンの​カルテを​見る

進め方

  1. 1お話を​聞く誰に​何を​伝えたいか、​参考に​したい​サイトを​伺います。
  2. 2構成と​デザインページの​並びを​決めて、​トップページの​デザインから​お見せします。
  3. 3作るスマホと​PCの​両方で​確かめながら、​全ページを​作ります。
  4. 4公開と​保守公開した​あとの​直しや、​更新の​ご相談も​お受けします。