Web Design

カフェのサイトをwordpressでリニューアル制作しました。その時の覚書


みなさんこんにちは、mayukouです。
さて、今回はwordpressのお仕事実績のご紹介です。
ブログCMSであるWordpress のメリットといえば、
一度構築してしまうとあとはhtml の知識がなくても、誰でも更新ができるところ。

クライアントさんが更新できるので、やりとりの手間が省けます。
その代わり、htmlサイトよりもサイト構築には時間と労力がかかります。

身内が東京新宿に開いているカフェが先日3周年を迎え、
その機会に合わせてリニューアルさせていただきました。
仕事の合間をぬっての製作だったこともあり、
レスポンシブ対応などまだ構築中の部分もありますが、温かい目で見ていただけたらと思います。

今回はそんなサイトの紹介と工夫した点などをご紹介したいと思います。

スポンサードリンク

今回製作したお店・カフェアリエとは

新宿の大久保に、隠れ家のように佇むカフェです。
日本の有名な建築家である磯崎新の処女作で有名な建物を使用しています。
今では、そんな隠れ家的カフェとして親しまれているようです。
ハーブティーも取り扱っています。今回製作したサイトはこちら↓

65-cafearie

カフェアリエサイトはこちら
http://cafearie.com/

作業工程は、

デザイン→コーディング→wordpressに組み込み→本番サーバーにアップ

の順番です。

工夫した点

デザイン面

すっきりと白ベースのシンプルなデザインで見やすくし、
その中でも手書き感を取り入れました。
カフェアリエのシンボルでもあるアイビー(植物)をあしらいました。

コーディング面

勉強のためCSSと同時にSASS (CSSメタ言語)を使用。
※SASSについては後日ブログで紹介予定です^^

WordPress面

WordPress でニュースの更新、その他のページの書き換え、修正が可能。
フッターはウィジェットにしているためここも書き換え可能。
メニューページ部分は、簡単にメニュー名が追加できるsmart custom fieldsを使用。

65-cafearie-wp

66-menu

大変だったところ

wordpressサイトをローカル環境からサーバーの方に移行するのにDuplicatorプラグインを使用したのですが、
うまくwordpressに移行できなくなり、
間違って以前のイベントのブログを消してしまいました。
バックアップは取っていたものの、wordpressのバージョンが低かったためうまく復元せずに焦ってしまいました。
復元できなかったとき、血の気がサーっと引いていきました。
wordpressの先輩に助けてもらいなんとか復活することができました。
本当に感謝です。

これから注意しておきたいこと

・Wordpress の場合、念のため最新バージョンにしてバックアップを取ること。
・Duplicatorの仕様に慣れる。
・焦りすぎない。スケジュールは余裕を持ち、早めに作業に取り掛かること。

最後に

いかがでしたか?
wordpress案件、今回の気づきを糧に今後も請け負っていけたらいいなと思います。
まだまだ勉強の身ですが、今回のサイト製作はとても勉強になりました。

投稿者プロフィール

mayukou
mayukou
Webデザイナー修行中のmayukouです。webデザインのお仕事を始めて約4年が経ちました。ここでは、仕事で得た知識やお役立ち情報をご紹介いたします。宜しくお願いします。水彩画を勉強中です。趣味は音楽鑑賞(洋楽)、料理、読書、ブログです。
詳しくはこちら

関連記事

  1. Web Design

    webデザインのトレンドと取り入れよう!デザインの参考になるwebリソース 〜海外編〜

    みなさんこんにちは、mayukouです。あっという間に土曜の半日が…

  2. Photoshop

    Photoshop の水彩画ブラシで描いた植物イラストのご紹介

    みなさんこんにちは、mayukou です。肌寒いような暖かくなった…

  3. お仕事紹介

    お仕事紹介:保育園のお祭りパンフレットを作りました!

    みなさんこんにちは、mayukouです。過ごしやすい日が続きますが…

  4. Web Design

    今すぐできる!HTMLメールの作り方

    みなさんこんにちは、mayukouです。ECサイトを運営していると…

  5. jQuery

    軽量のスクリプトで簡単に!レスポンシブメニューを実装できるResponsive Nav

    みなさんこんにちは、mayukouです!今回は、うちのブログで…

  6. Web Design

    自分の頭をデザイン脳に!CSS nite fukuoka vol.8に参加しました

    みなさんこんにちは、mayukouです。このあいだ1月に行われたセミ…

コメント

  • コメント (0)

  • トラックバックは利用できません。

  1. この記事へのコメントはありません。

CAPTCHA


スポンサー

instagramもやっています

最近の記事

  1. かすれや濃淡が出る!かわいい手描き感のあるブラシのご紹介♩(…
  2. 今や欠かせない存在!iPad Pro “9.7を…
  3. iPad Proを液タブに♫Astropad Studioは…
  4. 明けましておめでとうございます。今年の抱負
  5. 食べ物やブツ撮りにおすすめ♩PENTAXのパンケーキレンズ(…

facebook更新中!

  1. お仕事紹介

    【お仕事紹介】学生向けアンケートパンフレット作りました
  2. iPad Pro

    iPad Proを液タブに♫Astropad Studioはイラストレーターには…
  3. wordpress

    wordpressバックアップツールの決定版!All in one Migrat…
  4. ブログ

    webデザイナー4年目!その間に身につけたスキル
  5. デザイン

    おすすめ!かすれたロゴに最適なスタンプ風なフリーフォント
PAGE TOP