HTMchen : シンプルなHTMLエディタ
OS10.5.8以上（UB）
フリーウェア


シンプルなHTMLエディタ「HTMchen」の紹介です。

上部にHTMLテキストを入力して、下部でプレビューします。仕切りのポッチをダブルクリックして、素早くプレビューを隠せます。



ウインドウ上部の各タグをクリックして、そのタグを挿入します。
もちろん入力済みのテキストに対してもタグで囲うこともできます。例えば下のようにテキストを選択します。


この状態で <p> タグをクリックすると選択しているテキスト部分をタグで囲います。




他にも <a> タグでリンクタグを作成するとき、予めリンク先のページのURLをクリップボードにコピーしてから、<href> タグをクリックすると、そのURLでのタグを作成します。




右端のプルダウンメニューから、他のタグを挿入できます。ショートカットキーも割り当てられています。


よく使うものとしては、

• <em> --- command+I(アイ)
• <strong> --- command+B
• <br /> --- command+return

などがあります。



動作が遅いときは、プレビューの自動更新を止めるといいでしょう。環境設定から設定できます。


ウインドウ下部のアイコンをクリックして、プレビューの有効/無効の切替やプレビューの手動更新を実行できます。



この HTMchen はとてもシンプルだけど、使いやすくできています。手書きでHTMLを書いてる人には便利だと思います。






この記事では HTMchen 1.0.3 を使用しています。

（ダウンロードリンク）
Site top page : MOApp Software Manufactory - Home
Download page : HTMchen - create.live.love

Web ページ作成.app : 画像ファイルをドロップして、それらをレイアウトしたHTMLを生成する
Apple純正アプリケーション


画像ファイルを保存したフォルダや、複数の画像ファイルを「Web ページ作成.app」にドロップして、それらの画像をレイアウトしたhtmlファイルを生成するドロップレットアプリケーションです。


画像ファイルを保存したフォルダをドロップしてみます。



すると、/Users/アカウント名/Pictures の場所に「Web ページ（・・・・）」というフォルダが作られ、その中に「index.html」とリソースの画像を保存したフォルダが作成されます。



そして、自動的にデフォルトの Webブラウザ で、それを開きます。

（↑Safari で開いた様子）

画像サムネイルの下にファイル名も表示されます。
各画像のリンクをクリックすると、その画像単独で表示されます。




「Web ページ作成.app」にファイルをドロップせず、普通に Finder でダブルクリックして開いたとき、環境設定を開けます。

背景の色・キャプションの文字の色、サムネイルの大きさなどを設定できます。



この「Web ページ作成.app」は、写真画像のホームページを作成するときなどに、役立つかと思います。






「Web ページ作成.app」は
/System/Library/Image Capture/Automatic Tasks/Build Web Page.app
の場所に保存されています。

Dotty Empire : JPG画像からドット絵風のHTMLファイルを生成する
OS10.2以上（PPC）
フリーウェア


JPG画像からドット絵風のHTMLファイルを生成する「Dotty Empire」の紹介です。

ドット絵風に加工したいJPG画像を用意して、Dotty Empire のアイコンにドラッグ＆ドロップします。


しばらくすると、画像ファイルと同じフォルダ内にHTMLファイルが生成されます。




元の画像と生成されたHTMLを比べてみると、下のような感じです。

（元のJPG画像）



（Dotty Empire で生成したドット絵風のHTML）



Dotty Empire をダブルクリックで普通に起動すると、ウインドウが表示されて、ここで1マスの大きさや隙間の間隔などを設定できます。


ただ、僕の環境ではtypeの設定がうまく行かず、●や★のタイプを選択してもうまく生成できませんでした。






この記事では Dotty Empire 0.7.1 を使用しています。

（ダウンロードリンク）
Site top page : teatimelogic
Project page : teatimelogic - DOTTY EMPIRE
Download page : teatimelogic - Download DOTTY EMPIRE

LiTaG_cocoa : リンクのためのアンカータグを生成するツール
OS10.3.9以上（UB）
フリーウェア


リンクのための <a href="http://hoge.com/" title="Title">Title</a> のようなアンカータグを生成するツール「LiTaG_cocoa」の紹介です。

ホームページやブログを持ってる人にとっては、リンクタグを作成するのに便利なアプリケーションです。


使い方は、Webブラウザで表示されているリンクや、アドレスバーのファビコンなどをウインドウにドラッグ＆ドロップして登録します。

（FinderからインターネットロケーションファイルをドロップしてもOK）

これで、そのリンクを選択して command+C（Dafault） で、クリップボードにそのリンクタグをコピーします。

（改行を除去したい場合は shift+command+C ）


コンテキストメニューからも、リンクタグをコピーできます。




コピーされるタグの内容は、Default, 2nd, 3rd, 4th と4種類のパターンがあり、下記のようになります。（デフォルト設定のままの場合）

[ Default ] command+C

<a href="URI" title="TITLE">TITLE</a>

[ 2nd ] option+command+2

<a href="URI" title="TITLE" target="_new">TITLE</a>

[ 3rd ] option+command+3

<blockquote cite="URI" title="TITLE"><p><!-- text --></p></blockquote>

[ 2nd ] option+command+4

<q cite="URI" title="TITLE"><!-- text --></q>

これ他の設定は、環境設定（ command+, ）の「タグマクロ」タブから変更することができます。




登録された項目をダブルクリック、もしくは command+I(アイ) でインスペクタウインドウが開きます。

ここで「Title」「URI」の編集ができます。
（「Name」は LiTaG_cocoa で表示される名前で、リンクタグには反映されません）

また、各種リンクタグのパターンも表示されます。




登録したものを検索することもできます。

虫眼鏡アイコンをクリックして、検索対象を選択できます。

環境設定の「アイテムリスト」タブでは、インクリメンタルサーチを有効にできます。







この記事では LiTaG_cocoa 2.2 を使用しています。

（ダウンロードリンク）
Site top page : AYNiMac
Download page : Mac用アンカータグ作成ツール「LiTaG cocoa 2.2」

TaggingService : HTMLタグを入力するときに便利なサービス
OS10.0以上（PPC）
フリーウェア


テキストエディタなどでHTMLタグを入力するときに、所定の書式で書いたものを選択して実行すると、それにHTMLタグを補完してくれるサービスメニューアプリケーションの「TaggingService」の紹介です。

【 TaggingService - 使い方 】

例えば Smultron を使って次のように、「strong:文字列」と入力し、これを選択します。



サービスメニューから「Tag Text」を実行するか、
command+|(Pipe) のホットキーを入力します※。



すると、選択していた箇所が <strong>文字列</strong> のタグに変換されます。



※command+|(Pipe) = shift+command+\
半角英数入力でないと、このホットキーは機能しません。





他にも、下記のような「タグ:文字列」という風に、文字列をHTMLタグに変換します。

img:http://imgs.com.image.jpg
　　　↓
<img alt="" src="http://imgs.com.image.jpg"/>



a:リンクタイトル
　　　↓
<a href="">リンクタイトル</a>



url:http://hoge.com
　　　↓
<a href="http://hoge.com"></a>



HTMLのタグは、慣用句としてクリップボードユーティリティなどで登録して使うとか、「ことえり」辞書に登録したりすると、スムーズに入力できると思いますが、
この TaggingService の場合は、「タグ:文字列」という風にタグの部分を後から追加して、選択、変換といった場面で便利に使えると思います。



サービスメニューなので、原則Cocoaアプリケーションで文字入力できるアプリケーションでしか、「TaggingService」は機能しません。

【 TaggingService - インストール 】

ダウンロードした「TaggingService.service」ファイルを

（個別ユーザで使う場合）
/Users/登録アカウント名/Library/Services/

（すべてのユーザで使う場合）
/Library/Services/

どちらかのフォルダに保存して、再ログイン後に「TaggingService」が使用できるようになります。

※「Services」フォルダが存在しないときは、新たにこの名前で作成します。






この記事では TaggingService 1.2 を使用しています。

（ダウンロードリンク）
Site top page : MonkeyFood
Download page : Tagging Service



（関連記事）
サービスメニュー --- サービスメニューの基本的な使用例