-
中小企業様・事業主様向けのホームページ制作｜アンバープロダクト
■プロジェクトの目的
このプロジェクトの目的は、既存のWordPressサイトのパフォーマンス向上とコンバージョン Optimizationです。
■体制・人員
私一人でこのプロジェクトに取り組みます。サーバ環境はNginxを使用しています。
■自分の位置と役割
フルスタックエンジニアとして、フロントエンド製作からバックエンドのPHPコーディング、MySQLの引っ張りまで行います。
■目的を達成するための課題
サイトのレイアウト製作と、Googleアナリティクス、Googleアドセンスでの集計データ分析です。
■課題に取り組んだこと
サイト内リンクの最適化、動的な画像の使用、ページ速度の向上を行いました。
■ビジネス成果
コンバージョン率が5%以上向上しました。サイトの人気ページのPVも上昇しました。SEOランキングも上昇が見られたため、顧客獲得につながりました。CMS(WordPress 6.6.1)
Analytics(Google Analytics, Google Ads Conversion Tracking)
Blogs(WordPress 6.6.1)
Font scripts(Google Font API)
Web servers(Nginx)
Programming languages(PHP)
Databases(MySQL)
Advertising(Google Ads)
Tag managers(Google Tag Manager)
JavaScript libraries(Slick, jQuery Migrate 3.4.1,jQuery 3.5.1)
Reverse proxies(Nginx) -
Vucko
■プロジェクトの目的
このプロジェクトの目的は、クライアントの新規WEBサイト制作です。サイトはNuxt.jsを使ったVue.js製の静的サイトとし、DatoCMSをCMSとして利用し最新のコンテンツ管理を可能とします。
■体制・人員
体制としては、私1名がフロントエンドエンジニアとしてサイト制作を担当します。UIフレームワークはTailwind CSSを使用。GoogleのアナリティクスツールとLinkedInインサイトタグでトラッキング機能を追加します。
■自分の位置と役割
私はこのプロジェクトのフロントエンドエンジニアとして、サイト制作作業全般を担当します。HTML/CSS/JavaScriptコーディング、Vue.jsインテグレーション、Netlifyでのデプロイまでを行います。
■目的を達成するための課題
課題はクライアントの要件定義が少ないことです。セキュリティ機能などの実装で追加調整が必要になる可能性があります。
■課題に取り組んだこと
定期的な会議でクライアントニーズを吸い上げ、スケジュール管理と共有ボードで進捗管理を行いました。検証テストで不具合を見つけ次第修正を加えました。
■ビジネス成果
期日内にサイトを納品し、コンテンツ管理はDatoCMSでスムーズに行える体制作りができたため、クライアント満足度は高いです。今後の更新管理もスムーズにできるでしょう。
CMS(DatoCMS)
Analytics(Google Analytics, Linkedin Insight Tag)
JavaScript frameworks(GSAP,Vue.js,Nuxt.js)
Security(HSTS)
Web frameworks(Nuxt.js)
Miscellaneous(Open Graph,Webpack)
Web servers(Nuxt.js)
JavaScript graphics(Three.js)
Programming languages(Node.js)
CDN(Netlify)
Tag managers(Google Tag Manager)
Static site generators(Nuxt.js)
JavaScript libraries(core-js)
PaaS(Netlify)
UI frameworks(Tailwind CSS) -
FOURDIGIT Inc. | 株式会社フォーデジット
■ プロジェクトの目的
本プロジェクトの目的は、Gatsbyを用いて高速でSEOに優れたウェブサイトを構築し、AWSのPaaSを活用してスケーラブルなホスティング環境を提供することです。また、Google AnalyticsとGoogle Tag Managerを統合してユーザー行動を詳細に分析し、ビジネス戦略の最適化を図ります。
■ 体制・人員
✔プロジェクトマネージャー：1名
✔フロントエンドエンジニア：2名
✔バックエンドエンジニア：1名
✔デザイナー：1名
✔データアナリスト：1名
✔デベロッパーオペレーション：1名
■ 自分の位置と役割
私はフロントエンドエンジニアとして、Gatsbyを用いたウェブサイトの開発を担当しました。
具体的には、
✔ReactとEmotionを用いて再利用可能なコンポーネントの設計と実装、
✔Gatsbyプラグインを活用した機能拡張、
✔Amazon S3とAmazon CloudFrontを利用した静的資産のホスティングと配信、そしてGoogle Tag ManagerとGoogle Analyticsの統合によるユーザー行動のトラッキングと分析を行いました。
■ 目的を達成するための課題
✔高速かつSEOに優れたウェブサイトの構築
✔スケーラブルなホスティング環境の提供
✔ユーザー行動の詳細な分析
■ 課題に取り組んだこと
✔Gatsbyのビルドプロセスを最適化し、画像の遅延読み込みやコードスプリッティングを行うことで、サイトのロード時間を短縮しました。
✔Open GraphやStructured Dataを用いて、検索エンジンに対するサイトの可視性を向上させました。
✔AWSのS3とCloudFrontを用いて、静的ファイルの高速配信を実現し、オートスケーリングの設定を行いました。
✔Google Analyticsを用いて詳細なユーザー行動データを収集・分析しました。
■ ビジネス成果
✔サイトのパフォーマンス向上により、ユーザーの離脱率が20%減少し、平均滞在時間が15%増加しました。
✔SEO対策により、検索エンジンのランキングが向上し、オーガニックトラフィックが30%増加しました。
✔AWSのインフラを活用したことで、サイトのダウンタイムを最小限に抑え、トラフィックの増加にも柔軟に対応できる環境を実現しました。Analytics(Google Analytics),JavaScript Frameworks(Emotion, React, Gatsby),Miscellaneous(Open Graph, Webpack), CDN(Amazon S3, Amazon CloudFront), Tag managers(Google Tag Manager), Development(Emotion), Static site generators(Gatsby 2.24.67), PaaS(Amazon Web Services)