HTML・CSSの入門・基本・基礎トレーニング・講座

イマジカデジタルスケープ 短期集中クリエイティブ講座

イマジカデジタルスケープ・AfterEffects・Photoshop・HTML・CSS・JavaScript・1日トレーニング

Web・動画・映像・ゲーム・DTP・CG・Adobe Creative Cloud・キャリア・就活に

【次回オンライン開催】 HTML・XHTML・CSSの基礎知識〜これからWebサイトを作る方へ! |価格:13,200円より|

アドビ一覧 > 【次回オンライン開催】 HTML・XHTML・CSSの基礎知識〜これからWebサイトを作る方へ! |価格:13,200円より|

HTML/XHTML/CSSの基礎知識

講座概要

このトレーニングでは、HTMLとCSSの書き方と文法を理解し、実際に複数ページで構成されたWebサイトを作りながら、Webサイトが出来上がる一連のプロセスを学習します。

Webページのレイアウトは、div要素とCSSのfloatを使用したレイアウト方法から、CSS3.0でのレスポンシブWebデザイン(可変幅ページ)に対応するdisplayを使用したレイアウト、HTMLメールなどで使用するテーブルレイアウトなどがありますが、このトレーニングでは、それぞれがどのように異なるかを学習した後、主にdiv要素とCSSのfloatを使用したレイアウト方法を学習しながら、タグの使い方やCSSのセレクタ、プロパティなどの意味や用法を学習していきます。

Adobe製品と連携してWebサイトを作成していく場合、XDやPhotoshopなどを使ってWebページのプロトタイプや素材を作成し、Dreamweaverなどのビジュアルエディタで完成品に作り上げていく、というプロセスもありますが、これらのアプリケーションの根底で動いているものは、HTMLとCSSになるため、アプリケーション操作のみでWebサイトを作成されても、根本となるソースの理解が無いと、Webページ上に不具合等が発生した場合に、アプリケーションでのオペレーションミスなのか、ソースに誤りがあるのか、などの判断がつかなくなります。

また、WordPressなどのCMSやASPなどを使用し、ソースをまったく意識せずにWebページが出来上がる仕組みが当たり前になっている今、ブログなども記事を投稿するだけで簡単にページが出来上がってしまいますが、必要な個所に修正を加えてカスタマイズする場合や、また実際の制作現場では、HTML・CSSを直接記述して修正することが多いのが現状です。そのため、CMSやASPなどのサービスの理解や、アプリケーションの使い方と並行して、HTML・CSS等のソースの知識・理解はどうしても必要になります。

このトレーニングでは、各要素の使い方と文法を学習し、複数ページのWebサイトを作成するプロセスを踏むことで、自分自身で作成したページだけではなく、他のWebサイトのHTML・XHTML・CSSが読めるようになり、以降は自分で調べて学習を継続していける力を身につけることを目的としています。

このトレーニングの受講後は、JavaScriptやHTML5・CSS3の基礎知識、jQuaryなどの学習ステップを踏んでいくと、よりWebサイト制作に必要な理解が深まるでしょう。

期待される効果

  • タグになれていない方も、よく使うタグを効率的に覚えることができます。
  • CSSの基本からレイアウトするための基礎知識を習得することができます。
  • テーブルレイアウト、floatによるレイアウト、CSS3でのレイアウトなどのレイアウトの違いが理解できるようになります。
  • アプリケーションに依存しない、Webサイトを作成するための基礎力をつけることができます。

受講対象者

  • Dreamweaverなどのアプリケーションスキル以外に、コードも読めるようになりたい方
  • HTML・XHTMLのタグをきちんと理解したい方
  • CSSレイアウトをマスターしたい方
  • デスクトップ上の、以下の操作が「円滑」に行える方
    トレーニングでは、HTMLやCSSソースの入力作業が多く含まれるため、特に文字入力にあまり自信の無い方や、コピーペースト、デスクトップ上でのファイルの複製等の操作に不慣れな方は、これらの操作に十分慣れてからご受講いただけますようお願いいたします。

    ・テキスト入力(和文・欧文・英数・記号などの入力)
    ・かなと英数の切り替え
    ・ファイルを開く・閉じる
    ・ファイル名、フォルダ名の変更
    ・ファイルやフォルダの階層移動
    ・文字のコピーペースト
    ・フォルダ間やデスクトップへのファイルのコピー・複製
    ・アプリケーションの最小化・最大化等に関する操作
    ・ドラッグアンドドロップなどの操作

受講者へのメッセージ

アプリケーションを使ったWebサイト制作になれている方や、初めてWebサイトを作る方は、HTMLやXHTML、CSS等は言葉ではわかっていても、実際にタグそのものの意味や使い方が曖昧な方もいらっしゃるかと思います。このトレーニングでは、言語レベルで(X)HTMLを習得し、アプリケーションに依存せずに、コードの記述ができるようになり、必要なときに必要なコードを調べられる力がつくようになるトレーニングです。Webサイト制作の最初の一歩としてご受講ください。

伊藤 和博

株式会社イマジカデジタルスケープ
トレーニンググループ・トレーニングディレクター

講師歴25年。講座開発数200以上。
総合商社のスクールでMac/Winを使ったDTP/Webトレーニングスクールの業務全般を担当。大手PCメーカー、プリンターメーカー、化粧品メーカー、大手印刷会社、大手広告代理店、新聞社、大手玩具メーカー、大学、官公庁、団体などに向けたトレーニングなど幅広い企業の人材育成に携わる。
現在は、イマジカデジタルスケープにてAdobeCCを中心としたトレーニングの企画、講師を務める。Adobe認定エキスパート、アップルコンピュータ認定技術者、CIW JavaScript Specialist、CIW Web Design Specialist。

開催日時

開催日 時間
【次回オンライン開催】 10:00〜17:00

会場

イマジカデジタルスケープ・トレーニングルーム

住所:東京都渋谷区道玄坂1-10-8 渋谷道玄坂東急ビル8F (JR「渋谷」駅西口より徒歩5分、国道246号沿い)

[ MAP ]

カリキュラム

(X)HTML
  • (X)HTMLとは何か
  • (X)HTMLの記述方法
  • URLについて
  • (X)HTMLファイル注意事項
  • Webサイト 作成の概要
  • (X)HTML基本構造
  • (X)HTML基本構造の記述
  • カラーついて
  • 見出しと見出しタグ
  • 表示位置の調整
  • 文字修飾 (サイズ・カラー・指定)
  • 文書整形 (段落・改行)
  • 箇条書き(リスト)
  • ディレクトリ指定に関して
  • 絶対パス指定 と相対パス指定
  • ローカルサイトの作成
  • 画像(表示・回り込み・マージン)
  • 代替テキスト
  • 表組
  • リンク
CSS
  • CSSの書き方(直接記述と外部ファイル)
  • フォントの設定
  • 背景画像の挿入と繰り返し
  • ボックス(ボーダー・余白の設定)
  • クラス名
  • SPAN
CSSデザイン
  • 背景色
  • リストのデザイン
  • 回り込みと解除
  • div(グループ化・段組・フッター)
  • リンクテキストの装飾
  • 表の装飾

テキスト

オリジナルテキストを使用。受講料に含まれているのでお得です!

持ち物

  • 受講票(プリントアウト環境が無い場合には、携帯・スマートフォン等への画面コピーでも可)
  • 筆記用具

※データの持ち帰り、データの持ち込みはできません。

使用アプリケーション

  • Crescent Eve(Windows)(フリーウェア)
  • mi(Mac) (フリーウェア)
  • Google Chrome
  • Firefox
  • Safari
  • EdgeまたはInternet Exploer

使用端末

WindwosまたはMacintosh(お申込みまたは受講時に選択できます)

【Macintoshの操作に不安のある方へ】



     

【次回オンライン開催】 HTML・XHTML・CSSの基礎知識〜これからWebサイトを作る方へ! |価格:13,200円より|

【次回オンライン開催】 HTML・XHTML・CSSの基礎知識〜これからWebサイトを作る方へ! |価格:13,200円より|

価格
円(税込)
数量

▼ 下記商品リストからご希望の商品をお選びください。
受講種別 x 端末

WindowsMacintosh
26,400円:一般
13,200円:学割(大学生・大学院生(要学生証))

オンライン受講(ライブ配信)のトレーニングをお申込みの方で、iPadレンタル込みの商品を選択された方は、【iPad・往復配送料】【iPad・損害補償】も合わせてお申込みいただきます。

※学割(大学生・大学院生(要学生証))とは、満29歳までの大学生・大学院生・専門学校生の方をいいます。ご受講の際、年齢が確認できる身分証明証及び在学中であることが確認できる学生証が必要になります。

※当サイト内の会員登録とイマジカデジタルスケープ求人サイトへのご登録とは別の登録となります。会員登録につきましてはご利用案内をご確認ください。

⇒受講種別について
⇒お申し込みが開催日直前の土日祝祭日、年末年始の場合はこちら

 

ご注文手続きへ

★☆受講者の声☆★

  ニックネーム : 評点 :
内容 :
[書き込み]

 
 
ニックネーム内容評点日付
 
N.Y職業訓練校で習ったことの復習の機会となったほか、習ってい...2021/07/08
 
H.K実務でも使える知識をたくさん教えていただけてよかったです...2021/03/03
 
S.A今までスクールで学んだことは「覚えるだけ」だったのですが...2021/03/03
 
M.SHTML5やCSS3は勉強してきましたが、HTML4やXHTML、CSS2は学...2021/01/08
 
Y.T久しぶりにソースコードを手打ちして、すごくためになりまし...2020/12/04
 
K.F訓練校での授業では割愛されていた部分など、この機会に詳し...2020/12/04
 
Y.Ohtml4の基礎知識があるとなお良いという状況でしたので良い...2020/09/15
 
S.OHTMLやCSSを使用した仕事はしていましたが、head内のmeta情...2020/08/06
 
M.Oトレーニング中に説明のあった内容のほか、SEO対策について...2019/06/10
 
A.N最後駆け足での説明だったのが少し残念でしたが、総じてよか...2019/06/10
 
K.Y説明を聞いた後に実際に自分でやってみるという流れだったの...2019/05/20
 
Y.H普段なんとなくこんな意味かなと思っていたタグなどの本来の...2019/05/20
 
A.H基礎から教えてもらえたので、今までなんとなくで触っていた...2019/03/11
 
M.Kすごぐ親切に教えて頂き、非常に分かりやすかったです。あり...2019/02/13
 
N.U10年前のHTMLの知識しか無かったので、昔と比べて今のHTML4....2019/02/13
 
  page / 6 [次]

その他のオススメ講義

Webデザイン

11/18(木)〜19(金) HTML・XHTML・CSSの基礎知識(2日間・オンライン受講(ライブ配信)) |価格:19,800円より|

11/18(木)〜19(金) HTML・XHTML・CSSの基礎知識(2日間・オンライン受講(ライブ配信)) |価格:19,800円より|

39,600円(税込)

11/9(火)〜10(水) JavaScriptの基礎知識(2日間・オンライン受講(ライブ配信)) |価格:19,800円より|

11/9(火)〜10(水) JavaScriptの基礎知識(2日間・オンライン受講(ライブ配信)) |価格:19,800円より|

39,600円(税込)

11/12(金) Adobe XDの使い方・基本トレーニング(1日間・オンライン受講(ライブ配信)) |価格:13,200円より|

11/12(金) Adobe XDの使い方・基本トレーニング(1日間・オンライン受講(ライブ配信)) |価格:13,200円より|

26,400円(税込)

【次回オンライン開催】 HTML5・CSS3の基礎知識(PC・スマートフォン) |価格:13,200円より|

【次回オンライン開催】 HTML5・CSS3の基礎知識(PC・スマートフォン) |価格:13,200円より|

26,400円(税込)

【次回オンライン開催】 Adobe XDの使い方・基本トレーニング |価格:8,800円より|

【次回オンライン開催】 Adobe XDの使い方・基本トレーニング |価格:8,800円より|

17,600円(税込)

【次回オンライン開催】 JavaScriptの基礎知識 |価格:13,200円より|

【次回オンライン開催】 JavaScriptの基礎知識 |価格:13,200円より|

26,400円(税込)

【近日開催予定】 情報セキュリティ入門 〜『情報セキュリティマネジメント試験』直前講座〜 |価格:10,000円より|

【近日開催予定】 情報セキュリティ入門 〜『情報セキュリティマネジメント試験』直前講座〜 |価格:10,000円より|

20,000円(税込)

【開催終了】 Dreamweaver CC 2015の使い方・基本トレーニング |価格:13,200円より|

【開催終了】 Dreamweaver CC 2015の使い方・基本トレーニング |価格:13,200円より|

26,400円(税込)

【CC開催終了】 Dreamweaver CC の使い方・基本トレーニング |価格:12,960円より|

【CC開催終了】 Dreamweaver CC の使い方・基本トレーニング |価格:12,960円より|

25,920円(税込)

【CS6開催終了】 Flash Professional CS6 の使い方・基本トレーニング |価格:12,600円より|

【CS6開催終了】 Flash Professional CS6 の使い方・基本トレーニング |価格:12,600円より|

25,200円(税込)

【CS6開催終了】 Dreamweaver CS6 の使い方・基本トレーニング |価格:12,600円より|

【CS6開催終了】 Dreamweaver CS6 の使い方・基本トレーニング |価格:12,600円より|

25,200円(税込)

【CS5開催終了】 Dreamweaver CS5 の使い方・基本トレーニング

【CS5開催終了】 Dreamweaver CS5 の使い方・基本トレーニング

25,200円(税込)

【CS5開催終了】 Fireworks CS5 の使い方・基本トレーニング

【CS5開催終了】 Fireworks CS5 の使い方・基本トレーニング

12,600円(税込)

【CS5開催終了】 Flash Professional CS5 の使い方・基本トレーニング

【CS5開催終了】 Flash Professional CS5 の使い方・基本トレーニング

25,200円(税込)

【近日開催予定】 未経験から始めるPython入門 オンライン講座 〜限定10名!4時間×3回〜 |価格:15,000円より|

【近日開催予定】 未経験から始めるPython入門 オンライン講座 〜限定10名!4時間×3回〜 |価格:15,000円より|

25,000円(税込)

【近日開催予定】 WordPress入門講座 Vol.2 〜WordPressを使ったWebサイト運営にとっても大事なSEO/SEOを意識したコンテンツ(文章)作成方法〜(オンライン受講(2時間×4回)) |価格:10,000円より|

【近日開催予定】 WordPress入門講座 Vol.2 〜WordPressを使ったWebサイト運営にとっても大事なSEO/SEOを意識したコンテンツ(文章)作成方法〜(オンライン受講(2時間×4回)) |価格:10,000円より|

10,000円(税込)

【近日開催予定】 WordPress入門講座 Vol.1 〜WordPressを使ったWebサイト制作の基本が学べる〜(オンライン受講(2時間×4回)) |価格:10,000円より|

【近日開催予定】 WordPress入門講座 Vol.1 〜WordPressを使ったWebサイト制作の基本が学べる〜(オンライン受講(2時間×4回)) |価格:10,000円より|

10,000円(税込)

【近日開催予定】 Pythonによるデータサイエンス入門講座 |価格:54,000円より|

【近日開催予定】 Pythonによるデータサイエンス入門講座 |価格:54,000円より|

108,000円(税込)

【近日開催予定】 jQuery・jQueryMobileの基礎知識(PC・スマートフォン) |価格:13,200円より|

【近日開催予定】 jQuery・jQueryMobileの基礎知識(PC・スマートフォン) |価格:13,200円より|

26,400円(税込)

| カテゴリ | | Web | DTP・デザイン | CG・動画・映像 | キャリア・就活 |
| お客様 Index | | 企業・自治体のお客様に | 学生の方に |
| 目的別・状況別 Index | | Webデザイン入門セミナー | 映像編集入門セミナー | DTPデザイン入門セミナー | 魅力的なポートフォリオ作成 |
| Adobe CCを覚えたい方に | | Photoshop 2020の使い方・基本 | Illustrator 2020の使い方・基本 |
| Photoshop 2020の使い方・画像補正編 | 読みやすい文字の組み方 |
| HTML / XHTML / CSSの基礎知識 | HTML5 / CSS3の基礎知識 | JavaScriptの基礎知識 | jQuary・jQueryMobileの基礎知識 |
| Dreamweaver CC 2015の使い方・基本 | InDesign CCの使い方・基本 |
| AfterEffects 2020の使い方・基本 | AfterEffects 2020の使い方・実践1 |
| Premiere Pro 2020の使い方・基本 |
| 就職・転職・就活中の方へ | | 模擬面接セミナー(個別FB付) | エントリーシートブラッシュアップセミナー |
| 面接・職場で使えるビジネスマナー研修 | 職務経歴書添削セミナー |