*

Dreamweaverの代わりになるのか?HTML5 CSS3対応HTMLエディターBlueGriffonを試す

公開日: : 最終更新日:2013/07/03 WEBDESIGN

特にFTPわまりで不具合の多い Adobe Dreamweaver の代替えソフトとなるのか?「BlueGriffon」という無料ソフトを見つけたので試してみます。MacもWindowsもLinuxも対応しているようです。

概要とダウンロード

BlueGriffon は「The next-generation Web Editor based on the rendering engine of Firefox」というコピーにある通り、FireFoxをベースにした次世代エディターです。かっこいい。基本は無料のオープンソフトですが、サポートや追加機能は有料販売されているようです。

http://bluegriffon.org/pages/Download

スクリーンショット 2013-06-26 16.45.28

対応OSは上図の通り。今回はMacでのインストールを試します。この記事を書いている段階でバージョンは1.7.2です。

スクリーンショット 2013-06-26 16.50.23

ダウンロードしたファイルをダブルクリックでインストールを開始します。インストールはマウントしたファイルをアプリケーションフォルダにドラックするだけ。

スクリーンショット 2013-06-26 16.50.49

容量120M程度なのでスグにコピーが完了します。さっそく起動。若干画面が出てくるまで時間がかかるけど、無事に起動しました。そして既に日本語になっています。

スクリーンショット 2013-06-26 16.52.06

画面デザインは洗練されていて好印象です。上に並ぶアイコンが若干ガチャガチャしていて、もう少しシンプルにデザインして欲しかったけど、全体的にはカッコイイと思います。

簡単に使ってみた感想

CSSの外部ファイル編集などは別売の追加機能が必要になっているようです。11.5ユーロなので1,500縁前後でしょか?ある程度使い込んでみて本格的に使えると判断した場合は購入してみようかと思っています。

スクリーンショット 2013-06-26 19.02.41

追加購入しなくてもソースに直接書かれるCSSを手動で外部に移動させれば問題無さそうです。

スクリーンショット 2013-06-26 18.56.31

なによりCSSの設定をビジュアルに指定できるのは便利です。

Bootstrap を試してみる

レスポンシブデザインがマイブームなので Bootstrap の対応具合を試しておきます。

http://twitter.github.io/bootstrap/
スクリーンショット 2013-06-26 20.49.05

HTMLはサンプルの「Fluid layout」を使います。HTMLソースは次のURLからソースを表示してコピー・ペーストしてみました。

http://twitter.github.io/bootstrap/examples/fluid.html

そしてソースのリンクを修正します。具体的にはCSSファイルへのリンクを修正しただけです。

<link href="./css/bootstrap.css" rel="stylesheet">

<link href="./css/bootstrap-responsive.css" rel="stylesheet">

<script src="./js/html5shiv.js"></script>

以上の状態で BlueGriffon のプレビュー画面を見ると…

スクリーンショット 2013-06-26 20.56.52

かなり忠実に再現されているようです。これは使えそうですね。

その他使い勝手を良くする設定

標準でFTPが無いようなので検索で探してみると、次のURLに素晴らしい内容が記載されていたので勝手に紹介させていただきます。

BlueGriffon をインストールしたら最初にやっておきたい7箇条
http://dirtysexyquery.blogspot.jp/2012/06/7-things-to-do-after-installing.html

公式ページで色々なアドオン(機能拡張)が紹介されています。そのかかから上記URLでも紹介されている無料の「FireFTP」をダウンロードして見ることにしました。

スクリーンショット 2013-06-26 21.04.20
http://www.bluegriffon.com/index.php?pages/FireFTP

画面右側の緑色のダウンロードボタンを押すと「fireftp-2.0.14-bluegriffon.xpi」というファイルがダウンロードされます。

メニューの「ツール」から「アドオン」を選択。画面上にある歯車マークをクリックするとメニューが出ます。

スクリーンショット 2013-06-26 21.08.06

ファイルからアドオンをインストールでファイル選択画面が開きます。

スクリーンショット 2013-06-26 21.08.52

インストールして再起動すれば「ツール」メニューに「FireFTP」が表示されています。

スクリーンショット 2013-06-26 21.09.20

起動されるとよくあるFTP画面です。左上の「アカウントの作成」で設定ができます。

簡単に使っている範囲では動作も早く安定していました。不具合らしい動きは一度もありませんでした。なかなか良さそうですね。


Sponsored Link


 
 

関連記事

感激しない文章が書けるようになりたい

私には「泣ける」とか「感動する」ような文章を書くことはできません。ちょっとだけ「じわっと」心に滲むよ

記事を読む

2017年1月時点での脱アドビ計画(AFFINITY PHOTO編)

新しくWindowsのノートPCを購入しました。Dellの17インチで10万円程度です。 In

記事を読む

ご質問は掲示板へお願いいたします。

Message

メールアドレスが公開されることはありません。

CAPTCHA


Optionally add an image (JPEG only)

Sponsored Link

気になる情報・新製品発見メモ

日頃ネットをウロウロしていて記事にするほどでもない情報、記事にするほど

録音ミニスタジオ完成の図と12色のリモコンLED電球

構想10年・制作3日の自宅音声収録スタジオの完成です。 ご覧の通

録音(撮影)ミニスタジオの制作DIY

そんな訳で吸音スポンジを壁に取り付けてみた続きです。 調子に乗っ

YAMAHA MG10UXミキサー到着

2018年 物置(事務所or作業場or遊び部屋)の一角を音声収録&撮影

そしてzbrush coreをインストールしてみる話

Blenderに挫折してから一気に3Dにのめり込んでいます。 ま

録音環境を改善する!吸音パネルをDIYとか

久々に更新! すっかり更新グセが抜けてしまい、イマイチやる気が出

→もっと見る




  •  

PAGE TOP ↑