Cntlog > スキルアップ・ノウハウ > コーディング > コーディングのお供に!CSSの更新を自動で反映させてくれる便利なブックマークレート

コーディングのお供に!CSSの更新を自動で反映させてくれる便利なブックマークレート

最近コーディングで便利なブックマークレートを見つけましたのでご紹介します。
CSSrefresh

このブックマークレートは表示しているページで使われているCSSファイルの更新を自動的に確認してブラウザに反映させてくれるというものです。
コーディングといえば、書いてはF5キー、書いてはF5キーの繰り返しでブラウザを更新して表示を確認していたかと思いますがもうその手間は必要ありません。

制作の現場でも最近はディアルディスプレイが主流となっていますので、片面はブラウザ、片面でエディターの画面のように切り分けて制作をする人にとってはうってつけのブックマークレートです。

私も今スマートフォンサイトを作りながら使っていますが、わざわざ確認の度にブラウザをリロードしなくていいというのは本当に楽です。

使い方

CSSrefreshにアクセスしてページ下部にあるアイコンをブックマークに登録します。
※chomeの場合はブックマークバーにドラッグ&ドロップで登録できます。
cap
後はコーディング中のページを開いて、登録したブックマークをクリックだけで準備完了です。
これだけでCSSを更新する度にページに反映されます
楽ちんですね。

ブックマークレートは結構登録しているのですが、 CSSrefreshは感動の出来栄えでした。

関連記事

gulpで作るスタイルガイドをFrontNoteにした... みなさん、スタイルガイドは使ってますか。 私は今年になって使い始めました。 これまではstyledoccoを使っていましたが、長年メンテナンスされてない不安と、使ってるうちに自分のCSS設計と合わない部分がでてきたので乗り換える事にしました。 乗り換えたスタイルガイドジェネレーターは「fron...
Sassの人気に嫉妬!でもLESSにだっていいとこあるんだよ... 最近「Web制作者のためのSassの教科書 これからのWebデザインの現場で必須のCSSメタ言語 」という本が出版されてSassがさらに注目されていますね。 個人的にはいよいよSass一択になってLESSが淘汰されていっちゃうのかなと心配しています。 そもそもLESSって何?って方もいるでし...
コーディングが苦手な初心者Webデザイナーに上達するCSSの勉強法... Webデザイナーになろうとして、まず最初につまずくのがコーディングです。 CSSは慣れてくると簡単なのですが初めて触るとなると、何から手を付けてよいかわからない、何が正解がわからないなどの理由で挫折する人を多く見かけます。 本記事ではCSSが全然わからない方がCSSのコーディングに慣れるため...
スマートフォンサイトを作るときによく使うhead内のタグ... スマートフォンサイトを作るにあたってよく使うmetaタグなどheadで使う要素をまとめてみました。 スマホサイトを作り慣れていない人の参考になれば嬉しいです。 目次 viewport ...
RGBAをIE8でも使う簡単な方法 CSS3で使いたい機能というと角丸やグラデーション系が多いと思いますが、割りとRGBAも便利かなと思っています。 PIEを始め、角丸やグラデーションはIE8でも使えるようにという対策はありますが、RGBAはあまり聞きませんね。 私はPHPを使ってRGBAで色指定(透過率も)したものを画像生成する...
Photoshopとかにある描画モードはCSS3で出来るよ【サンプル有り】... CSS3になって角丸はグラデーション、ドロップシャドウなどデザインツールを駆使して行っていたデザインがいとも簡単にできるようになりましたね。 実はCSS3ではphotoshopやFireworksにあるような、描画モード的な表示もできるようになっています。 ...