Airbnb-v1.0のサイトを作ってみました。【HTML&CSSの復習】

2019年4月15日月曜日

プログラミング100コード

t f B! P L
Airbnbのサイトはコーディングの復習としても最適です。
今回は、Airbnbの旧サイト(ヴァージョン1.0)を作ってみました。

Airbnb-v1.0のサイトを作ってみました。

旧サイトなので、現在のサイトとは少し違っています。
画像は、フリー画像から「東京の夕景」を取得しています。
取得した画像を圧縮した上で、リサイズしています。

Airbnbのロゴは、ネットから拾ってきたものをJTrimで色付けし透過させています。
本来は有料のソフトで加工するところです。

ちょっと手こずったのは、「Search」の赤いボタン位置です。
微妙にずれてしまい、何度か修正しました。

Airbnb-v1.0のサイトを作ってみました。

初めてクローンサイトを作る人や不安で解説などが欲しい人は、下記のCodingTutsのYouTubeがオススメです。
途中まで見ましたが、配置位置が少し違っていますが、ほとんどこれで上手くいくはずです。
この動画を見てると、プロの人でもやりながらちょっとずつ修正したりを繰り返しながら作っていて、元サイトを見て一発で出来る訳じゃないんだ、と安心できます。

CodingTutsのYouTube









このブログを検索

Translate

QooQ