スイーツ店サイト

【課題・反省】

前回、前々回同様、エビスコムさんの神書籍、HTML＆CSSコーディング・プラクティスブック３を参考にデザインの模写とコーディングしました。

画像は無料の素材サイトから同じものや似たものをダウンロードして、色味補正と調整、すこし明るいイメージになるように加工。XDはまだ勉強中なので、デザインカンプはillustratorで作製しました。

今回は、レスポンシブとダークモードの設定や装飾、画像の配置の仕方がとても勉強になりました。

一通りデザインも模写して、PNGやSVG画像も見よう見まねで自作してコーディングを始めたのですが、店舗名などのSVGデータの表示がうまくいきませんでした。テキストエディタで中身見てみたら、ちょっと内容が違っていたので、おそらくデータの作り方か何かが間違っていたのかなと調べています。何でSVG変換してるんだろう。illustratorでSVG作ったのがいけなかったのかな？XDで作ればうまくいくのかな？とも考えましたがまだ解決していません。

躓いたところもありましたが、作例素材のダウンロードで何とか同じものができました。今回はダークモードのコーディングができるようになることが目的でしたので、とりあえず達成できました。

今回躓いたところはまた調べて解決しておこう。

今年は色んなものどんどん作っていけたらいいなと思います。