Dreamweaver CC 使い方

Dreamweaver CCで出来ること

Deamweaver CC(以下、DW)は、現在のホームページ作成に必要なことのほとんどが実現可能です。また、最先端の技術をいち早く取り込んでいます。

代表的な機能として、「HTML5+CSS3」と「可変グリット」の対応です。この二つの機能にきちんと対応しているのは、現在、DWだけと言えます。

20130706b

Dreamweaver CC に向いている人

DWは、プロ向けのツールです。2003年までは、ワープロ感覚で作れましたが、今は、CSSの知識がないと、難しいかと思います。本格的に勉強したい人。プロの人に向いています。

ちょっとした気持ちで取り組みたい方は、ホームページビルダー17を利用ください。ホームページビルダーを使うだけで、立派なホームページが作れます。また、ビルダーも使いこなすことによって、プロ並のサイトが作ることができます。

また、無料で綺麗なサイトを作りたい方は、Wixなどのウェブサイトビルダーを利用ください。(見た目の良いサイトは、作れますが、自由度は下がります)

もっと使いこなしたくなった時、あるいは、初めからプロを目指す方は、DWを学ぶべきです。

Dreamweaver CC 新機能?CSSデザイナー

新しい機能で使える!っと思うのは「CSSデザイナー」ですね。直感的にCSSが使えます。いままでFireWorksで行っていたようなこともDreamweaver CCで行えそうです。

詳しくは本家動画を参照ください。

HTML5+CSS3

「HTML5+CSS3」は、普及が確実視されている次世代のバージョンです。現在のホームページでは、「HTML4+CSS2」、「XHTML+CSS2」および「HTML5+CSS3」が、それぞれ1/3づつ占めているのが現状です。徐々に「HTML5+CSS3」が増えています。

可変グリット

「可変グリット」は、スマートフォン、タブレット、パソコンなど、表示解像度が違うものに対して、それぞれ最適化をして表示する技術の一つです。

Dreamweaver以外に必要な知識

  • 画像編集の知識
  • HTML5+CSS3

画像編集の知識

Dreamweaver単体では、画像の編集・加工を行うことができません。画像の編集を行うには、 FireWorksのような画像編集ソフトが必要です。

HTML5+CSS3

HTML4+CSSまたは、XHTML+CSSでも、対応可能です。今後の普及を考えると「HTML5+CSS3」が望ましい。
ホームページ作成ソフトは、ワープロ感覚でHTMLを記述し、その結果を表示しています。思ったような結果にならない場合の多くは、HTML5まはた、CSS3の記述が誤っていることが多いです。

Dreamweaver CCは、業務用のホームページ作成ツールです。業務用なだけあって、HTML5、CSS3およびjQuery Mobileなど、最先端の技術に対応しており、デファクトスタンダードなツールです。

ホームページ作成のプロを目指すのであれば、必ず身に着けたい知識の一つといえます。今回は、最新バージョンであるDreamweaver CCを使います。

Dreamweaverをインストールしていない方

Adobe Creative Cloudの導入方法を参照し、インストールしてください。1カ月間無料です。

Dreamweaver CCの使い方は、簡単です。スタート画面から「Adobe Dreamweaver CC」を選択

20130705h

次に新規作成グループの中の「HTML」を選択します。

20130706

すると、HTML5のひな形があらかじめ挿入されています。

あとは、デザインボタンを押して記述するだけです。

記述が終了しましたら、「コード」ボタンを押します。

きちんと記載されていることがわかります。

まとめ

Dreamweaver CCは、プロの方。プロを目指す方向けのアプリケーションです。本も、沢山あります。まずは、入門向けの本を読んで一通りの操作をマスターすると良いでしょう。

関連本

Dreamweaver+HTML5&CSS3レッスンブック

関連記事

Dreamweaver CC うれしい新機能 CSS デザイナー

Adobe Creative Cloudの導入方法

   このエントリーをはてなブックマークに追加