FC2ブログ

 RSSリーダーで購読する   »FC2共有テンプレート関連の記事はこちら

Topic Path

トップ > web制作に役立つ知識

スポンサーサイトこのエントリをはてなブックマークに登録

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

BOT? そんなのぼっこぼっこにしてあげるんだもん……なPHP用キャプチャモジュール「妹認証」このエントリをはてなブックマークに登録


妹認証 - 妹がBOTからプログラムを守る


妹認証 - 妹がBOTからプログラムを守る
すでに色々なニュースサイト
これは新しい妹CAPTCHA「妹認証」:phpspot開発日誌
妹の質問に答える非常に斬新なPHP用のCAPTCHAモジュール「妹認証」 - GIGAZINE
にも取り上げられていますが、気になったのでw
いや~これは画期的だ。
アイデアとしては前々からありそうな感じですが、良い感じに形になったのがポイントですね。
ネタだネタだと言われ、実用面が疑問視されていますが個人的には特定のジャンルに絞ったイラストサイトなんかにいいんじゃないかと思います。
たとえば東方やJOJOみたいに特定のセリフに相応するスラングがある場合に使えますね。
JOJO
仗助を誘き寄せたらお前の命は助けてやる。
本当にそれで助けてくれるのか?
もちろん――
東方
咲夜さんの別名は――?

みたいに訪問者なら誰にでも分かる問題が望ましいでしょう。

問題なのは、どれだけイラストサイト製作者が使用できるかですが。
PHPモジュールなのでコメントフォームなんかは自前で用意するか改造しないといけないので若干スキルが必要かも。

あとwordpressプラグイン誰か作ってくれないかなーと思ったら公式で製作されているそうです。
おかねすいた。 » Blog Archive » 【妹認証】Wordpress用プラグインの制作を開始
おかねすいた。 » Blog Archive » 【妹認証】Ver0.4.betaの追加仕様、今後、Wordpressプラグイン
こちらにも期待したいところですねー。
いや~楽しみ。
若干導入を検討中。。
スポンサーサイト

bookmark: JSONとJSONPこのエントリをはてなブックマークに登録


JSONとJSONP[to-R]


JSONとJSONP[to-R]

JavaScript Object Notation - Wikipedia

一年前くらいに結構ハマッたjson & jsonpのフォーマットについて簡潔にまとめられていたのでメモしておきます。
jsonというとこの手軽な感じが便利なんですが、しいて使いどころの(本当にAjax互換な処理をクロスドメインでするくらいしか)思いつかないところがイマイチで個人的には大好きなポイントだったりします。

jQueryだと手軽なんですが、手間はxmlと大して変わらんので自サイトならわざわざjsonフォーマットを使う意義はないかな~という不憫な子だったり。

WordPress 2.6がリリースこのエントリをはてなブックマークに登録


WordPress | 日本語 ? WordPress 2.6


WordPress | 日本語 ≫ WordPress 2.6
早すぎwwww
完璧に意表を付かれたんですが。
予定よりもかなり前倒ししたみたいで、もう2.6がリリースされたようです。
新機能については
大体前の通り
  • 投稿の校正 : Wikiのように編集履歴を追える
  • ウェブ上のどこからでも投稿できる投稿ブックマークレット
  • Gearsに切り替える: ブログを高速化する
  • テーマプレビュー: 読者が見える前にテーマを見られる

が中心みたいです。
よし、そろそろうpグレードするかー。

ついでにブラウザにGearsも入れてみるか。

画像に強力なレタッチエフェクトをかけられる「imagefx.js」このエントリをはてなブックマークに登録

Nihilogic : Javascript Image Effects

Nihilogic : Javascript Image Effects
これはすごい。
canvasでエレガントにエフェクトを施すスクリプトは結構あるんだけどここまでまとまった機能を提供しているのはなかったなぁ。
機能の一覧は以下の通り。
  • fliphorizontal
  • flipvertical
  • invert
  • desaturate
  • blur
  • blurfast
  • blurmore
  • sharpen
  • sharpenmore
  • edges
  • emboss
  • laplace
  • noise
  • lighten
  • brightness
  • sepia
  • histogram
記法は

	<img src="image.jpg" id="myimage" />

	<script type="text/javascript" >
		jsImageFX.doImage(document.getElementById("myimage"), "blur");
	</script>

もしくは

	<img src="image.jpg" imagefx="blur" />

で動作します。
jQueryが使える環境ならこんな感じでどうでしょう。
<script type="text/javascript">
$(function() {

		$("img.imagefx").attr({
			imagefx: function() {
			
			return $(this).attr("rel");
			
			}
		});
});
</script>

こうしておくと、class="imagefx" rel="エフェクト名"で動作するのでなかなかスマートだと思います。
実際に使う際はエフェクトを使う分だけ必要なjsファイルをインクルードしてください。
<script type="text/javascript" src="imagefx.js"></script>
<script type="text/javascript" src="imagefx_none.js"></script>
<script type="text/javascript" src="imagefx_invert.js"></script>
<script type="text/javascript" src="imagefx_desaturate.js"></script>
<script type="text/javascript" src="imagefx_blur.js"></script>
<script type="text/javascript" src="imagefx_blurfast.js"></script>

<script type="text/javascript" src="imagefx_blurmore.js"></script>
<script type="text/javascript" src="imagefx_blurmotion.js"></script>
<script type="text/javascript" src="imagefx_sharpen.js"></script>
<script type="text/javascript" src="imagefx_sharpenmore.js"></script>
<script type="text/javascript" src="imagefx_emboss.js"></script>
<script type="text/javascript" src="imagefx_fliphorizontal.js"></script>
<script type="text/javascript" src="imagefx_flipvertical.js"></script>
<script type="text/javascript" src="imagefx_noise.js"></script>
<script type="text/javascript" src="imagefx_lighten.js"></script>

<script type="text/javascript" src="imagefx_laplace.js"></script>
<script type="text/javascript" src="imagefx_edges.js"></script>
<script type="text/javascript" src="imagefx_brightness.js"></script>
<script type="text/javascript" src="imagefx_sepia.js"></script>
<script type="text/javascript" src="imagefx_histogram.js"></script>

imagefx.jsがコア部分で、エフェクト毎にjsファイルを読み込んでいくことになります。
また、このエフェクト用のjsファイルなんですが、ダウンロード先がなかったのでurl書いておきますー。
zipとかなら楽なんですがね~。
というわけで面白そうなので実際に試してみます。
[画像に強力なレタッチエフェクトをかけられる「imagefx.js」....の続きを読む]

default


blur


desaturate


emboss


fliphorizontal


flipvertical


noise


laplace


ブラウザや、環境によっては正しく反映されてないかもしれません。

firebugの機能を拡張するチュートリアルこのエントリをはてなブックマークに登録


Ajaxian ? Extending Firebug Tutorials


Ajaxian ? Extending Firebug Tutorials

firebugの機能を拡張するチュートリアルまとめ。
主にどんなことができるかというと、firebugにボタンを追加したりできるみたいです。
firefox拡張制作よりの内容ですね。

firebugに項目増やしたところで僕の貧弱な脳みそでは新たな使い道が思い浮かびませんが。
一応メモしておきます><

bookmark: FC2・MovableType・WordPress…テンプレート・スキン構造の比較このエントリをはてなブックマークに登録


FC2・MovableType・WordPress…テンプレート・スキン構造の比較 : ウェビンブログ


簡素にまとめられているのでカスタマイズ前提でこれからブログを始めようという人は便利そう。

まとめられているBlog or CMSツールは以下のとおり。

# FC2ブログ・忍者ブログ
# Seesaaブログ
# MovableType
# WordPress
# Nucleus



特に図のまとめ方が素晴らしいです。
FC2・MovableType・WordPress…テンプレート・スキン構造の比較 : ウェビンブログ


FC2・MovableType・WordPress…テンプレート・スキン構造の比較 : ウェビンブログ


このようにきれいにまとめられています。

詳細な解説ではありませんが、今まさに迷っているという人にはとてもわかりやすい記事だと思います。

絵描きにオススメできそうなWordPressテーマ Gentokiこのエントリをはてなブックマークに登録


フォトログ、写真アルバムのWordPressテーマ Gentoki | WordPressで企業ウェブサイト作成・商用ホームページ制作 WordPress Go Go



フォトログ、写真アルバムのWordPressテーマ Gentoki | WordPressで企業ウェブサイト作成・商用ホームページ制作 WordPress Go Go
たくさん絵を描く人(アナログで描いた鉛筆原画など)におすすめのwordpressテーマ。
トップに描いたイラストを表示してその制作過程を記録した画像を公開するというスタイルもいいかもしれない。
記事トップの画像が丁度このテーマのデモンストレーションをキャプチャしたものでトップページの画像となっています。
このトップの一覧表示ページには各記事の一番目の画像が自動で表示される仕様になっているみたいです。
テーマを適用すると、記事を作成する際の使い方はとても簡単で画像をアップロードしたあと[gallery]タグを挿入するだけです。

そして記事へのリンクをクリックするとこのような感じに。

フォトログ、写真アルバムのWordPressテーマ Gentoki | WordPressで企業ウェブサイト作成・商用ホームページ制作 WordPress Go Go


lightboxで次々とロードされていく様子が壮観でワクワク感があります。

個々の画像をクリックするとこのようにlightboxで画面内にオーバーラップして表示されるので次々と見ていくことができます。

フォトログ、写真アルバムのWordPressテーマ Gentoki | WordPressで企業ウェブサイト作成・商用ホームページ制作 WordPress Go Go


キャプションは画像のアップロード時に(面倒ですが)個別に指定することもできるので、ちょっとした説明を入れることも可能。
また、普通に文章も投稿できるので([gallery]タグを表示したところに画像の一覧が挿入される)ので記事を書くこともできます。。
[gallery]タグの使い方については同じくこちらのサイトさんで解説されているので参考までに。

WordPress 2.5の新機能 ギャラリー[gallery]を使って画像一覧表示する | WordPressで企業ウェブサイト作成・商用ホームページ制作 WordPress Go Go

沢山絵をアップロードしたいけど、手軽にブログでアップしたい。
そういう人に向いているテーマといえるでしょう。

とにかく絵描きの人にもよさそうなテーマ。

bookmark: WordPress 2.6 Beta 1リリースこのエントリをはてなブックマークに登録


WordPress 2.6 Beta 1リリース | WordPressで企業ウェブサイト作成・商用ホームページ制作 WordPress Go Go


WordPress 2.6 Beta 1リリース | WordPressで企業ウェブサイト作成・商用ホームページ制作 WordPress Go Go

丁寧にまとめられていたので。

* 投稿での画像コントロールを提供する新しく改良された画像編集ダイアログ
* WordPress.comリンクを新しいウインドウで開くで見られるようなテーマプレビュー
* 管理ページの読み込みを早くするために、Gearsを使用して静的ファイルをキャッシュする
* 投稿エディターでの単語カウント
* ドラッグアンドドロップでのギャラリーのソート
* プラグインの削除、有効化、無効化をまとめて行う
* TinyMCE 3.1.0.1


この辺りが特に気になりますー。

今年はwordpressユーザを中心にGearsが普及しそうな予感。
webアプリのオフライン化はAdobe AIRとかを中心に展開しつつあるけど、Gearsは全然見かけないなぁー。
GearsというとGoogleが公式で出しているwebアプリ以外に実際に取り入れられているサイトを見たことないのもあったので、少しでも増えてほしい。

bookmark: shiftzoom.jsこのエントリをはてなブックマークに登録


shiftzoom.js (zoom and pan functionality)


shiftzoom.js (zoom and pan functionality)
グラフィカルなライブラリで有名なnetzgesta.deの新しいライブラリです。

こういうスクリプトって結構種類はあるのだけれど、記法がとても単純なのが魅力ですねー。
基本的には<head>で

<script type="text/javascript" src="shiftzoom.js"></script>

// only if the cursor images for IE are not in the current path
<script type="text/javascript">
shiftzoom.defaultCurpath='images/cursors/';
</script>


このようにインクルードしたあと

<img onLoad="shiftzoom.add(this);" src="" alt="" />

これだけです。

デモンストレーションも魅せ方がうまい。
shiftzoom.jsのデモンストレーション
左上の+を押して画像上をドラッグするとぬるぬるとズームしていきます。

使いどころはなかなか難しいですが、絵描きさんのギャラリーページなどで使えるのではないかと。
アナログベースで描き進めているとどうしてもサイズが大きくなりがちなので。

via: Ajaxian ShiftZoom: Zoomify your oversize images.

jQuery UI 1.5.1がリリースこのエントリをはてなブックマークに登録


jQuery UI 1.5.1


jQuery UI 1.5.1

とりあえずバージョンが上がっていたのでメモ。

機能追加などはなくバグフィクスが中心のリリースです。

UI/Changelog/1.5.1 - jQuery JavaScript Library

Effects

* Core
o Typo in createWrapper [#2974, #2975]
* Clip
o Clip effect should be animating the wrapper [r292]
o Corrected context (thisArg) of callback [r293]
o Fix for clip to better work with images (animates wrapper for images only) [r330, r331]
* Fold
o Allow folding to occur horizontally first [r287]
* Scale
o Easing doesn't work for effects.scale [#2967]
* Transfer
o Transfer effect transfers to the wrong place in Safari 3.1.1 [#2983]



さらっとchangelog見てみましたが特に関係ある項目はなさそう。
Effectsはちょっとしたbugの修正ですねー。

あと、だい亜りーのほうでjQuery UIのEffects部分を中心にしたチュートリアルも公開しています。
宜しければご一緒にご覧ください。

ごく簡単なjQuery UI:Effectsのチュートリアル » だい亜りー
about me.

ajin

Author:ajin
フレームだけで4万円位する伊達メガネをかけています。
無駄なことが大好きです。

僕の本家サイトajin.jpとそのブログ、だい亜りーも宜しければご覧ください。

このブログの説明

あとテレパシー少女 蘭から電波を受信中。
翠可愛すぎて失神しそう。

最新記事

»すべての記事を見る

カテゴリ
気になるモノ
言及した記事へジャンプします。
月別アーカイブ
最新コメント
今読んでいる本
スポンサード リンク
どく×あま!
読書メーターとAmazonアソシエイトを連動させるブログパーツです。 生成はこちらから
検索フォーム
あわせて読みたい
あわせて読みたいブログパーツ
スポンサード リンク
リンク
全ページ、リンク・アンリンクフリーです。 特に許可は必要ないです。 好きなページをどうぞ。
メールフォーム
ご意見・感想又は相互リンクをご希望の方は下記のメールフォームよりお問い合わせください。

名前:
メール:
件名:
本文:

QRコード
QRコード
フィード
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。