デジハリONLINE のAdobeマスター講座 Dreamweaver 内容と感想【2021年6月】

「Webサイトを作りたい」 「Adobe Dreamweaverを使うと作れるらしい」 「デジハリオンラインのAdobeマスター講座のDreamweaverはどんな感じ？」

企業の商品販売Webサイト、LPの作成等のマークアップ作業で、効率よく作業できるツールとして人気なのがAdobe Dreamweaverです。

2021年6月、デジハリオンラインのAdobeマスター講座を受講しました。

この記事では以下についてまとめています。

• Adobe Dreamweaverの講座内容とその感想
• Adobe Dreamweaverをお得に購入する方法

参考にしてください。

Adobe Dreamweaverをお得に購入する方法

以下手順で進めると、Adobe Dreamweaverをお得に購入できます。

1. Adobe公式サイトから、Adobe Dreamweaverが含まれるAdobe Creative Cloudを無料で始める
2. Adobe Dreamweaverを7日間無料で体験する
3. 以下いずれかの方法でAdobe Creative Cloudを購入する
   ・無料体験終了後、Adobe公式サイトからIDを購入する
   ・たのまな アドビオンライントレーニング通信講座を購入する
   ・デジハリONLINE Adobeマスター講座を購入する

まず、Adobe公式サイトからAdobe Dreamweaverをインストールすると、7日間無料で使えます。

無料期間中に解約すれば料金は発生しません。

無料体験期間終了後に、次のいずれかのパッケージでAdobe Dreamweaverを購入するとお得です。

Adobe Dreamweaverは、Photoshop、Illustratorで作った素材を使ってWebサイトを完成させるものなので、必然的にそれらソフトが含まれたAdobe Creative Cloudが必要です。

なお、前回はたのまな アドビオンライントレーニング通信講座の内容を説明しました。

ヒューマンアカデミー たのまな Adobe Dreamweaverオンライン講座内容と感想【2020年5月】

2020年5月7日

本記事では、デジハリONLINE Adobeマスター講座の内容を説明します。

Adobe Creative CloudをデジハリONLINEから購入

デジハリONLINE Adobeマスター講座は、デジタルハリウッド約20年の教育ノウハウに基づいて制作された基礎動画教材（46時間）と、12ヶ月版のAdobe Creative Cloudがセットになった講座です。

Adobe公式サイトからよりもAdobe Creative Cloudを安く購入でき、しかも、Adobeのソフトの使い方を学習できるのでお得です。

デジハリオンラインのAdobeマスター講座では、Adobeの以下ソフトの使い方を学べます。

Adobeマスター講座には、課題もあり、プロのクリエイターに課題を添削してもらえます。

基礎動画、課題の添削は、Adobeマスター講座を開始してから以下の期間有効です。

• 動画の視聴期間: １ヵ月
• 課題添削期間: 2ヵ月

詳細はこちらを参照してください。

デジハリ・オンライン Adobeマスター講座 Adobe Dreamweaverの講義内容

デジハリオンラインのAdobeマスター講座のAdobe Dreamweaverの講義内容がどのようなものかを紹介します。

概要

講義はオンラインのAdobe Dreamweaverの解説動画です。

講義内容は講義一覧で確認できます。

講義で使う素材はダウンロードでき、手を動かしながら学べます。

講義内容

Step01　オリエンテーション

Dreamweaverの学習の進め方について以下を学習します。

1. 学習の進め方
2. リファレンスの紹介
3. サンプルファイルの確認
4. Dreamweaverでの学習の準備(1)
5. Dreamweaverでの学習の準備(2)
6. GoogleCromeでの学習準備

Step02　Webの基本

HTML、CSS、JavaScriptでWebサイトが表示される仕組みについて、以下を学習します。

1. webページを表示するしくみ
2. webページをつくるファイル

Step03　HTMLの基本

1. HTMLとは
2. HTMLの基本構文
3. HTMLに必須の要素
4. ブロックレベル要素とインライン要素
5. 属性を詳しくみる

Step04　HTMLを記述する際の注意

1. HTMLを記述する際の注意
2. 実体参照
3. HTMLのコメント

Step05　リンク構造を作る

1. aアンカー
2. 相対パスと絶対パス

Step06　全ての要素を確認する

1. すべての要素を確認する

Step07　テキストコンテンツに関する要素

1. p 段落
2. ul 順序なしリスト
3. ol 順序つきリスト
4. dl 説明リスト
5. div コンテンツ分割
6. hr 主題分割
7. blockquote ブロック引用
8. figure 図表、自己完結コンテンツ
9. pre 整形済みテキスト

Step08　コンテンツセクショニングに関する要素

1. h1 h6 見出し
2. header main footer
3. article 記事など、自己完結コンテンツ
4. section セクション
5. nav 目次
6. address 連絡先
7. aside 間接的な関係の文章

Step09　画像とマルチメディアに関する要素

1. img 画像
2. audio 音声
3. video ビデオ
4. map クリック可能な領域指定

Step10　テーブルに関する要素

1. table テーブル
2. table 行、列の結合
3. table その他の要素

Step11　フォームに関する要素

1. formフォーム
2. 1行のテキスト
3. 1行のテキスト emailアドレス
4. 1行のテキスト パスワード
5. 複数行のテキスト
6. セレクトボックス
7. ラジオボタン
8. チェックボタン

Step12　その他、覚えておきたい要素

1. br 改行
2. span 行内汎用コンテナ
3. small 注釈
4. strong em 重要性、強調
5. del ins 編集範囲の特定
6. iframe インラインフレーム

Step13　その他、覚えておきたい要素

1. 設定されているメタデータの概要
2. viewport スマートフォン対応
3. IE互換モード
4. タッチアイコン
5. ファビコン
6. 自動リンクの設定

Step14　SEO対策、SNS対策

1. SEO対策とは
2. SEO対策の設定
3. SNS対応、OGPとは
4. OGPの設定
5. Twitter専用の設定

Step15　地図、動画の読み込み

1. youtubeの読み込み
2. GoogleMapの読み込み

Step16　コンテンツモデルについて

1. コンテンツモデルについて

Step17　CSSの基本

1. CSSとは
2. CSSの基本構文
3. CSSを記述するところ
4. CSSの学習を始める前の準備

Step18　セレクターの種類

1. セレクターの種類
2. 要素セレクター
3. classセレクター
4. idセレクター
5. 属性セレクター
6. 全称セレクター

Step19　擬似クラス

1. 擬似クラスとは
2. hover
3. checked
4. active
5. focus
6. firstChild lastChild
7. firstOfType lastOfType

Step20　疑似要素

1. 擬似要素
2. before after
3. fisrtLetter firstLine

Step21　セレクターの組み合わせ

1. セレクターの組み合わせ
2. 複数のセレクタを同時に指定
3. 子孫結合子AB
4. 子結合子A-B
5. 隣接兄弟結合子A+B

Step22　CSSを記述する際の注意

1. CSSを記述する再の注意
2. コメント
3. カスケード
4. スタイルの継承
5. スタイルの優先順位

Step23　文字・行に関するプロパティ

1. フォント全般の指定
2. フォントスタイル
3. フォントの太さ
4. フォントサイズ
5. 行高の指定
6. フォントファミリー
7. 文字色の指定
8. 文字横揃えの指定
9. 縦揃えの指定
10. 文字装飾の指定

Step24　トピックス

1. CSSでの色の指定
2. CSSでの長さの指定（1）
3. CSSでの長さの指定（2）

Step25　背景に関するプロパティ

1. 背景全般の指定
2. 背景色
3. 背景画像
4. 背景画像のサイズ
5. 背景画像の繰り返し
6. 背景画像の位置

Step26　ボックスに関するプロパティ

1. ボックスとは
2. ボックスモデルとは
3. border枠線
4. borderradius枠角
5. 影をつける
6. padding 内余白
7. margin 外余白
8. マージンの相殺
9. 高さの指定
10. 幅の指定
11. 高さ、幅の計り方
12. アウトライン

Step27　表示・配置に関するプロパティ

1. 表示に関する指定
2. はみ出しに関する指定
3. 配置に関する指定
4. 配置位置に関する指定
5. 表示順に関する指定

Step28　アニメーションに関するプロパティ

1. 時間変化
2. アニメーション
3. 変形

Step29　レイアウト

1. フレックスボックス flex
2. floatとclear
3. clearfix

Step30　＠規則について

1. @規制について
2. 画面の種類に応じたスタイル変更

Step31　JavaScript

1. JavaScript

デジハリ・オンライン Adobe Dreamweaverの講義を受けた感想

Adobe Dreamweaverの操作方法というより、HTMLの構文を学ぶのに適した講座です。

Adobe Dreamweaverの操作方法については基本的な操作のみで、ほとんどがHTMLの構文の解説動画です。

レッスン数はかなりたくさんあり、HTMLの構文を分かりやすく解説されているので、Web初心者に最適な講座内容です。

Adobe Dreamweaverの操作については、AdobeオンラインのAdobe Dreamweaverチュートリアルを確認されるといいです。

なお、プロの高度な技術については、デジハリ・オンラインスクールやTECH::CAMPオンラインデザイナーコースなどスクールに通うことをおすすめします。

【2022年】Web制作・Webデザイン 始め方とスクールを比較・検討

2020年5月20日

なお、デジハリONLINE のAdobeマスター講座の一覧はこちらを参照してください。

デジハリONLINE のAdobeマスター講座 内容と感想【2021年6月】

2021年7月4日