Blog

ブログ

ウェビングスタジオのサイトをリニューアルしました

ウェビングスタジオのサイトをリニューアルしました。
bootstrap3ベースのレスポンシブデザインです。スマートフォンでも読みやすくなったと思います。

ちなみにこの記事は、埼玉県大宮市の「コワーキングスペース7F」で書いてます。

今回はデザインだけでなくロゴも差し替え、CMSに関するいくつかのサービスを立ち上げました。これらについても、今後ブログでもご紹介したいと思います。
改めて、このウェブサイトを末永く宜しくお願いいたします。

サイトの完全リニューアルは、2009年11月以来、実に5年ぶりになります。
2011年にマイナーバージョンアップをしていますが、前のデザインが気に入っていたこともあり、なかなか根本からの直しができませんでした。

思い切って手を入れるきっかけになったのが、受注制作以外のサービスの立ち上げでした。
これまでと違って、興味を持ってもらわないといけませんから、自己満足だけのウェブサイトにはできません。すべての要素について、徹底的に見直しをかけました。

以前のトップページ

ビジネスを考えたライティング

リニューアルを機に、屋号のWebでの表記を「カタカナ」に、サイト名を「CMSのウェビングスタジオ」に変更しました。サイト内のメニューも英語をすべて廃し、日本語で統一しています。
予想される顧客は、英語アレルギーな層ではないのですが、SEOや、固すぎない印象を持たせるため、ひらがなを多めにしています。

フレームワーク

今回も引き続きa-blog cmsベースです。a-blog cmsには「bootstrap3」テーマがはじめから含まれていますし、site2014テーマもかなり良く作られていますが、結局自分のワークフローを考えると使用できず、site2014のコードやディレクトリ構成を借用しながら、いちから組みました。

bootstrapも、そのまま使っているわけではなく、768ピクセル以下の段組みの余白を詰めたり、見出しや行間を各画面用に調整しています。
興味がある人は、こちらのbootstrapテーマ用のCSSを見てみてください。

http://webbingstudio.com/themes/webbing201408/resources/css/bootstrap-theme.css

文字サイズと背景色

高解像度の文字サイズを、18ピクセルと、かなり大きくしました。
また、スマホではわからないかもしれませんが、背景色は完全な白ではなく、紙の白になっています。

私自身が老g…げふんげふん視力が落ちてきたため、毎日見るこのサイトは、目の負担が少ないものにしました。

ボタンのアフォーダンス

今はやりのフラットデザインが不満だったので、以前使っていたキーボードと同じ見た目にしました。
サイト内のメニュー、ローカルナビゲーションも「押せる感」を強調しています。


サービスの性格上、どうしてもある程度の長文を読ませなければいけません。
訪問者が、ここで書いたことをまったく意識しないくらい、さくさく読んでくれるのが理想の到達点と思います。