Sharena（シャレーナ） | Webサイト制作

今ご覧いただいている、このWebサイトです。ずーーーっと前からリニューアルしたかったのがやっと実現しました。

前回と同じ色・同じデザインフォント（Adobe FontsよりMostra Nuova）を使うなど、今までのデザインを元にブラッシュアップしました。よりシンプルで、私好みのデザインになったと思います。最も魅力的に見せたいのは制作実績の画像なので、サイトデザインはシンプルが良いのです。ベースはシンプルかつ機能的、少しお洒落なスパイスが効いたようなデザインが好みです。

今回のサイトデザインにおけるスパイスは2つあります。

1つ目は、ファーストビューの時間経過で色の変わる背景です。特にそこを目立たせたいわけではないので、さりげない色の変化ですが、ふと目にしたときに「あれ？色変わってる？」と、少しサプライズがあると面白いと思いました。

2つ目は、見出しやホバーアクションに取り入れた版ズレ風デザインです。版ズレ風、可愛いですよね！完全に私の好みですね（笑）

今回のWebサイト制作にあたり、2つの挑戦をしました。

1つ目は、WordPressを使わずに、NEWSやWORKSの記事を管理することです。

このサイトは、HTMLとCSS・JavaScript・PHPで制作しました。WordPressは便利なのですが、使わない機能があったり、たくさんファイルがあったり、無駄が気になってしまって（ゆるミニマリストです）。

自分用なので最低限の機能ですが、無事に記事の管理と、ページネーションもPHPで実装できたのが嬉しかったです。

とはいえ、記事のデータベース化は今回できなかったので、また追々挑戦したいと思います（マグ名刺のWebサイトもリニューアルしたいと、ずーーーっと思っています）。

2つ目は、jQueryを使わない（=Vanilla JS、素のJavaScriptを使う）ことです。

このサイトでは、お問合せフォームを除いたほとんどのページでjQueryを使わず、素のJavaScriptを使っています（お問合せフォームはFIRSTSTEP様のレスポンシブ メールフォームを使わせていただいております。いつもありがとうございます。あんな風に色々開発できるようになりたい、と憧れています）。

JavaScriptを理解した上でjQueryを使う分には何も問題ないと思うのですが、私はそうではなかったのです。ネットや本に書いてあるコードをコピペしたりアレンジしたりして使っていましたが、そのコードのどの部分がjQueryで、どの部分がJavaScriptなのか？理解していないがために、無駄なコードを書いているのではないかと思い、JavaScriptの学習を始めました。

今回、素のJavaScriptでのコーディングに挑戦してみて、とても勉強になりましたし、なにより楽しかったです。こういう動きをつけたい、と思ったことが実現できたときの喜びや達成感は格別です。今後も益々研鑽を積み、仕事に活かせるように励みたいと思います。

シャレーナは、デザインとサポートを軸に事業を行う個人事務所です（インボイス制度の適格請求書発行事業者登録済）。主にマグネットの名刺「マグ名刺」の製作・販売や、ロゴマークや各種印刷物のデザイン、Webサイト制作、事務作業のサポートなどをしています。

Webサイト制作においては、基本に忠実なコーディングを心掛けています。適切なHTMLタグを使ってコーディングすることで、検索エンジンのクローラーにコンテンツを伝えやすくなり、SEO効果を高めることができます。

また、一人のWebデザイナーが全ての工程を担当するため、一般的な制作期間よりも長い日数がかかりますが、良心的な制作料金でご提供できていると思います（料金表はこちら）。

「シンプルで機能的なデザインのWebサイトを、できるだけ費用を抑えてつくりたい」そんな貴方からのご依頼をお待ちしております。

※記事の内容は制作当時のもので、最新の情報と異なる場合があるため、必要に応じてご確認ください。