Alertifyはスライドして表示されるアラートダイアログです。シンプルな見た目で使い勝手が良いです。

Webシステムを開発していて意外と面倒くさいのがアラートではないでしょうか。入力エラー、設定完了など様々なアラートが存在します。そんな機能をいい感じに提供してくれるのがAlertifyです。


アラートボックスです。上から出現します。


確認ダイアログです。


OKを押したかキャンセルを押したかもちゃんと取得できます。


インプット付き。


ボタンと入力内容が取得できます。


ボタンのラベルは変更可能です。


ログメッセージもカスタマイズ可能です。

Alertifyはダイアログを上から下にスライドしながら表示し、その結果を右下に表示します。どちらも必要に応じて使い分ければ良いでしょう。ログメッセージは数秒経つと消えます。汎用性高く色々な場面で使えそうなソフトウェアです。対応ブラウザはIE7以降で、AndroidやiOSでもテストされています。

AlertifyはJavaScript製、MIT Licenseのオープンソース・ソフトウェアです。

MOONGIFTはこう見る

アラートの表示場所は、ユーザがすぐに気づく場所である必要があります。とは言えあまり目立つ場所に表示してしまうと本当に見せたいコンテンツを注目させられないかも知れません。さらにアラートの色によって注意が必要か、単なる確認程度なのかを分からせる必要があります。

最近筆者が目にしたのは問題なく完了したのにも関わらず警告のアイコンが表示されるケースがありました。何か不備があったのかと思い、内容を読むと“完了しました”の表記で、これは相当なストレスにつながります。ユーザ体験を若干でも邪魔するだけにその取り扱いは十分に考える必要があるでしょう。

alertifyjs - An unobtrusive customizable JavaScript notification system

fabien-d/alertify.js