SIRIUS(シリウス)のデザインモード

Tips_機能の拡張 Tips_プチ裏ワザ Tips_iPhone Tips_その他 購入者特典 購入者専用ページ

デザインモード

サンプル画像

 

『デザインモード』についてご説明しましょう。

 

これまでもシリウスは、もちろんHTMLタグなど気にせず、
ブログ感覚ですらすらと記事を作成することはできてたんです。

 

そうはいっても例えば「太字」などの文字装飾などを施すと
どうしてもタグがずらずらっと表示されてしまうことに変わりはありません。

 

結局のところ、見た目はHTMLタグのオンパレードですから
HTMLに詳しくない人にとっては(そうでない人にも)
ちょっと見づらい感があったことは事実です。(-_-;)

(もちろんプレビュー機能があるおかげでブラウザでの確認はできますが、ひと手間かかってしまうのが難点でした)

 

これが「デザインモード」が搭載されたことで、
太字の設定をしたら実際に太字になった状態の画面を見ながら
編集が続けられるようになったんです。

 

これは画期的なアップデートですよ。

 

と、ここまで誉めておいてこんなことを言うのもなんですが、便利だからといってデザインモードのみでの編集&修正作業を繰り返していると、場合によっては無駄なHTMLコードが増えすぎて結果的にサイトが重くなってしまうこともありえます。

そのためデザインモードに頼りきるのではなく、時々はHTML編集画面にも目も通してコードを確認するクセをつけておくといいですよ。

実践上のHTMLの勉強にもなるので作業の覚えが早くなります。

 

では実際にデザインモードをご紹介していきます。

 

こちら↓が通常の編集(テキストモード)画面とデザインモード時の比較です。

 

通常編集(テキストモード)画面(これまでの編集画面)では、
背景色や文字色の装飾を設定しているタグのせいで
慣れない人にはちょっと見づらいかもしれませんね。

 

キャプチャ画像

 

実際にデザインモード上で作業をしてみました。

 

下の画像の赤文字の『サンプルテキスト』という文の
フォントサイズを大きくしてみます。

 

キャプチャ画像

 

範囲選択してフォントサイズを選びます。

 

キャプチャ画像

 

ブラウザを起動しなくても実際に大きくなったのが確認できます。

 

キャプチャ画像

 

テキストモードに切り替えれば通常の編集画面に戻すこともできます。

 

キャプチャ画像

 

ただしこの段階ではまだ元の編集画面には反映されてないので、
必ず「OK」ボタンをクリックして変更を確定させましょう。

 

キャプチャ画像

 

残念ながら現時点では、
ランキングやポイントの挿入などには対応してないようです。

 

また完全にブラウザ上での表示を再現できるわけではないので、
プレビューでの最終確認は必ずやっておきましょう。

 

購入ページへ


てっぺん