HTML&CSSでWebサイトを作ってみよう!

コーディングの流れを確認しよう

全333コースを10日間無料で

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
一般的なWebサイトのワークフローを確認します。このコースでは、まずHTML、そしてCSSをコーディングしていきます。
講師:
03:01

字幕

このレッスンではコーディングの流れについてご紹介します。コーディングはまず HTML でマークアップすることから始まります。テキスト原稿といって、例えばクライアントからホームページを作りたいと言われましたらまずテキストの原稿を用意します。もしくはヒアリング、聞き込みを行ってどのような文章をホームページに掲載するかを決めた内容がテキストの原稿ということになります。こちらを HTML で文書構造化する、つまりどれが一番大切なメッセージでそしてどのように文章の順番を変えていけば伝わるようなメッセージになりそしてつながっていくのかという風に構造化していきます。そして画像を配置するのもHTML の役割ですのでPhotoshop や illustrator などでデザインして作った画像をHTML 上に並べていきます。そして CSS で装飾します。CSS はレイアウトをまず行います。ボックスというのは CSS で幅や余白をコントロールするということです。そして色味・文字サイズなどを調整することで最適なデザインにしていきます。それでは demo のファイルを見てどちらが HTML 、どこが CSSというのを見ていきましょう。 それではレッスンファイルのflow というフォルダの中のindex.html をChrome で開きます。このようなサイトになっていますが文字として読めるところはすべて HTML の役割だと思ってください。HTML は情報です。情報と見た目をハッキリ分離するというのがウェブデザインでは大切です。スクロールしていきますと、例えば文字に色が付いています。例えばこのサービスにマウスを重ねると少し文字色が明るくなります。これはリンクになっているのをわかりやすくするためにCSS で装飾をしています。このように見た目で分かりやすくという機能はCSS で調整をしていきます。こういった見出しの余白であったり罫線であったり背景のワンポイントの画像であったりこういった物は情報ではなく飾りなので、 CSS で記述をしていきます。このレッスンでは HTML と CSS のコーディングの流れをご紹介しました。

HTML&CSSでWebサイトを作ってみよう!

HTMLとCSSについての断片的な知識だけではウェブサイトを構築することはなかなか難しいでしょう。そこでこのコースでは、架空のサイトを実際に構築しながら、シチュエーションに合わせたHTMLとCSSの使い方について学んでいきます。実際のWeb制作の現場でどのようにHTMLとCSSが使われているかを確認しながら、実践的なスキルを習得しましょう。

3時間28分 (31 ビデオ)
現在、カスタマーレビューはありません…
 
ソフトウェア・トピック
価格: 2,990
発売日:2014年03月19日
再生時間:3時間28分 (31 ビデオ)

このコースは、「オンデマンド」でご利用可能であり、ダウンロードすることもオンラインで見ることもできます。

ダウンロードすると、オフラインでコースを使用し、豊富なインターフェースをフルに活用できます。複数のデバイスを使用したり、 一度に全コースをダウンロードしたくない場合は、アカントにログインして、ストリーミング・ビデオとしてコースのレッスンを視聴してください。

ビデオトレーニングをお楽しみいただけますように! お問い合わせは、cs-jp@lynda.com宛までご連絡ください。