模写におすすめのサイトについて考える

Flexboxを使ったレイアウトを覚えたので、いざ模写へ。

はじめてだと「模写ってどのサイトをやれば良いんだろう?」って悩む。ちょっと検索すると、「Progateを終えた人が初めて模写するのにおすすめのサイト」と紹介している記事が出てくるが、その中ではいくつかのサイトがよく出てくる。例えばAirBnBのサイトとか、Youtubeでよく勉強させていただいているマナブさんの「Isara」サイトとか。

でも、思った。

実際に仕事で受注するとなると、例えばコーポレートサイトとか歯医者のサイトとかマッサージ屋のサイトとか税理士のサイトとか。知り合いのサイトを作らせてもらうということを想定すると、こんな感じだ。「当院の紹介」とか「サービス内容」「料金表」といったコンテンツがあって、多くの場合は2カラムな気がする。

ということで、実際にお客さんから受注することを前提に、4サイトほど模写をしてみた。

大阪西区針灸整骨院さま

https://nishiku-osaka.com/

はにわまんさま模写サイト

https://haniwaman.com/sample/part3/template_08/

ほづみ歯科クリニックさま

https://www.hozumi-dental.jp/

皮フ科 イガラシ医院さま

http://www.igarashi-iin.com/

この4つのサイトを選んだのに特に理由はない。シンプルなものから段々ややこしそうなものへと進めた。制作者によってコードの書き方が全然違ってとても面白い。まあそのコードがきれいかどうかは分からないので、参考程度にして、基本的には全て自分で組んだ。とりあえず見た目は全て再現できる様になった。

実際に作ってみると「あれ?これはどうするんだろう?」という場面に遭遇する。その数が多い方が成長すると思う。ということで、どのサイトっていうのにはあまりこだわらずに、数をこなすことが大切と感じたよ。(って言ってもまだ4サイトだけど)

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です