イヤ〜な梅雨の季節。ムシムシした季節に、イライラを抑えて作業するために今回もオススメを紹介していきましょう。
絶対オススメソースビュー:「View formatted source(format source extension)」
これまでWeb制作者への視点でFirefoxの拡張機能などを毎回紹介してきていたのだが、今回は「Web Developer」以来の大イチオシになるだろう拡張機能「View formatted source」をご紹介。
どちらかといえば、Web制作者でも主にCSS設計者向け、もしくはサイト更新者にオススメな拡張機能だ。主な機能としては、以下の2つ。
- 設定した要素に罫線をつけて構造をビジュアル化
- CSSファイルとの連携したソースビュー
罫線付けについては、「Web Developer」にもある「ブロックレベル要素を枠で囲う」と同機能。どの要素に対して罫線を付すかは「設定」からチェックマークで選択ができる。
そして、もっとも今回注目すすべきなのはソースビューである。拡張機能の名前にもなっているView formatted source(ショートカット:Ctrl+Alt+U)は、(X)HTMLソースとCSSファイルとの組み合わせを同時に見る事ができる素晴らしい機能を搭載している。
画像を実際をご覧いただくと一目瞭然だが、要素名は「青」、属性名は「赤」、その値については「黒」で色分けされるほかに、CSSやJavaScriptの外部ファイルへのリンクがある場合は、そのソースがインラインフレームの形でソース上に読み込まれる。
画面上の要素は、「+」「−」でそのソースグループを折りたたんで、任意の名称をつけておくことができ、オンマウスでその要素へ掛かっているCSSの状況が読み取れる仕組みになっている。
同じような機能としては「FireBug」があったが、View formatted sourceの場合、img要素に触れるとその画像までソースビュー上に表示してくれるという大変優れた機能が嬉しい。
モジュール化することが増え、複数ファイルになったCSSファイル、別の人が設計したCSSファイルの解読においては大いに役に立つことだろう。ぜひ試してみてもらいたい。
URL短縮:「aquanotes URL」
長いURLを誰かに伝えたい場合、短縮・圧縮する方法は検索をすると幾つかのサービスが出てくる。その中で、Firefox用の拡張機能も備える「aquanotes URL」を紹介しよう。
開発は「Dreamweaver PHPスターティングガイド」や雑誌の連載でも知られる、たにぐちまこと(H2O Space.)氏。「aquanotes URL」は、任意に作成したURLにすることも出来るので、ブログでよく他サイトを紹介する方には便利でオススメだ。お試しあれ。
なお、aquanotes URLは現在開発中。段階でもバグや良い提案があれば、是非コミュニティページへ報告してあげてください。
ついにWindows版も登場:「Safari 3 for Win」
6月11日、米カリフォルニア州サンフランシスコ市内で行われた、米Appleの開発者カンファレンス「WWDC 07」において、新しいOS「Mac OS X “Leopard”」、噂の「iPhone」の発表と一緒に、「Safari 3」の発表がされた。
そして、このSafariについてはなんとWindows版のプラットフォームも用意されることになった。現在は、「Safari 3 Public Beta(英語のみ)」が無料ダウンロードできる。
一部で日本語化についての記事も既にあがっているが、少なくとも現時点においてはFirefox 2よりもメモリを消費するという問題もある。今まだやっきになる必要はないかもしれないが、またこれで1つチェックのタスクが増えそうで、頭が痛かったり。
では、今月はこの辺で、また来月!
関連リンク
変化の時間(トキ) バックナンバー
Web Developer
View formatted source
FireBug
aquanotes URL
Dreamweaver PHPスターティングガイド(Amazon)
H2O Space.
WWDC 07
Safari 3 Public Beta(英語のみ)
伊藤学さんプロフィール
ウィルシステム,incにてHTMLやCSSの設計を主に担当かたわら、講師・講演・ライティングなど幅広く活動中。
http://www.willsystem.co.jp/
http://www.s-freesia.jp/
このエントリーをブックマークする
このエントリーにトラックバックする
このエントリーのトラックバックURL
http://withd.jp/mt/mt-tb.cgi/1700
WEBの新着記事
2009.06.29
行動につながる情報を見つけ出す
2009.06.25
人柄のデザイン
2009.06.25
Web標準と接する際の3つの留意点
2009.06.18
3年間ありがとうございました、のブックマーク放出
2009.06.11












