前回の続編で、今回は、Dw(Dreamweaver)のショートカットを紹介していきます。

これを知っているといないでは、スピードに、倍以上の差が出るんじゃないでしょうか。

まず一言、言っておきましょう。これを見れば、Dwのショートカットを完全網羅できます。！嘘じゃないです！騙されないつもりで読んでください（騙されたと思って～というフレーズは、個人的に大嫌いです）。以下、目次。

1. HTMLで使うショートカット
2. CSSで使うショートカット
3. ショートカットキー完全網羅

一番使うであろうショートカット～HTML編～

さぁ、さらっと紹介していきますよー！

h1等の見出しタグを爆速作成

Dwの画面で、テキストを入力して、「ここh2にしたいなー」っていうとき、いちいち、括弧→h2→閉じ…なんて打ってたら、けっこうストレスです。そこで、画面のように、

まず、選択します。そして、ctrl + 2を押します。すると、

はい一瞬！

例では、h2を使いましたが、各見出しと数字が対応しているので、h1ならctrl + 1、h4ならctrl + 4といった感じで、バシバシ見出しを作りましょう！選択も、Shift + 矢印キーを使いこなせるようになると、更にラクに選択できます。これについては、説明が非常に面倒なので、割愛させていただきます。

id名、class名等の選択

選択で思い出したので、豆知識コーナー的な感じで紹介ます。いくつもWebサイトを作っていると、意外と悩むのが、id名やclass名。例えば、メインコンテンツのidを、「メインコンテント」としたいとき、

• main-content
• main_content

まぁ、他にもmainContent等の書き方もありますが、上記2つがあるとして、あなたはどっち派ですか？

「どっちでも変わんないよ！」と思う方もいらっしゃると思いますが、これ、かなり違うんです。

何が違うのかというと、ダブルクリックで選択したときに、–(ハイフン)だと、このように、

選択範囲がそこで切れます。そして、_(アンダーバー)だと、このように、

半角英数字と一緒に選択されます。ちょっと見た目が違うだけで、こういった違いがあります。これを知っておくだけでも、記号の使い方がまた変わってくるんじゃないでしょうか。
話が逸れたので、本題に戻ります。

一番使うであろうショートカット～CSS編～

コーディングしていて、こんな経験っていでしょうか？

「えーと、インライン要素にしたいから、、、」

「よいしょ、よいしょ。」

「どぅあっー！お前じゃないよ！！！」

で、仕方ないから消してもう一回打ち直すと、コードヒントが出て来なーい！なんてフラストレーションに遭遇したことってありますよね。これ、実は、すぐに出せるんです。

画面のような状態のときに、ctrl + スペースで、いつでもどこでも、コードヒントを出すことができます。htmlでも一緒で、このキーで、途中で消えてしまったコードヒントを出すことができます。

ショートカットキー完全網羅

私は言いました。完全網羅できると。CS5以前はわかりませんが、これ実は、Dw(というか、Adobeソフト)には、とても便利な機能がありまして、
「編集」→「キーボードショートカット」というメニューがあるんです。

ここに全部載ってます！そして、自分で書き換えたり、追加することもできちゃうんです！
例えば、イラレとフォトショで定規を引きたい場合のショートカットキーは、ctrl + Rですが、Fireworksで、ctrl + Rを押すと、「読み込み」になってしまいます。それがうざい場合は、自分で設定を変えて、自分だけのFw(Fireworks)にしてしまいましょう。

いかがだったでしょうか。これを活用して、皆さんもショートカットマスターになってください！

では。