« 2006年08月 | ブログ トップ | 2006年10月 »

フォーマット変換サイト

2006年09月28日

Media Converterはいろいろな形式のファイルを異なった形式に変換してくれます。
たとえばMP3をWAVやAACに変換したり、AVIをMP4に変換したりしてくれる。
ちょっといいのが、URLを入れるとサイトを好きな形式でキャプチャしてくれる機能。これを使えばサイトの画像がほしいときにすぐ手に入る。
便利なサイトだな〜

»Media Convert - free and on line - convert and split sound, ringtones, images, docs

アクセシビリティ支援ツール

2006年09月27日

日立GPにZoomSightというサービスがある。
このサービスは何かというと、サイト組み込み型のアクセシビリティ支援ツールみたいなもので、機能としてはサイトを拡大したり、白黒にしたり、反転したり、サイトを読み上げたりできる。ブラウザへのインストールも超簡単なので気軽にできるのがいい。
使ってみた感じもメニューはシンプルで見やすいし使い方も簡単だった。こんな便利なものがあったとは、、、

しかーしこれはサービスを導入しているサイト内でしか使えないので、どこでも使えるってわけではない。
でもまぁこういうサイトがどんどん普及していけば、これからやって来る超高齢化社会にも対応していけるかも。通常の音声読み上げソフトはユーザーが用意しなきゃいけないので、高齢者には敷居が高いしね。
ちなみにHITACHIのサイトはZoomSightに対応しているので使ってみるといいかも。音声読み上げでこんな読み方されるんだーなんて発見もあるので結構勉強になる。

»日立GP : ZoomSight
»ZoomSightについて : HITACHI

画像をCSS側に記述するテク

2006年09月26日

Bob Image Replacement 略してBIRというテクニックらしいですが、ネーミングがイマイチ。でもこれは結構画期的な裏テクです。
ちょっと昔まではCSS側に画像を指定してHTML側にテキストを記述するって技が流行ったけど、アクセシビリティー的にはよろしくない(画像OFFの時に何も表示されなくなる)との事で今は廃れていました。だけどこのBIRテクを使うと画像がOFFでもテキストはちゃんとブラウザに表示されます。もちろん画像の記述はCSSに書いている。
以下、引用ソース

<style type="text/css">
 body {
  background:#d3d3d3;
  position:relative;
  z-index:1;
 } 

 .bir {
  background:transparent url('image.jpg') top left no-repeat;
  height:100px;
  width:400px;
 } 

 .bir span {
  position:relative;
  z-index:-1;
 }
 </style>
</head>
<body>
 <h1 class="bir"><span>Top-Level Text</span></h1>

引用元:One Web Developer’s Haven >> Blog Archive >> BIR

このBIRは素晴らしいテクニックなんだけど一つだけ問題があるんです。MacIEだと画像が表示されない。。。現状はMacIE対応がまだまだ存在するので、このテクを使うならMacIE非対応のときかMacIEだけ画像OFF時のテキスト表示をあきらめるかのどっちかになる。
まぁそこまでしてCSS側に持ってこなくてもいいって話なんだけど。。。
しかもこのテクのキモはbodyに入ってるz-index、あんまりbodyにz-indexはいれたくないしね。
ま、状況に応じて使うって感じだな〜

FirefoxでWebページの保存

今までWebページを保存するときは、保存専用ツールを使ってたんだけど、Firefoxでページが保存できて、なおかつ管理までできちゃうエクステンションを見つけた。
その名もScrapBook。ブックマーク感覚で使用できるので、あとで見ようと思っていていざページに行ったらページが削除されたなんて事がなくなります。

主な機能は
  • Webページの保存
  • Webページの選択範囲の保存
  • Webサイトの保存(掘り下げ取り込み)
  • ブックマークと同じような操作でコレクションを整理
  • マーカーやイレーサーといった色々なWebページ編集機能
  • 正規表現による全文検索や高速フィルタリング検索
  • Operaの「メモ」に似たテキスト編集機能

»ScrapBook - Firefox Extension

IE7 RC1をスタンドアローン

2006年09月25日

もう自分は入れる気ないけど、たまたま見つけたのでポスト。

»ウノウラボ Unoh Labs: IE7 RC1をスタンドアローンで動作させる方法

IE系のCSSハック一覧

2006年09月22日

メモがてらCSSハックの一覧を作ってみました。以下”iframe”で記述。
モダンブラウザなら全部緑になってるはず。
挙動が違ってたら教えてください。

はてブから書籍を見つける

以前投稿した記事に、はてブで同じ考えをもった人を探すってサイトを紹介したけど、今度ははてブから自分の好みにあった書籍を探してくれるってサイトを見つけました。
そんなには使わないと思うけど、こんな本があったんだーなんて発見があるかもしれないので、たまに使ってみようと思います。
»hateb->amazon

Googleカレンダーを携帯で見る

2006年09月21日

この前Gcalが日本語化になったから使う人も増えてきていると思うけど、やっぱ携帯電話で予定をチェックできないと十分に活用できているとは言えない。そこでたまたま見つけたGcalを携帯電話で見る方法。

  1. なにはともあれログイン
  2. サイドバーの下部にあるカレンダーの管理に行く
  3. 携帯で予定をチェックしたいマイカレンダーを選択
  4. 個人用 URLHTMLボタンをクリック
  5. 出てきたカレンダーのアドレスをクリック
  6. 移動後、右上の予定リストのタブをクリック
  7. そのURLをコピーして携帯電話に送る

以上でGoogleカレンダーが携帯電話で見られると思います。
ちなみに、非公開にしていると見られないといわれていますが、自分は非公開にしていても見られました。。。なぜだろう

»Google カレンダー

ブラウザの歴史を見る

WEBをやっているからには知っておきたいブラウザの歴史。
以前の会社にいるときにブラウザについていろいろ調べたんだけど、結構面白かった。
そんなブラウザたちの歴史を一枚にまとめたPDFが「フォクすけブログ」に上がっていました。
主にIEとネットスケープ社のブラウザたちですが、このぐらいはWEB屋として知っておきたい感じです。
今やブラウザは携帯からゲーム、ミシンまで搭載しているのでトコトン調べるのも面白いかも。

»Spread Firefox Japan - フォクすけ*ブログ - Firefox の歴史
»いまやミシンもWindows、インターネット接続なり! (MYCOMジャーナル)

フォーカス画像を変更しました

2006年09月20日

今回イラストを提供してくれたクリエーターはnobop designの弓坂さんです。
ロゴデザインやキャラクターを得意とするデザイナーさんなので、提供していただいたフォーカス画像もすごくいい感じです。
デザインフォントなども制作されているようなので、興味がある方は覗いてみてください。

最近使ってるGreasemonkeyスクリプト

2006年09月19日

Firefoxを使っている人なら知っていると思いますが、Greasemonkeyは非常に便利です。
このプラグインを入れてユーザースクリプトをインストールするとウェブページの見た目を変えてみたり、ページの機能を変更したりできます。
スクリプトが書ける人であれば案外簡単に自分用のユーザースクリプトを作れるので、よく見るページの広告やサイトバーを消したり、便利機能追加してみたりできます。
スクリプトができない人でもネット上にワンサカ落ちているので、自分の好みに合ったスクリプトをインストールすればもっとネットが快適になるかもしれません。

以下、自分が使っているGreasemonkeyスクリプト

»Greasemonkey (グリースモンキー)とは?

»Greasemonkey - Mozilla Firefox まとめサイト

Wiiが流行ればアクセシビリティも向上!?

2006年09月15日

昨日任天堂「Wii」の説明会が開催されたけど、なんと価格は25,000円だって。
この安さは爆発的に売れるなー
しかもWiiはゲームだけじゃなくて、ネット機能も満載ってところがキモ。
メールが送れたりデジカメ画像の編集なんかもできちゃうから、まだまだPCが苦手な人もWiiならこっちの世界に入ってくる可能性は十分ありそう。
んで、肝心のネットはOperaが搭載される。オプションってのが気になるけど

そのWiiでネットを楽しむ人が増えてきたら、WEB屋としては今までのPC画面のつくりを変えていかなくちゃいけなくなるだろうね。
ポインタの操作はたぶんWiiリモコンでやるだろうから、マウスのように思うようにいかないはずなのでリンクのリンク領域は大きくしなきゃいけなくなるし、サイト幅とかも固定にしてたらプラズマとか液晶のワイドスクリーンで意味がなくなっちゃうし(Operaだから拡大機能はあると思うけど)。
小さいサイズのテレビではズーム機能は使えないから代わりに文字サイズが拡大されるので、文字サイズの影響も考えて作りこまなくちゃいけなくなる。
タブ移動はどうなるかわからないけど、十字キーでリンクを移動する可能性も十分あるから、tabindexの設定とかもでてきそう。
そう考えていくと、アクセシビリティやユーザビリティはPC以上に重要になってくるし、W3Cの「CSS Techniques for WCAG 2.0」に書かれている様なことを実際に取り組んでいかなきゃいけない時代にやっとなりそう。
今まで腰が重かった制作の偉い人も、Wiiがヒットすることによって気づいてくれればいいんだけどなー まぁそのときにはもう遅いって噂もあるけど。。。

»任天堂岩田社長、「Wiiに毎日触ってもらうことでユーザーの拡大を」
»CSS Techniques for WCAG 2.0
»日本語訳 - WCAG 2.0のためのCSSテクニック

検索エンジンの「link:」コマンドでリンク元を見てみる

2006年09月13日

 Yahoo!、Google、MSNサーチなどの3大主要検索エンジンはいずれも、あなたのサイトがネット上の他のサイトからどのくらいリンクをしてもらっているかを「link:」というコマンドをいれてからその後にすぐにあなたのホームページアドレスを入れると表示してくれるようになっています。

 例えば http://www.m-n.com/index.html というページのリンク元数を知るにはGoogleのキーワード入力欄に、link:http://www.m-n.com/index.html と入れて検索ボタンをクリックします。

 そうするともし http://www.homepage.com/link.html というページがあなたのホームページにリンクをはっていれば http://www.homepage.com/link.html はリンク元リストに表示されるはずです。しかし、必ずしも http://www.homepage.com/link.html が http://www.m-n.com/index.html にリンクをしてもリンク元リストに表示されるとは限りません。何故なのでしょうか?

引用元:MarkeZine:第4回 Googleのリンク元表示数の減少について

上の引用文に書かれているとおりにikesaiでも実験してみた。
まずYahoo!でlink:コマンドを打ってみると、リンク元リストは325件ヒット。
次にMSNでlink:コマンドを打ってみると、265件ヒット。
続いてGoogleでlink:コマンドを打ってみると、52件ヒット。

あきらかにGoogleのリンク元リストが少ない! Googleの検索結果ではikesaiにリンクしているサイトは300件近くあるのに、リンク元サイトとして有効なのは52サイトしかないってことなのか?
これはPageRankに関係しているかどうかは定かじゃないけど、少なくも影響はしているから結構ショック。。。PageRankがレベル4止まりなのもこのせいなのかな〜

んでちょっとリンク元リストの中身を見てみると、Googleの検索結果にあってリンク元リストに無いサイトは、ソーシャルブックマークサイトが何個かあって、ディレクトリー型検索サイトも無い。。。
でも、あまり意味が無いと最近言われている相互リンク系のサイトはちゃんとリストに入ってるんだよな〜
やっぱGoogleの基準は全然わからないっす。。。

Webブラウザの表示の違いを自動で修正?

2006年09月12日

 Mozilla Japan、アルゴ21、三菱総合研究所は9月11日、Webコンテンツの閲覧時に、文書のレイアウトが崩れたり、コンテンツの表現が変わってしまうなど、相互運用性における問題を改善するために「TouchUpWeb システム」を開発、その成果を利用したサービスとして「TouchUpWeb サービス」の提供を開始した。

引用元:ITmedia エンタープライズ:もう崩れない、Webブラウザによる表示の違いを吸収するサービスが開始

「もう崩れない」なんてタイトルの記事だから、俺らの仕事もなくなっていくな〜 なんて思ってたんだけど、そんなことはなさそう。
これは何かと言うとFirefoxのエクステンションで、表示崩れしたサイトをボタンひとつで修正してくれるってソフト。
基本的にちゃんとHTMLを記述していればFirefoxのほうが崩れないし、細かいCSSのバグ(というかIEのほうがバグだらけだけど)を修正してくれるまではまだできないっぽい。
むしろIEがくずれるんだからさーIE版をだしてほしいねー そしたら俺らの仕事がなくなるけど。。。

タグの読みかた

2006年09月11日

ネットを彷徨っていたらこんなページを見つけた。
HTMLをちょっとかじっている人ならわかると思うけど、会社などによってタグの読み方がちょっと違うと思う(人にもよるけど)。
なので、何が間違っていて何が正解なのかがよくわからないんだよね〜
まぁ今までそんな事はどうでもいいやって思ってたけど、偶然見つけたので。。。

アンケートによると、
  • DOCTYPE
    1. ドクタイプ (121件)
    2. ドックタイプ (78件)
    3. ドキュタイプ (77件)
  • WIDTH
    1. ワイズ (62件)
    2. ウィドス (57件)
    3. ワイド (41件)
  • HEIGHT
    1. ヘイト (168件)
    2. ハイト (97件)
    3. ハイ (10件)
  • A HREF
    1. ア ハーフ (48件)
    2. アハーフ (45件)
    3. ア ハレフ (17件)
  • ALIGN
    1. アライン (124件)
    2. アリグン (105件)
    3. アリジン (35件)
  • VALIGN
    1. ブイアライン (52件)
    2. バリグン (45件)
    3. ヴァリグン (35件)
  • ALT
    1. アルト (194件)
    2. オルト (132件)
    3. エーエルティー (12件)
  • IFRAME
    1. アイフレーム (188件)
    2. イフレーム (55件)
    3. イフラメ (23件)

こんな結果になっています。
よく問題になるのが、「WIDTH」か「HEIGHT」だと思うんだけど、この結果だと「ワイズ」と「ヘイト」になってる。
正しい読み方はウィドスだ!とかいっている人もいるけど、、、
んで暇だからgoo辞書で発音を聞いてみたら、ウィズとしか聞こえない。。。ワイズともウィドスとも聞こえないぜぃ

結論。
読み方はなんでもいいんだよ!通じればね

»HP制作の意識調査/タグの読み方アンケート[投票結果] - TAG index

»「WIDTH」の発音 - goo 辞書

»「HEIGHT」の発音 - goo 辞書

写真立てもがデジタルに

2006年09月08日

フィリップスのデジタル写真立て新製品。従来の7インチ版に加えて9インチ版が登場しました。デジタルフォトフレームとしてはシンプルな製品で、あまり多くはなさそうな内蔵メモリとマルチメモリーカードスロットを搭載。PC不要で(あたりまえか)サムネイル表示やスライドショーができます。

引用元:Philipsから9インチ デジタルフォトフレーム - Engadget Japanese

これほしいかも。。。
シンプルで下手な機能も付いてないからよさげ。
日本では発売しているか、もしくは発売するかどうかも定かじゃないけど、出たら絶対買っちゃいそう。
1万ぐらいででないかな〜

Gmailでエイリアスアドレスを作る

Gmailのメールアドレスのアカウント名とアットマークの間に、「+」に続く任意の文字列を入れたものを、一種のエイリアスとして使うことができます。

【例】
youremail@gmail.com というメールアドレスを持っている場合
youremail+anythinghere@gmail.com というメールアドレスでも受信が可能

引用元:Gmail Maniacs: ドキュメント: 受信用エイリアスを利用する(1):プラス記号を使って

へーこんな技があったなんてしらなんだ。
これがあればフィルタリングがしやすいのはもちろん、怪しいサイトにメアドを登録するときなんかに便利かも。
怪しいサイトごとにエイリアスを仕掛ければ、どこからアドレスが漏れたか一目瞭然だもんね。(通称メアドトラップw)
まぁそれを先読みされて機械的にエイリアスを削除されてたら意味ないけど。。。

「まる。てん.てん・=ほし★」って?

2006年09月07日

これはちょっとアイディアだなー
下の【まる。てん、てん・】する。をクリックするとこのサイトが星空へと変わります。
要は、このサイト全体が真っ黒になって「。」と「、」「・」が白くなるって事です。
単純だけど、素晴らしいアイディアだね。
その星からは他の【まる。てん、てん・】を貼っているブログと繋がってたりする。

»。.・ MaruTenTen

ちょっと便利な秀丸マクロ

2006年09月06日

秀丸でHTMLを編集していて思うのが、タグとタグの間のテキストをダブルクリックで簡単に選択できたら快適なのに。。。
そんな事を思っている人も少なくないとは思います。
で、見つけました。そんな悶々とした気分を晴らしてくれるマクロを!
開発者の人が名前をつけていなかったので、仮名で「左ダブルクリックの拡張するマクロ」としときます。
これを入れると超便利なので是非入れてみてください。

入れ方は
  1. 下のURLに行ってソースをコピーし、マクロを作成
  2. そのファイルをマクロとして登録
  3. ファイルメニューの「その他>キー割り当て」
  4. キー割り当ての「キー」から「左ダブルクリック」を選択
  5. キー割り当ての「コマンド」から「メニュー/マクロ」内の登録したマクロを選択
  6. 左ダブルクリックの拡張するマクロの設定完了

これでタグとタグの間をダブルクリックすると簡単にテキストなどが選択できるようになるはず。開発してくれた人に感謝!

ちなみにデフォルトだと拡張子が.htmlや.shtmlしかこのマクロは適用しないけど、中身をちょろっといじれば.phpや.jspなども適用するはず。

»hail2u.net - Weblog - 秀丸マクロ

美乳で文字化け防止

2006年09月05日

EUCページの文字化け対策で<!--龠龠龠-->などをheadの直下に記述したりしますが、どうも<!--美乳-->と記述しても同じことだという、面白いページを見つけました。
このページは結構詳しく文字化けについて書かれているので、美乳ネタ以上に役立つかもしれません。

»「美乳」で文字化けが直るって本当?

画像付きリンク集を簡単に

ikesaiのためにあるようなソフトが登場しました。
URLを登録していくとサムネイル付リンク集HTMLを吐き出してくれるという画期的なソフトです。
ジャンル機能もあるのでジャンルを登録しておくとジャンル別に吐き出してくれる。
ikesaiのカテゴリー別にぴったりってことです!
しかも吐き出すテンプレートをカスタマイズできるので、ikesai用にカスタムすればボタンひとつで新鮮なサイトサムネイルが簡単にできてしまう!!もちろん画像サイズも指定できる

こんな理想的なソフトがあるのかと思い早速使ってみた。
ソフトの使い方も簡単で、ただただURLを登録してポチっとボタンを押すだけ。
で、吐き出されたHTMLをみてみると、、、 、、、

どうもサムネイル画像がおかしい。やっぱり世の中そんなに甘くないです。。。
というよりサムネイル画像のサイズしか設定できないのでいろいろ問題がありそう。
問題点をいくつか挙げてみると、まず画像の画質があらい、サイトがセンタリングだったりすると対応していないっぽい、遅延機能がないのでFLASHサイトなどをうまくキャプチャできない、切り出しサイズを設定できないためたまにドアップで切り出されている、キャプチャをできていないサイトが多いなどなど。
このソフトにCrenaHtml2jpgと同じような機能と精度が付けば完璧なんだけどな〜

»ANGITIA - Tile Picture
»サイトキャプチャーツール CrenaHtml2jpg

荒い動画を綺麗にクリーンアップ

2006年09月01日

Motion DSPはカメラ付き携帯電話で撮った低解像度ビデオを驚くほど改善するシンプルなウェブインタフェースを作った。これはもともと1998に米軍の資金援助でカリフォルニア大学サンタクル―ズ校(UC Santa Cruz)での研究プロジェクトとして始まった。

この技術は、ビデオの複数のフレームを比較、あるフレームで失われているピクセルを探し出して復元するというもの。圧縮後のファイルサイズはオリジ ナルよりほんのわずか大きくなるだけで見た目の画質は大幅に改善される。

引用元:TechCrunch Japanese アーカイブ >> スタートアップ企業、軍用技術を利用して低解像度ビデオの改善サービス開始へ

この技術すげー。
一般向けは無料らしいから、サービスが始まったら是非やってみたい!

こういうのって映画とか政府機関の話だと思っていたけど、一般人にも使える技術になったんだねー
あとは、画像を拡大したときにフィルターをかけて画像を鮮明にするサービスができれば「24 TWENTY FOUR」にも負けないな!

»Motion DSP - Video Examples

見出し自動生成

これはちょっといいです。
現段階ではフォームによって見出し画像を生成するようなんだけど、これが発展してCSVとかを読み込めるようになってくれれば使えるね。
あとは、画像のデザインとかフォントなどを自由にカスタマイズできるようになれば、大規模サイトでガツガツ役にたつな〜
確かPhotoShopでもCSVとか読み込めた気がするけど使い方がいまいちわかんないから、是非これをバージョンアップしてサービス提供してほしい。

»SimpleAPI 見出しジェネレーター(仮)