DreamweaverはWebデザインに携わる多くの人から支持を集めています。これからWebデザインの勉強を始めたいという人の中にはDreamweaverの基礎知識について知っておきたいという人もいるのではないでしょうか。今回は、Dreamweaverの基本的な使い方や便利な機能についてご紹介します。
知っておいたほうがいいDreamweaverの特徴って？
Dreamweaverとはアドビ社から発売されているWebデザイン・アプリデザインを行うためのソフトです。HTMLやCSSなどに対応しており、スムーズなサイト作りをサポートしてくれます。
その最大の特徴として挙げられるのが、「コーディングの手間を省きスピーディーにサイトをデザインできる点」です。高機能でありながらシンプルなコーディングを行えるエンジンが搭載されているため、サイトを管理したり編集したりしやすいといえます。
Dreamweaverで重要な機能
Dreamweaverの重要な機能といえるのが、「デザイン・コードビュー」や「コードヒント機能」、「テンプレート機能」などです。
デザイン・コードビュー機能
まず、Dreamweaverは編集中であってもブラウザを開かずにサイトのレイアウトを確認できます。リアルタイムでデザインを確認しながらコードの編集ができるために、コーディングを終えてからの修正回数も少なくなり効率的です。
コードヒント機能
Dreamweaverに備わっている「コードヒント機能」は、コーディングの手間を軽減してくれる非常に便利な機能です。HTMLのコードは長いものが多く、1から全てを手打ちしていると時間がかかる場合もあります。Dreamweaverのコードヒント機能は、途中まで入力したコードを元にいくつか候補を表示してくれます。コードを最後まで打ち込む必要がないため、効率よくコーディングを進められ便利です。
テンプレート機能
次に、Dreamweaverの便利な機能として挙げられるのが「テンプレート機能」です。Dreamweaverには、デザインテンプレート機能は搭載されていませんが、サイトの大まかなレイアウトを決める「テンプレート機能」が備わっています。テンプレート機能を活用することで、サイトのボーンを1ステップで構築でき、素早くサイトのデザインに取り掛かれます。
Dreamweaverに欠かせない操作の基礎
Dreamweaverの基本的な操作方法について解説をしましょう。まず、サイト設定をするために編集ページを立ち上げHTMLドキュメントの新規ページを作成します。Dreamweaverを立ち上げたら、ツールバーにある「サイト」をクリックし、「新規サイト」を選択します。ダイアロボックスが表示されたら、「サイト名」と「ローカルサイトフォルダ―」を指定しサイト設定は終わりです。
次に文字を入力してみましょう。HTMLドキュメントを開くために、「ようこそ」画面でHTMLをクリックします。新規HTMLファイルを作成したら、ドキュメントツールバーのデザインをクリックするとテキストが入力できます。文字を打ち込んだら、実際の画面を確認してみましょう。Dreamweaverではリアルタイムビューが使用できるため活用すると良いです。Dreamweaverのステータスバーにあるリアルタイムプレビューを選択すると、レイアウトの画面を見ることができます。
なおDreamweaverの画面構成は、「ツールバー」、「ドキュメントウィンドウ」、「プロパティインスペクタ」、「パネルグループ」などから成り立ちます。各部分の表示、非表示はメニューの「表示」または「ウィンドウメニュー」で設定できます。不必要なツールを閉じておくと、制作に集中しやすくなり便利です。
初心者向けの基礎テクニックは？
Dreamweaverにはさまざまな機能が備わっていますが、初心者の中には機能の使い勝手が分からず困ってしまう人もいます。Dreamweaverを使いこなし、サイトをより早くデザインするためには基礎的なテクニックを知っておくことも大切です。今回は実際にDreamweaverを使う人を対象に、使用頻度が多い基礎的なテクニックについて聞いてみました。
どれくらい知っている？Dreamweaverの機能&テクニック
- デザインビューでブラウザでチェックしなくても編集しながらレイアウトを確認できるようになるといいと思う。（30代/男性/個人事業主・フリーランス）
- サイト設定をして作成後のファイル管理ができるようにしておく事や、デザインビューやショートカットを使いこなせるようになる事です。特にサイト設定では後になって間違ったファイルを削除してしまわないためにも必須です。（30代/男性/正社員）
- ライブラリです。ウェブサイト内で共通する個別に変更がないパーツを管理するための機能で便利だったからです。（30代/女性/正社員）
- 初心者が使用するとき、「初期状態・デフォルトのままでは使いづらい」と思うので、自分が使いやすいようにカスタマイズすることが望ましいと思います。また、ショートカットが割り当てられていない機能に割り当てる設定をすれば、一段と使いやすくなると思います。（30代/女性/パート・アルバイト）
- コードの検索・置換の機能。コードを一気に修正できるから。（30代/女性/正社員）
- HTMLは必須のテクニックです。覚えておかないと Dreamweaverのほとんどの機能は使えません。（30代/男性/個人事業主・フリーランス）
【質問】
初心者がDreamweaverで覚えておいたほうがいい基礎的な機能やテクニックは何ですか？
【回答結果】
フリー回答
調査地域：全国
調査対象：【年齢】20 – 29 30 – 39
調査期間：2018年05月28日～2018年06月04日
アンケートの結果、皆さんさまざまな機能やテクニックを活用し、効率よくサイトをデザインしているようです。中には、専門的な知識がないと扱えない機能もあります。まずは、機能の名前やデザインに関する専門用語を積極的に覚え、使う頻度が多い機能やテクニックから少しずつ慣れていきましょう。
基礎を押さえて使いこなせるように！
Dreamweaverを使いこなすための第一歩は、機能や専門用語の名前を覚え積極的に使っていくことです。Dreamweaverはソフトの中でも操作が難しいため、一気に全ての機能を覚える必要はありません。思い通りのサイトをデザインできるように、こつこつと勉強を重ねていきましょう。より効率よくDreamweaverの基礎を学びたいという人は、スクールに通うのもおすすめです。
なお、リンクアカデミーが運営するバソコンスクールアビバでは、パソコン操作に自信のない方でも着実なスキルアップが図れます。意外と知られていない基本的な知識やソフトの特性などをしっかりおさえた上で、作成課題を進めていきますので、初学者でも使える自信がつきます。
また、「スキルを活かして、どのようなキャリアプランを描くことができるのか」「理想とするキャリアを実現するためには、どのタイミングでどのようなスキルや資格を身につけるのが有効なのか」など、教室スタッフ（キャリアナビゲーター）が皆様のニーズに合わせてアドバイス、サポートをしてくれますので、興味がある方はぜひ一度無料体験や説明会にお越しください。
