見出し画像

Yahooショッピングのコーディングをした話

現在、通いのHP制作会社ではYahooショッピングのTOPページのコーディングを行っています。

これが、管理画面がなんとも、なんとも……
ユーザー画面でも、オリジナリティを発揮できなさそうなデザインだなぁと思っていたけど、やはりほぼカオスと言っても過言でないような作りになっていた。

なんと言っても、CSSがインラインでしか記述できない……!

トリプルという有料ツールを使えば、CSSファイルもアップロードできるそうだけど、ディレクターさんが有料ツールを使うのはちょっと……
ということなので、やってやりました。
全て、インラインでコード書きました。

使えるタグもかなり限定されてしまってたので、最初は途方もないように感じてしまったけど、幸いclassは記述してもエラーにならなかったので、HTMLで指定して、準備段階としてCSSにスタイルはまず書き出すという作業を行ないました。

そして、再びclassをHTMLから検索して、そこにインラインでCSSファイルに記述したものを複写していくという……

大変だなぁと思ったけど、意外と慣れてくるとそこまでヒドイ作業ではありませんでした。

CSSファイルを使うことの利点である、何回も同じ記述をしなくて良いっていう側面が見事に潰されて、商品リストの部分など、繰り返し出てくるソースに同じCSSを何回も入力するというのが悲しいほどに面倒くさかった……

けれど、最後のbottomだけ余白を大きくしたいなど、一つ一つにスタイルを割り当てられるからこそ、楽になった部分もあったりもした。

hoverが効かなかったり、もちろんJavaScriptも使えなくて、装飾面で通常よりも十分な表現は求められないけれど、まあまあ見栄えのするページには仕上げることができました。

しかし、あれだけ裏がカオスなページでは、もう改修するのも夢のまた夢という感じなんだろうか……
若干、新しめの部分もあるようだったけれど、徐々に移行させる手筈を作ろうとはしているのかな……?


この記事が気に入ったらサポートをしてみませんか?