[Dreamweaver] コーディングを早くする5つの方法

公開日: : Dreamweaver, Web制作 ,

コーディングは、早くなる!

普段、Dreamweaverを使っている人で、SassやZenコーディングを使ってない人でも、Dreamweaverの機能を駆使すればまだまだ早くなります。

テーブルの行の追加は、Tabキーで!

Dreamweaver上でコーディングしているときに、テーブルを挿入する際に威力を発揮するのがTabキー。

セルの移動もTabキーで出来、行の追加も最後のセルにカーソルがある状態でTabキーを押せば追加されます。
これだけでも十分早くなるんです。

ちなみに、列の追加に関しては、プロパティパネルから追加するしかありません。(知らないだけかも・・・)

追加した行が多すぎた場合、不要なセルをドラッグして選択してdeleteキーで一発削除できます。

リストの入れ子は、Tabキーで!

リストでメニューなどを作っている場合、入れ子にしなければならない事がよくあります。
そういうときは、入れ子にしたい場所にリスト項目を増やし、tabキーを押すと入れ子になってくれます。

不要なタグがある場合、選択するのはタグセレクターで!

不要なタグが出てきた場合、開始タグと閉じタグを一個ずつ選択して削除するのは面倒な作業です。

そういう場合、タグセレクターから右クリックでタグだけ削除できます。

意外と知られていないショートカット

たくさんのファイルをいっぺんに開く時がありますが、たくさんのファイルをいっぺんに閉じたい時もあります。

そういうときは、cmd + shift + w のショートカットを使えば(winの場合は、ctrl + shift + w)いっぺんに閉じる事ができます。

意外と知られていない便利機能

外部のjsファイルを必要とする場合、URLでいい場合はそれで問題ないんですが、ファイルを持っている場合にソースに追加しなければなりません。

そういう時は、ファイルパネルからhead内にドラッグするだけで追加されます。
これは、何気に便利でよく使います。

もっと上級者になりたい場合、アセットやスニペットの機能も覚えよう

アセットは、サイト内で使用しているファイル等をファイルタイプ別に見れる機能ですが、ライブラリを作る事ができます。
このライブラリは、いわばいろんな所で繰り返し使う同じ部品と考えて、一カ所で管理しておくものです。

スクリーンショット 2014-08-31 0.24.48

ライブラリは、アセットパネルから追加出来るのですが、編集できるのもアセットパネル内でだけです。
HTMLファイルにパネル下方の追加ボタンで追加するのですが、追加されたものは編集不可の部品になっています。

少しテンプレートに似てはいるのですが、いろんなところに使い回す全く同じものが存在する場合にとても重宝します。

スニペットは、あらかじめソースを登録しておいて、必要な箇所で使うものです。
例えば、jQueryの実行文がわからなくなっても、登録しておけば問題ありません。

スクリーンショット 2014-08-31 0.31.37

このように、上に内容が表示されます。
これをダブルクリックすると、任意の場所に挿入されます。

まとめ

ざっと、Dreamweaverでコーディングする際に時間短縮になる方法や機能を紹介しましたが、僕の知らないこともまだまだあると思います。
紹介したもの以外で、また新たに機能を使いこなせるようになったら紹介したいと思います。

ad

関連記事

[jQuery]背景画像にぼかしを入れるプラグイン

Blurrプラグインの紹介 BlurrはシンプルなjQueryのプラグインです。 そして、背景画

記事を読む

[Dreamweaver] サイトタイトルを入力する枠を広げる!

デフォルトのままじゃ、狭い! DreamWeaverのタイトルを入力する枠があると思いますが、これ

記事を読む

[html5] おさらいがてらWordPressのテーマを作るためにHTML5で一から作るよ![第3回]

ブログの存在すら忘れてました、僕です。 完全放置プレイだったこの連載?を再開しなきゃと思い、重

記事を読む

no image

[CSS] 今さらだけど、覚えておきたい疑似クラス・疑似要素

さて、前回は、CSSのセレクタをおさらいしました。 そして、属性セレクタを取り上げている記事も合わ

記事を読む

[CSS] animationを使ってみる!

色の変化をCSSのみで実装できる! CSS3のキーフレームアニメーションでは、JSで出来る、背景色

記事を読む

[CSS] 角丸は便利だけど理解に苦しむ時もある

一般的な角丸の使い方 よく使う角丸は、divを角丸にしたり、画像を角丸にしたりすることでしょう。

記事を読む

[jQuery] クリック時に波紋のような効果をつける

今回は、クリックした時に波紋のような効果をつけるjQueryプラグインの紹介です。 Ripple

記事を読む

[jQuery] OSX風のスクロールバーにするプラグイン!

trackpad-scroll-emulator trackpad-scroll-emulator

記事を読む

[CSS] 今さらだけど、必ず覚えておきたいCSSセレクタ

CSSセレクタとは? CSSセレクタを意識する事はあまりないと思いますが、今回はおさらいがてら、C

記事を読む

[javascript] Google Maps javascript API v3の使い方(基本編)

Google Maps javaScript API v3とは Google Maps API V

記事を読む

ad

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

ad

[PHP] curl転送してみる(googleに)

curlでgoogle画像検索APIにアクセスしてみます。 cu

[PHP] PDOでMySQLの接続確認をする

PDO PHPでMySQLに接続する際には、mysql_connec

[PHP] ランダムな英数字を生成する

便利系メソッド 今回はPHPでランダムな英数字を作成してみます。

[Swift] プロパティリスト(plist)の値を取得

plistからデータを取得してみます。 こちらのエントリーも参考にし

[Swift] Asset Catalogについて

XCode5から追加されたAsset Catalog。 いままで標準

→もっと見る

  • 1978年の七夕生まれ。 25才でweb業界の門を叩き、28才でフリーランスに。 現在は、フリーランスでマークアップ中心に、wordpressのカスタマイズやデザインをしております。 また、iPhoneアプリの開発もしております。
PAGE TOP ↑