ゲームやWEB関係がメイン。まとまりのない雑記ブログ

WEB関係

Dreamweaver CCのCSSクイック編集が便利すぎた件

更新日:

最近、以前Dreamweaverで作成した静的なHTMLのサイトを更新する機会があったので久々にDreamweaverを使いました。

Adobeに登録しているのでバージョンはDreamweaver CCの2018です。

CS6以来、マジで3年ぶりくらいにDreamweaverを起動しましたが、めっちゃ使いやすくなってて驚愕しました。

エディタ自体が軽くなってたり、コーディングを効率化するための便利な機能が追加されていましたが、特にCSSクイック編集はヤバイ

1日中がっつりコーディングする人なら半端なく時間短縮ができます。

CSSのクイック編集の使い方

コードのスタイルを追加・変更したい箇所で下記のショートカットを使うだけ。

Windowsの場合:Ctrl + E
Macの場合:command + E

HTMLの編集画面でコードに対応したCSSを開くことができます。

これでわざわざCSSファイルを開いて編集しなくても、HTMLのコード上でCSSが編集できます

CSSの編集が終わったらescで閉じて、再びHTMLのコーディング作業に戻りましょう。

Dreamweaverのクイック編集とライブプレビューを組み合わせれば全ての操作が1画面で完結できるのが凄い。

これでCSSファイルを開いてHTMLで設定したIDやクラスを探す必要はなくなりました。

ちなみにCSSのクイック編集はDreamweaver CC2017から実装されている模様。

CS6で使うのを辞めたから、Dreamweaverがこんな事になっているとは全く知らなかった。

Web製作者として情弱の極み(´・ω・` )

ちなみに、HTMLを編集している親フォルダが日本語だと「現在のカーソル位置で行えるクイック編集はありません」という警告が出てクイック編集ができなくなりました。

フォルダ名を半角英数字にすれば解決しますが、謎の仕様ですね。

Dreamweaverを使う価値…ありますねぇ

Dreamweaverを使いつづけている人からしたら「え、それだけ?」「今更何言ってんだこいつ」と思っていることでしょう( ˘ω˘)

でも、Dreamweaverから離れてしまった無料エディター使いたちの中には、この便利さを知らない人もいるのでは。

CS6から比べれば、生まれ変わったと言っても過言ではないくらい進化しています。

圧倒的に使いやすいエディターになっているのでAdobe Creative Cloudを利用している人はDreamweaverは超オススメです。

無料エディターの中では、同じAdobeのエディタBracketsもCSSのクイック編集ができます。

ただ、ガチガチのコーダーでPHPも使うならDreamweaverを使わないと効率減です。

まぁ、よほど仕事でがっつりコーディングをする人以外は無料のBracketsで充分な気がしますが…。

ちなみに僕が現在仕様中のメインエディタはAtomです。

実用性皆無の機能で自己満足に浸っています。

主にHTML・CSS・JavaScript・PHPファイルの編集に使ってて現状Atomに不満はありません。

しかし… ここまでDreamweaverが便利だと乗り換えもワンチャンありですね。

Dreamweaverの圧倒的な実用性に心を奪われつつあります。

色々と便利な無料エディターが登場してきてるので、Dreamweaverも少しずつ本気を出してくるかも…?







関連記事

【3分で完成】CSS3だけでSVGアニメーションロゴ作ってみた

あまりにも地味すぎて、気づいている人はいないかもしれないけど…このブログのロゴはSVGをアニメーションさせています。 ページを読み込んだ時、線を書くようなアニメーションでロゴが表示されます。 イラスト …

PDFのパスワード解除方法が簡単すぎた

クライアントから頂いたPDFデータにパスワードがかかっていたときの話。 仕事で、別の制作会社が作成したPDFをもらう時がたまにあります。 PDFにロックをかけて、データの編集や抜き取りを防ぐんですが、 …

Microsoft Edgeを使うメリットはあるのだろうか

Microsoft Edgeとは Internet Explorerに代わり、Windows10で登場した標準ブラウザ。 新機能が追加され、IEと比べると読み込み速度の高速化・セキュリティの強化が行わ …

WordPress5.0へのアップデートはまだ待ったほうがよさそう

2018年12月6日にWordPressの最新バージョン5.0がリリースされました。 今回のメジャーアップデートはエディターが新しいものに変わるということで、注目していた人も多いと思いますが… やっぱ …

Atomのactivate power modeを使ってドヤる

Webデザイナーがコーディングするためには欠かせないエディタ。 同じ社内でも人によって使っているエディタが全然違う場合もあるでしょう。 社員A コーディングするならやはりDreamweaverです。 …

この記事をシェアする