ラベル・シール印刷ページのコーディング業務

概要

株式会社プリントパックにて、ラベル・シール印刷の商品紹介ページ及び、その関連ページのコーディングを担当しました。

関連ページについてはWEBデザインから担当し、コーディング、リリース、Googleアナリティクスによるアクセス解析を実施。ページのボタン配置のテストや導線の改善を行いました。
また、内部SEO対策についてもコーディング段階から実施し、「シール印刷」という検索キーワードで5位まで引き上げました。

基本情報

制作期間	プロジェクトとしては1ヶ月コーディング単体では約1週間打ち合わせは期間として1週間ほど
担当領域	コーディング関連ページのデザイン SEO対策クリック率解析
制作ツール・言語	HTML CSS Sass JavaScript Swiper.js
制作体制	デザイナー1名コーダー1名

工夫した点

制作する際に工夫した点は大きく2つあります。

【❶ユーザーが使いやすい・見やすいサイト作り】

ユーザーの導線を考え、使いやすいページの構成を実装。デザイナーと協議しつつ、ユーザーの行動を考えそれに沿った導線、ボタンの配置を実装しました。

【❷リリース後も管理しやすい基盤づくり】

ディレクトリ階層や修正する方法などをMDファイルで制作し、社内のコーダーと共有。

また、ラベル・シール印刷ページのコーディングはSassによるスタイリングとFLOCSSによるCSS設計を用いたので、Sassの基本的な書き方や、CSS設計の考え方、FLOCSS特有のクラス命名やディレクトリ階層などをZennにまとめ共有しました。

Zennの記事はこちら。