MacのMarsEditとWordPressビジュアルエディタの比較

MarsEditIcon

最近MacBook Proの13インチでWordPressブログを書くエディタを試行錯誤していたんですけどどうやらMacアプリのMarsEditを使うことになりそうです。

ノートパソコンの13インチってとくに画面の縦が狭いのでブログエディタ選びが難しくなります。

Web画面のエディタにはビジュアルエディタとテキストエディタの2種類がありますが、

  • ビジュアルエディタだと写真がそのまま表示されて全体を把握しにくい
  • テキストエディタだとそもそも使いにくい

という問題があって13インチのノートパソコンではちょっと使いにくいのが本音でした。

そこでMarsEditならHTML書きながらリアルタイムプレビューされるし全体的に使いやすくてビジュアルエディタとテキストエディタの良いとこ取りのようなアプリとなっています。

スポンサーリンク

WordPressのブログエディタ

MacBook Pro(13インチ)でブログを書く候補としては以下の方法を試しました。

  • Web画面のビジュアルエディタ
  • Web画面のテキストエディタ
  • MarsEdit

いろいろなんて言う割には誰でも使えるWeb画面のエディタとMarsEditしか試していません(笑)

他にもブログエディタはあるみたいですけどちょっと調べた限りMacでブログエディタを使うとしたらMarsEditが高機能だし使っている人が多いので情報を探すのも楽だと思います。

以下、実際にそれぞれのエディタのメリットやデメリットを簡単にメモしていきます。

Webのビジュアルエディタ

WordPressビジュアルエディタの編集画面

もともとWordPressの管理画面に実装されているエディタのビジュアルエディタです。誰でも使える標準の執筆モードですね。

Wordみたいに文字の色を変えたらそのまま見た目に反映されたり画像を挿入したら画像がそのまま見えたりしていわゆるリッチテキストエディタと言われるものです。

ただしちゃんと範囲選択しているのにHTMLタグが思ったとおりに適用されなかったりして好きじゃない人も多いみたいです。

個人的にはビジュアルエディタでもCSSを適用して自分のブログとまったく一緒の見た目にすればかなり使いやすいですけどね。

※追記:「OnePress Image Elevator」というプラグインを使えば貼り付けのショートカットキーCtrl+Vで画像の挿入が簡単にできるようになりました。

参考:「OnePress Image Elevator」の使い方と設定まとめ

Webのビジュアルエディタで使えるので当然Macでも使えます。画面が広いデスクトップの場合はMacでもビジュアルエディタのほうが便利かもしれません。

Webのテキストエディタ

WordPressテキストエディタ

Web画面から編集するテキストエディタ(HTML編集モード)だとメリットがありません。

タグは色分けされてなくて見難いしプレビューボタンを押していちいちページを読み込まないと実際の見た目を確認できないし、

MacであればMarsEditのほうが明らかにメリットが多いです。

MarsEditの特徴

さて、MarsEditの特徴を簡単に書いてみると、

リアルタイムプレビュー

MarsEditリアルタイムプレビュー

自分のCSSを適用すればまったく同じ見た目にしてリアルタイムにプレビューを表示することができます。

画面左側でHTMLエディタを書いて右側にプレビュー画面を表示しておけば編集しやすいです。

Web画面でのHTMLエディタとプレビュー画面の良いとこ取りでしかもリアルタイム表示という使いやすい仕様ですね。

プレビューは実際のCSSが反映される

MarsEditプレビューに自分のCSSを反映

MarsEditのプレビュー設定にはCSSの欄があって自分のブログと同じデザインにすることができます。

ただしこれに関してはさっきビ説明した通りビジュアルエディタでちゃんと設定をしたら見た目が完全なプレビューのまま直接書き込むことができます。

なので個人的にはMarsEditのCSS反映はそこまでの衝撃ではありませんでした。もちろん完全に反映することはできるのでそもそもHTMLエディタを使う場合はWebよりも使い勝手が良いですけどね。

欲を言えばMarsEditのリッチテキストモードでCSSデザインを完全に反映させて直接編集ができたら最高ですがそれはできないみたいです。

画像の挿入が簡単

MarsEdit画像挿入

MarsEditでは画像をドラッグ&ドロップで挿入することができます。

  • 画像ファイルをドラッグ、Skitchからドラッグ、iPhotoからドラッグなど、ドラッグに融通が効く
  • MarsEditにドラッグする時に好きな場所に挿入できる。
  • 挿入と同時にclass名・alt・サイズなどの指定ができるので二度手間にならない
  • 大きな画像をドラッグしても自分が指定したサイズに自動でリサイズされてファイルサイズも小さくなるので画像の処理をあまり心配する必要がない

というふうにあまり難しいことを考えずにドラッグしまくれます。

ただしショートカットキーを使った貼り付けはできないのでその点ではOnePress Image Elevatorのほうが使いやすいです。

マークダウン記法が使える

MarsEditマークダウン記法

MarsEditではマークダウン記法というHTMLタグに変換される専用のタグを使った記法が使えます。

例えばh2見出しを書く場合、普通のタグとマークダウンを比較してみると、

  • 通常・・・ <h2>○○○</h2>
  • マークダウン・・・ ##○○○

普通は開始タグと閉じタグが必要なのにマークダウン記法では閉じタグが必要ないのでそのまま書き進めることができます。

マークダウン記法はMarsEditだけじゃなく記法をサポートしているエディタだったら使えるので覚えておいて損はありません。

※追記:WordPress 4.3からビジュアルエディタでもマークダウン記法が使えるようになりました。

ショートカットキーでタグ入力

MarsEditショートカットキー

MarsEditでは自分の好きなHTMLタグをショートカットキーに割り当てることができるのでやろうと思えば何でもできます。

自分はとりあえずh2タグのマークダウン「##」をcontrol+2に割り当てたりしてシャープの連続入力さえワンアクションで入力できるようにしました。

  • control+2・・・「##」(h2見出し)
  • control+3・・・「###」(h3見出し)
  • control+4・・・「####」(h4見出し)
  • control+R・・・「- 」(リスト)

これらを設定するだけでもかなり書きやすくなります。

その他 <span class="sankou">参考</span> のようなspanとclassで囲む自分で作った長いタグで囲むようなものもショートカットキーを設定できるので自分専用のタグをショートカットキーで呼び出すことができます。

ちなみにこれをWeb画面のエディタでやろうとしたらAddQuickTagプラグインを使うことになりますがショートカットキーが無いのでMarsEditのほうが便利かなと思います。

HTMLタグの自動色分け

MarsEditのタグ色分け

開始タグ、class、URLなどがそれぞれ役割ごとに色分けされていてHTMLタグを直接いじりたい時に編集がしやすくなっています。

幅(width)を後で変えたい時とかすぐに見つけることができて便利です。HTML編集モードで書く人にとっては非常に重宝しますよ。

プラグインによる機能拡張

AppHtmlME検索

例えばアプリの紹介リンクを作成するWebサービスにAppHtmlWebというサービスがありますがWebブラウザからアクセスする必要があるので操作がやや煩雑になります。

またMacのローカル上で動くAppStoreHelperというアプリもありWebブラウザよりマシですがMarsEditから画面を切り替えないといけないのでまだ完璧ではありません。

これをMarsEdit専用プラグインAppHtmlMEを組み込むことによってMarsEdit内でアプリの検索から貼り付けまでを完結することができるようになります。

  • プラグインを起動するショートカットキーを押す
  • iPhone・iPad・Macなどの検索対象を選択
  • アプリ名検索
  • 表示するレイアウトを選択
  • HTMLタグが挿入される

という手順で完結できます。素晴らしい。(ただし設定がけっこうややこしいです)

上記はアプリのリンクを作成する例でAppHtmlMEについて書きましたがその他にもMarsEditに組み込むことができるプラグインはいろいろあります。

オフラインで編集可能

今となってはWebのビジュアルエディタもだんだん高機能になってきたのでその差が縮まっていますが、ビジュアルエディタとMarsEditの最大の違いはオフラインでもブログが書けるってことでしょうか。

テキストの執筆から画像の挿入までMarsEdit内で完結させておいてネットに繋がる時に一気にアップロードができるので作業を切り分けてできるメリットはあります。

WordPressのエディタの使い勝手が上がってきた

この記事を執筆してから時間も経ち今ではWordPress標準のエディタもかなり便利になってきました。

画像の挿入はOnePress Image Elevatorというプラグインが登場して完全にビジュアルエディタのほうが便利になったしマークダウンはWordPress 4.3から標準対応したし実際の見た目をそのまま再現することも可能だし。

徐々にブログエディタが必要になることも少なくなるんじゃないかなぁって思ってます。

まとめ

以上、WordPressのビジュアルエディタとMarsEditを比較していきました。昔ほどMarsEditにアドバンテージがありませんがオフラインでブログを書くなら選択肢のひとつとしてありかもという感じです。

カテゴリ: ソーシャルネットワーキング, 仕事効率化
価格: ¥4,800 (掲載時)
スポンサーリンク

このページのシェア・保存はこちら

コメント(本文のみでOK。URL含むコメントは承認待ちになります)

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