おためし受講中

HTML/CSS実践 シングルページの作成 〜パーツの作り込み〜

この授業ではHTML/CSSを用いたWEBページの作り方が学べます。実際に1つのWEBページを作成することで、基本的なレイアウトとコーディング方法を身につけましょう。

■ 事前準備

この授業では下記ソフトウェアを使用します。事前にインストールしておいて下さい。

GoogleChrome
https://www.google.co.jp/chrome/browser/desktop/index.html
・人気のWebブラウザです。Windows/Mac両方で利用可能で、JavaScriptの開発に便利な機能を持っています。

Sublime Text
http://www.sublimetext.com/
・人気のテキストエディタです。Windows/Mac両方で利用可能で、JavaScriptの開発に便利です。
使い慣れているエディタがあれば、そちらをご利用いただいても構いません。


またこの授業はHTML/CSSの知識を前提としています。
自信の無い方は、下記コースを受けてみてください。
HTML入門(全3回)
CSS入門(全3回)

学生代表

  • 未定

    未定

【ノート機能】
授業内容や覚えておきたいポイントなど、ノートに自由に残せます

再生位置挿入 資料挿入
筆記アシスト
ONOFF
    【チャプター機能】
    授業内容をピンポイントでおさえながら
    ご自身のペースで進めることができます
    【前半】授業
    自己紹介&アジェンダ
    00:43  (00:13 ~ )
    仕上げ
    05:00  (00:56 ~ )
    オススメサイトの紹介:文法チェック
    05:02  (05:56 ~ )
    オススメサイトの紹介:画像素材
    02:35  (10:58 ~ )
    オススメサイトの紹介:リファレンス
    03:10  (13:33 ~ )
    【後半】質疑応答
    Q:時によってどんどん代わって行くと思いますが、モダンブラウザの中で、Firefoxが標準対応が進んでいると聴きます。実際開発をされている方が作業時のメインブラウザとしては、実際どうなのでしょうか?
    02:48  (18:16 ~ )
    Q:サンプルはimgタグをpタグに入れた構成でしたが、人によってdivやpに入れないでそのままのコードがあります。本来どちらが良いのでしょう。いつも迷います。
    00:56  (21:04 ~ )
    Q:今回のシングルページのサイトを作る時に、デザインカンプ的な物は作成しましたか?
    00:04  (22:00 ~ )
    Q:navなどのulで、私はliの中に直接aタグを入れているのですが、先生はpタグで囲われているのは何か理由がございますか?
    01:21  (22:04 ~ )
    Q:今回シングルページでしたが、複数ページを作る場合の共通項目(meta要素、タイトル、メニューやタイトルなど)はどういった書き方をされていますか? コードをページそれぞれにコピペすると修正があったときに大変なので、phpであればincludeで読み込んだりしているのですが、htmlで良いやり方があれば教えてください。
    01:43  (23:25 ~ )
    Q:後方互換はどの程度まで意識していますか?
    02:06  (25:08 ~ )
    Q:サンプルファイルのcssで、 ul.photo_image li の word-wrap:break-word; って説明ありましたでしょうか?
      (27:14 ~ )