HANIWAMAN Corp. WEBSITE

Yurisa9862
Front-end developer/ Webデザイナー
OVERVIEW

架空の会社「HANIWAMAN Corp.」のLPサイト制作を実施。コーディングとサイトのアップロードを行った。使用言語やツールは、HTML5＆CSS3／Sass (scss)／jQuery／JavaScript／Visual Studio Code。

「HANIWAMAN Corp. WEBSITE」 を閲覧する →

※Basic認証　　ID：test　パスワード：password


架空の会社「HANIWAMAN Corp.」のLPサイトのコーディングを実施。

Google Mapsの埋め込みや、カードメニューのスライダー（スワイプ動作と、スライダー連動のボタンで任意のカードを選択する動作に対応）、Q&A部分をアコーディオンにするなど、いろいろな機能を設けている。


作業実施箇所

  • （Adobe XDで作られたデザインカンプをもとにした）コーディング
  • サーバーへのサイトのアップロード

使用言語や使用ツール

  • HTML5＆CSS3
  • Sass (scss)
  • jQuery
  • JavaScript
  • Visual Studio Code

ページ数

1ページ（LP）

気をつけた点

  • ピクセルパーフェクトを常に意識し、サイト完成図の画像と適宜照らし合わせ、微調整を行いながら、コーディングを行なった。
  • できる限り保守性の高いコードを書くことを意識し、クラスの命名やタグ構造をどのようにするかについて気をつけるようにした。

利用素材、参考にしたものなど