HTML5対応のWYSIWYGなHTMLエディタ｢BlueGriffon｣の最新版(Ver 3.01)が公開されたので使ってみました。HTML5やCSSを知っていれば細かな事まで使いこなせますが、今回の試使用ではできるだけWYSIWYGの範囲で利用できる機能に絞ります。それでも多くの事ができます。
こちらの上部メニュ―｢download｣でページ下部に移行してダウンロード・インストールできます。
起動するとこちらの様になります。
今回は｢我家のIT化｣ブログのこちらの記事を、HTMLによる1ページ表示ができるようにします。他のサイトページへのリンクを含んだテキストとサムネイルによるリンクで画像を表示する必要があります。
先ず、「ファイル」→｢新しいページのオプション｣で言語として｢日本語(ja)｣を選択します(その他は変更せず)。こちらを参照。
一旦「ファイル」→「名前を付けて保存」とすると、ページの表題入力になります(こちら)。
記事のタイトルを入力して、実際のファイル名を指定した保存になります。
さて真っ新のページの左上にクリックして記事タイトルを入力します。その際「見出し3」を指定しておきます(こちら)。
「見出しn」は文字の大きさですから、必要により他の見出しサイズを選択できます。
記事見出し「・・・を公開」の最後に位置付けてEnterキーを押下すると、2番目の要素(段落)を入力できます(こちら)。
同様にしてテキストを段落毎に入力します。ただし、3番目の段落には画像を入れたいので空いた状態にしておきます(こちら)。
次に画像(サムネイル)をページに挿入します。これは画像挿入アイコンを使い、画像ファイルのローカルアドレスを指定します(こちら)。
さてここでクリックで画像を選択して「中央に位置付け」るアイコンを使います(こちら)。
最後にテキストをマークの上リンクのアイコンを選択して、飛び先のURLを設定します(こちら)。
画像からのリンクも同様ですが、画像についてはテキスト時のマークではなく)クリック選択をして飛び先のURLを設定します。
完成したらブラウザでプレビューします(こちら)。
最新のFirefox及びChrome系では確認しましたが、IE系・Edgeでは表示できないor一部機能しないなどの問題が出ていました。
ブラウザで表示した結果がこちら。
