chevron_left

プロデザイナーが実践するHTML/CSSスキルアップ術

PREMIUM
第1回

プロデザイナーが実践するHTML&CSSスキル向上トレーニング -Wikipedia編-

2014年3月10日 90min

スライド資料

会員登録して、全てのスライドを見よう

1 / 18

授業の概要

「HTMLとCSSの基礎知識はあるけど、その知識をどう応用したらいいのかわからない」
「実際にWebページをコーディングしようとすると指が動かない」

この授業は、こんな悩みを抱えている方におすすめです。

私が本格的にHTMLとCSSを学び始めたのは、2013年の4月から。冒頭に書いた悩みは、初めてWebページを作成しようとした時に私も抱いていました。

そこで、HTMLとCSSスキルを向上させるために始めたのが、今回ご紹介する「HTMLスケッチ」です。
本授業では、実在するWebページをHTMLとCSSを使って自らの手で再現するこの手法を実際に授業で行います。ライブコーディングを見ることでページの構造や成り立ちを理解でき、より実践的な知識に進歩させる一助になるのではないかと考えております。

今回は、世界最大級のインターネットフリー百科事典『Wikipedia 』のWebサイトを題材にしてコーディングのポイントを解説する他、私が実際に使っているショートカットやプラグイン、ツールについてもご紹介する予定です。

新人ならではの視点を活かしてお話しすることで、同じような悩みを持っている方のコーディングスキル向上に少しでも参考になれば幸いです。

※当日書き上げたコードは、GitHub にてご覧いただけます

授業で使用する教材

※授業以外での使用は禁止します