多田 吉宏

業務委託のデザイナーと協力してネットショップのリニューアルを行いました。デザイナーにはfigmaでカンプ案作成依頼をして、私はディレクション・サイトパフォーマンスやメンテナンス性も意識したコーディングを行いました。特に注力した点は以下です。 ・jsの記述を最小化 近年はjsを記述しなくてもhtml/cssで似たような振る舞いを実装できることが増え、それらの内容を取り込みました。静的サイトですと、jsの記述が増えるとメンテナンス性やサイトのパフォーマンスが落ちるのでそのあたりを意識しました。 例)タブの切り替え、アコーディオンパネルなど ・jqueryの排除 以前はスライドにjqueryとslickが使われていましたが、リニューアルでは使わない方がいいと思い、swiperとVanilla jsで代用しました。どうしてもjqueryを使うと読み込に負荷がかかりがちなのでそれを回避しています。 ・apiの活用 ドメイン/blog にて、オウンドメディアをWordPressを利用して展開しています。WP APIを用いてカテゴリ記事のタイトル及びリンクを表示させています。 また、Instagram graph APIを用いて当社アカウントの投稿を表示させています。 ・データ分析及び上位検索キーワードの上位表示 GA4と連携させたLooker Studio を利用してサイト内検索の上位を分析しています。サイトトップにキーワード候補を表示させ、定期的に更新することでお客様のユーザビリティを向上させています。※データ分析に関しては、その他、各メディア媒体からのアクセス数やコンバージョンなども計測。GASを利用して1日毎にスプレッドシートに主要な計測値を吐き出す仕組みも作っています。