Works

制作物

リスティングプラス 様(模写コーディング)

listingplusスクショ
概要
リスティングプラス様のサイトを模写コーディングさせていただきました。

※模写コーディングのルール

  • 素材の利用OK
  • 幅・余白・色の確認はOK
  • フォントサイズの確認もOK
URL
リスティングプラス様(TOPページ)

BASIC認証を掛けています。

ID・Passwordともに[mosya]です。

レスポンシブ
スマートフォン・タブレット・PC
利用技術
HTML / CSS / jQuery
制作で得たこと
  • 作り終えた感想としては、とても長いページのサイトで、根気の必要な制作でした。
  • 画像がふんだんに使用されているサイトで、画像の位置やz-indexの順序をコーディングするのに苦労しました。
  • お問い合わせフォームはこれまでコーディングする機会がほぼなかったので、この機会に復習することができました。
  • 背景のデザインにて、background-repeat: repeatを使用して画像をタイル状に並べる方法を知ることができました。また、見出しにもリボンのような、親要素から両端はみ出したようなデザインにも苦労し、calcを使用したデザインの存在も知ることができ、学習において収穫が多かった模写コーディングになりました。
  • レスポンシブ対応で、デザインに大きな変化はありませんが、縦に長いサイトですのでやはり時間がかかってしまいました。このサイトをコーディングさせていただいた頃には、Sassの存在を知らなかったので後で後悔した記憶があります。


Contact

お仕事のご依頼・ご相談などございましたら、お問い合わせフォーム
もしくはTwitterのDMにてお気軽にお問い合わせください!

必須 お名前

必須 メールアドレス

任意 題名

任意 メッセージ本文

© Portfolio - Kei Watanabe