HTMLコーディングの問題点を浮かび上がらせてくれるブックマーク·DiagnostiCSS MOONGIFT
DiagnostiCSSはJavaScript製のオープンソース・ソフトウェア（MIT License）です。 Webブラウザはよく出来ていて、Web標準に沿っていなくともそれっぽく表示してくれます。しかしそれに安穏としているとレガシーなブラウザなどで表示が失敗したり、意図した動作にならないことがあります。そこでDiagnostiCSSを使ってチェックしてみましょう。 MOONGIFTで実行しました。様々な枠が表示されました。 マウスオーバーで画面上部にメッセージが表示されます。例えばonclick指定の指摘です。 かなりダメなところは赤い枠になっています。 DiagnostiCSSでは問題のあるHTML要素について枠で囲むことで問題を把握しやすくしてくれます。主にインラインスタイルやイベント属性、無効なリンク、空または廃止予定の要素、必要な属性のない要素などがリストアップされます。 HT
小規模なWebサイトにぴったり。PHP製のメールフォーム·TransmitMail MOONGIFT
TransmitMailは日本製の汎用型メールフォールソフトウェアです。 Webサイトにメールフォームの設置というのはよくあることです。そんな時に使える日本語対応のメールフォームソフトウェアがTransmitMailです。 デモです。多数の入力項目、入力チェックに対応しています。 必須チェックのエラーです。画面上と項目の横と二つ表示されます。 メールアドレスフォーマットのチェックもできます。 半角英数などの文字種チェックもあります。 入力の後、確認画面が表示されます。 完了ページです。 確認メールも送信されて、入力内容の確認ができます。 TransmitMailはPHP5.2以上で動作します。また、マークアップエンジニアが開発したとのことで、Dreamweaverやマークアップエンジニアにとって優しい作りになっています。セッションによって重複送信を防ぐ仕組みがあります。静的サイトにメールフ
あなたのWebアプリケーションは安全か。Google製のセキュリティチェッカー·Skipfish MOONGIFT
SkipfishはSQLインジェクションをはじめWeb向けの脆弱性を発見するソフトウェア。 SkipfishはGoogle製のオープンソース・ソフトウェア。2011年になってセキュリティインシデント関係の話題が飛び交っている。特に大きいのはソニーだろう。あそこまでの規模は相当珍しいが、何も対岸の火事という訳ではない。 オプション セキュリティホールを狙うのは人間に限らない。日々クローラーがWebサイトにアクセスしてセキュリティホールを狙っているのだ。狙われる前にSkipfishを使って自主的にチェックしてみよう。 SkipfishはGoogleが開発したセキュリティチェックソフトウェアだ。ターミナルで動作するソフトウェアで、指定したURLに対してSQLインジェクションやXSSなどWebアプリケーションが狙われやすい脆弱性をついてくる。結果はHTMLベースのレポートとして出力される。 結果は
jQueryを使った開発に便利！Firebug + jQuery·FireQuery MOONGIFT
Firefoxを使ってWebシステムを開発する際には必須とも言えるFirebug。そして人気の高いJavaScriptライブラリのjQuery。この二つが組み合わさったとき、これまで以上の魅力が感じられるようになる。 マウスを当てるとそのエレメントがハイライト表示される そう確信できるのがFireQueryを使った瞬間だ。この二つの融合は、JavaScriptの開発をバーストしてくれるのではないだろうか。 今回紹介するオープンソース・ソフトウェアはFireQuery、Firebugと連携するjQuery開発補助アドオンだ。 FireQueryはconsole.logに吐き出した内容を元に、画面上のエレメントをハイライトしてくれる。例えばconsole.log($('p'));と出せば、コンソールに出力された jQuery(p)という表示にマウスを当てると、該当部分がハイライト表示になる。ど
その正規表現で大丈夫？Mac OSX向けの正規表現チェッカー·Reggy MOONGIFT
プログラミングをしていると正規表現を利用するケースは数多いと思う。正規表現をうまく使いこなせば、数十行かかるコードもたった一行で終わってしまうこともあるし、複雑な内容も正規表現で書くとごくシンプルになったりすることもある。 反映はリアルタイムに行われる そんな便利な正規表現ではあるが、文字コードやオプションの付け方、様々なパターンの中でバグになることも多い。その書き方で正しいか、今一度チェックしてみよう。 今回紹介するオープンソース・ソフトウェアはReggy、GUIの正規表現チェッカーだ。 Reggyは下半分に書かれた文字列を上に書いた正規表現で探すことができる。ヒットした文字列は青色（変更可能）になる。複雑な正規表現が指定した文字列に対してきちんと対応しているか、リアルタイムに反映されるので簡単にチェックできる。 日本語でも利用可能 日本語の文章、パターンともに利用できる。オプションはM
MOONGIFT: » MySQLの状態をブラウジング「MySQL Server Monitor」:オープンソースを毎日紹介
小〜中規模のWeb開発でMySQLが使われる機会は多い。常に監視するのは大変だろうが、それでも現状どのようになっているのかモニタリングしておくのは大事だ。だが、ターミナルで接続してインストールするソフトウェアは環境によって利用できないこともある。 複数のサーバを見ることが可能 そこで、ブラウザベースで監視できるソフトウェアを紹介しよう。これならばどのような環境でもすぐに利用できる。 今回紹介するオープンソース・ソフトウェアはMySQL Server Monitor、MySQLモニタリングソフトウェアだ。 MySQL Server Monitorは複数のMySQLサーバを同時に監視できるソフトウェアで、画面上部のタブを使って切り替えることができる。サーバのトラフィック、クエリー数、クエリーキャッシュについて知ることができる。 取得できるデータの一覧 PHPベースで作られているので、レンタルサ
MOONGIFT: Safari/Firefoxのブックマークを一元管理「AllBookmarks」:オープンソースを毎日紹介
ブラウザを利用サービスによって使い分けることがある。例えばレンダリングが速いSafariはGMailやGoogleリーダーなどのAjax系Webアプリケーションで、開発はFirebugを擁するFirefoxを使う等。 何でも同じブラウザで行う必要はないが、ブックマークが分散してしまうのが辛いところだ。そこでこれを使って統一してしまおう。 今回紹介するフリーウェアはAllBookmarks、各種ブラウザのブックマークをシームレスにつなげるソフトウェアだ。 AllBookmarksを起動すると、メニューバー上にアイコンが表示される。これをクリックすると各種ブラウザのお気に入りが表示される。対応ブラウザはSafari/Camino/Firefox/Flocl/OmniWebとなっている。 ブラウザごとにサブメニュー化することも、全て統一して表示することもできる。ブックマークをブラウザ間で同期する
MOONGIFT: » クリックする場所を測定するアクセス解析「ClickHeat」:オープンソースを毎日紹介
アクセス解析からは様々な情報が読み取れる。これを無視してサイト改善はあり得ない。だが、取れる情報は断片的なものだけで、実際にユーザがどういったアクションを起こしているのかは仮説を立てて検証していくしかない。 MOONGIFTのヒートマップ その仮説に役立てるのに便利なソフトウェアがこれだ。 今回紹介するオープンソース・ソフトウェアはClickHeat、クリックされた場所をビジュアル化するアクセス解析ソフトウェアだ。 これは面白い。ClickHeatから生成されるJavaScriptのコードをサイトに埋め込んでおき、しばらくするとサイトのスクリーンショットをバックグラウンドに、クリックされた場所がポイントとして表示される。 JavaScript生成画面 何度もクリックされる場所があると、そこがさらに色濃くなっていく。青から赤へと、まるで炎の温度やサーモグラフィのようだ（なのでヒートマップなの
MOONGIFT: » 入力した直後にバリデーション「LiveValidation」:オープンソースを毎日紹介
※ 画像は公式サイトデモより 人間は面白いもので、自分の好きな情報だけを見るようにフィルタリングをかけることができる。文字が見づらいコンピュータでは特にそうだ。書いてあるにも関わらず入力エラーが起こるなんて良くあることだ。 そして、それらの入力エラーはユーザにとって非常にストレスになる。自分自身、エラー画面で面倒になって止めてしまうなんてざらだ。そうした機会損失を防ぐためにもこのライブラリを使ってみよう。 今回紹介するオープンソース・ソフトウェアはLiveValidation、その場で行う入力チェックライブラリだ。 LiveValidationはJavaScriptベースの入力チェックライブラリで、特徴は何といってもその場で入力エラーをチェックできることにある。フォーム送信時にまとめてチェックすることもできる。いずれにせよエラーがあった際にはデータは送信されないのでユーザビリティは高い。
MOONGIFT: » 高機能JavaScriptスライド「Slideshow」:オープンソースを毎日紹介
※ 画像は公式サイトデモより。 Mac OSXに付属するiPhotoで好きなのは、スライドショーをはじめた時に写真が斜めに動きつつ、スライドしていく所だ。ただ写真を切り替えるだけでない、気持ちのいい演出だ。 同じ事は他の場面でも言える。Webで見せる時だって、ただ映し出していけば良いと言う訳ではない。 今回紹介するオープンソース・ソフトウェアはSlideshow、写真を華麗に演出してくれるJavaScriptライブラリだ。 Slideshowは表示する画像を配列で指定する事で、自動的に写真を切り替えて表示してくれる。特に、iPhoto同様に写真が移動しながら表示される点や、写真が変わる際にフェードアウトしながらと言う演出が良い。 他にも横からスライドしながら切り替わるものや、矢印での移動、サムネイル切り換え等、多彩なアクションが可能になっている。自動、手動どちらでの操作も可能だ。 写真は見
MOONGIFT: » ついに登場！CSSフレームワーク「Blueprint」:オープンソースを毎日紹介
誰かがきっと作ってくれると思っていた。 prototype.jsのようなライブラリを利用するのは、便利な機能が多いという事もあるが、各ブラウザ間での相違を吸収してくれるという点も大きい。 その点において、CSSもまた各ブラウザ間での表示の差異が大きい。そこで試してみたいのがこれだ。 今回紹介するオープンソース・ソフトウェアはBlueprint、ブラウザ間の描画差異を吸収して簡単にマルチカラムを実現してくれるCSSライブラリだ。 Blueprintはヘッダ、コンテンツ、サイドバー、フッターのようなテンプレートをクラス指定するだけで簡単に作成できる。デフォルトのフォーマットはリセットされているので、ブラウザ間の違いが出るマージンやパディングの差異も吸収してくれている。 また、印刷時のCSSも用意されている。これを使えば印刷時やプリンタ経由でのPDF作成時に綺麗なものが仕上がるようになる。今後の
MOONGIFT: » Flashムービー形式でデスクトップ録画「JING」:オープンソースを毎日紹介
チャットなどをしていると、デスクトップを見せたくなる時がある。ヘルプをしている時は特にそうだ。あれこれ口で説明するよりも、見せたほうが理解は早い。 また、場合によっては静止画よりも動画のほうが分かりやすいこともある。そのどちらにも対応した共有ソフトウェアがこれだ。 今回紹介するフリーウェアはJING、スクリーンキャプチャ、スクリーンキャストの双方に対応したデスクトップ録画ソフトウェアだ。 JINGはMac OSX、Windowsに対応している。指定範囲のスクリーンキャプチャはもちろん、指定範囲でのスクリーンキャストにも対応している。録画された内容は音声付でFlashムービー形式で保存される。 このデータをScreencast.comを通じてシェアするには有料になっている。JING自体の利用は無料なので、アップロードスペースが別であれば問題ない。何より、各種Flash動画プレーヤを使って再生
MOONGIFT: » 絶対お勧め！JavaScriptでテーブルソート「Table Sorter」:オープンソースを毎日紹介
Web開発の現場において、データの並べ替え機能の要望は良く出る話だ。開発がある程度終わった段階で言われたりするとショックを受ける事もある。検索条件をパラメータで引き継いで、ページ番号も…なんて考えただけでも嫌になるだろう。 そんな経験のある、またはこれから経験するであろう方にお勧めのソフトウェアがある。これさえ使えばソート処理は怖くない。 今回紹介するオープンソース・ソフトウェアはTable Sorter、JavaScriptのみで実現するソートライブラリだ。 この手のライブラリはこれまでいくつかあったが、iframeを使ったり、表示に特定の手法が必要だったりと、そのままでは使いづらいものが多かった。Table Sorterはそれらの完成版ともいえるかも知れない。 何せ、読み込むのはJavaScriptファイル一つだけ、さらに普通のテーブルタグに対して、ヘッダ部分はtheadタグとthタグ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
