Entries in the ‘Web2.0’ Category:

Netbeans8.1でutf-8ファイルが文字化け(開けない)対策

ネットってなんて素晴らしんだ!
Netbeans8.1でutf-8で保存されたファイルが「エンコーディングが違うので開けません」と言う主旨のメッセージが出るんだ。そのままだと、日本語が文字化けしてダメ。
ネットでぐぐってみたら、すんなり解決しました!
こととこネットさん、ありがとうございました!

Tags: ,

Leave a Comment

NetBeansとFirefoxでウェブ制作

ウェブ制作にNetBeansが手放せなくなった!
でも、唯一困っていたことは、ブラウザで確認が面倒なことだったんだ。もちろんNetBeans内の仮想ブラウザ機能ですぐに確認できるようにはしたんだけど、大きさが小さいしもっとちゃんとブラウザで確認したかった。NetBeansではGoogle Chromeと連携しているらしく、コードを変更するとGoogle Chromeの表示も自動でかわってくれるらしい。
でも、僕は、Firefoxなんだなぁ。今更Google Chromeに変えたくない!
そこで、Firefoxのプラグインを探していたらこんな便利なものを見つけました。
Auto Reload
FirefoxでHDD内のHTMLを表示しておくと、そのHTMLファイルが更新される度にすぐにFirefoxも自動で再読み込みしてくれるもの。
なんて言ったって、NetBeansでセーブするだけでイイんだから楽ちん。

Leave a Comment

今さながらEvernoteいいねぇ

Evernoteっていうのが僕のiPod touchで使えなくいきさつをしたばかりなんだけど、PCのアプリを久々に使ってみたんだ。
今さながら、いいねぇ。
何がって、サーバー上にローカルHDDと同じフォルダを作って自動で同期ができことを発見!(なんて自分は無知だったんだ)
大事なフォルダ内をEvernote側にも作って「ツール」-「インポートフォルダ…」からPC内の同期したいフォルダを選択。その際、Evernote側にアップするフォルダもさっき作ったフォルダを選択するんだ。
OKボタンをクリックした瞬間、PCからEvernoteへフォルダ内のファイルがアップロードされて動機が終わるんだ。そのアップロードも実に早い!
僕は無料版なので毎月大量のファイルはアップできないけど、それでも、これまで使っていたSugarSyncより便利かも。
でもまだ疑問点もあり、インポート用にサブフォルダも同期するよう指定しているんだけどサブフォルダは自分でEvernoteに作っていかなきゃいけないのね?自動でサブフォルダも作ってくれるわけではないんだー。
で、これから重要なファイルはEvernoteでアップロードしておこうっと。

Leave a Comment

WindowsXPのサポート終了まであと1年

ついにタイムリミットが迫ってまいりました。
WinXPのサポートがあと1年ということで、ニュースにも取り上げられていたんだ。
僕が、一番心配しているのが医療機関での移行なんだ。
病院にかかった人ならわかると思うんだけど、お医者さんの使っているPCはXPがほとんど。たぶん、アプリケーションやデータベースが最新のOSに対応していないか、PCやOSの買い替えを控えていることが原因だと思うんだけど、命に係わることだからねぇ。
万一、カルテが喪失、いや、文字化け、いやデータベースのエラーで他の人のカルテと混合となったらどうするんだろう??

Leave a Comment

iGoogleがサービス終了

iGoogleがサービスを終了するんだ。そういえば、ボクはこうしたウェブによるトップページをカスタマイズしていたけど、MyYahooもiGoogleも全くアクセスしなくなっちゃった。
iGoogleにもそうしたサービスを終了する理由が書かれていたよ。

Leave a Comment

クラウドサービスもいろいろありますが

クラウドサービスもいろいろあるんだけど、どれが一番?
アップルのiCloudは5GB。
SugarSyncは5GB。
そんな中、MicrosoftのSkyDriveはなんと、25GB!
これだけあれば、何でもアップできそう。しかも、PC間で同期も自動で行ってくれるんだ。

Leave a Comment

FireFoxが7.0にアップされたよ

FireFoxが7.0にバージョンアップされたんだ。どうやら、今回のバージョンアップはメモリの利用料を少なくしてさらにスピード化を図ったらしいんだ。
そういえば、若干速くなったような気が…。
我が家ではBフレッツなんだけど、これ以上の速さを求めるとしたら回線の帯域を上げないと早くならないのかな?

Leave a Comment

googleカレンダーのデザインが変わった

googleカレンダーを利用しているんだけど、数日前からデザインが変わった。微妙に変わったけど大きな違いは無いみたい。デザイン的に見やすくなったかな?

Leave a Comment

aptana studio 3.0は応答なし

最近マンネリ化。何がって?ウェブサイトを作るのによりよい環境が無いものかと。これまでフリーソフトでHTMLに特化したテキストエディタを利用していたんだけど、HTMLも5.0になったし、これからはそれに対応したサイトも作らなければ。
そこで見つけたのが「aptana studio 3.0」。
以前のバージョンはインストールだけはしていたんだけど、その時はそのままに放置。
そこで、今回は環境をそっくりかえるつもりで使い始めたところ、肝心のファイル保存で必ず「応答なし」に。
おまけに立ちあがりは遅いし、動作も重い。
結局、aptanaは捨てられる運命に(僕の中で)。

Leave a Comment

Googleカレンダーに、ひそかに新機能が

Googleカレンダーを利用しているんだけれど、いつの間にか新しい機能が!
スケジュールに自由に色が付けられることに気がついたんだ。
むむ、これでプライオリティが付けられるね!

Leave a Comment

オンラインでできるAdobeのブラウザチェック~しかも無料

ウェブ制作者の頭痛の種、ブラウザチェック。
一般的にはブラウザのシェア争いで次々にバージョンアップが行われているんだけど、その陰ではホームページを表示させるための規格も新しいものに変わっているんだ。
実は、これが悩ましい。
最新の規格に合わせてウェブサイトをコーディングすると、以前の古いブラウザとの互換性がなかったり、古いブラウザのバグがあったりで、正しく表示されない場合があるんだ。
そのようなユーザーには、新しいブラウザにバージョンアップを行ってもらいたいんだけれど、世の中まだまだ古いバージョンのブラウザを使い続けているユーザーは多い。
いつまでたっても無くならない古いバージョンのブラウザの、どのバージョンまで対応して制作するかは常にウェブサイトの制作者の悩みの種なんだ。
しかも、制作者の環境はとっくに最新のバージョンになっているので古いバージョンのブラウザで動作確認を行いたいけれど、これができない。
そこで、お世話になるのがウェブ上で古いブラウザでどのように表示されるか確認できるサービス。
さっき新しく見つけたのが、アドビ社が公開している「Adobe BrowserLab」というサービス。
URLを指定するとオンラインでターゲットとなるブラウザでの表示を確認することができるんだ。
このサイトで確認できるブラウザは

chrome3.0(WindowsXP)
FireFox2.0(WindowsXP, OS-X)
FireFox3.0(WindowsXP, OS-X)
FireFox.3.5(WindowsXP, OS-X)
Internet Explorer6.0(WindowsXP)
Internet Explorer7.0(WindowsXP)
Internet Explorer8.0(WindowsXP)
Safari3.0(OS-X)
Safari4.0(OS-X)

となっている。
利用は無料だけどAdobe社のIDを持っている人しか利用できないのが難点。
Photoshopなどのアプリケーションを持っている人はユーザー登録を済ませてIDをもらってから利用することになる。

Tags:

Leave a Comment

iPod touchでGoogleカレンダーの「日本の祝日」を同期させる

さてさて、iPod touchとGoogleカレンダーを同期させることができたんだけど、以前やった方法では一つのカレンダーしかiPodのカレンダー同期できなかったんだ。
Googleカレンダーには共有カレンダーがあって、それには「日本の祝日」や「天気」がある。
ウェブ上ではこれらのカレンダーを「他のカレンダー」として表示させることができるんだけど、iPod touchのカレンダーにはこれら共有カレンダーを自分のカレンダーと一緒に同期することができない。
せっかく、カレンダーをiPod touchで持ち歩いているのに、祝日の表示ができないとスケジュールを追加するにも困っちゃうね。
そこで、調べてみたらちょっとした工夫ですぐに同期できることに成功したんだ。
複数のカレンダーを表示したい
のサイトを参考に設定を行うとiPod touchにもGoogle共有カレンダーの「日本の祝日」が表示される!
もちろん、事前の準備として自分のGoogleカレンダーに共有カレンダーを追加しておくことが必要なんだ。
上記のサイトを参考にすると、共有カレンダーを選択できるようになるからチェックマークを入れ[SAVE]で完了。
たったこれだけ。
この方法を使うと、ネット上に公開されているあらゆるGoogleカレンダーの公開カレンダーもiPod
に同期することができるんだ。ただし、上限は5つのカレンダーまでだそうだ。

Tags:

Comments (2)

Twitterが流行っているらしい,,,今更ながら

どうやら、Twitterというウェブサービスが流行っているらしい。
以前から、ユーザー登録数がものすごい勢いで増えているというニュースは知っていたんだけど、僕の場合、このサービスの内容を見ていまだに登録する気にはなれないんだ。
「つぶやき」というショートメッセージを投稿&表示するアプリケーションを立ち上げておき、好きな時にメッセージを投稿してまた気に入った人のメッセージを自分の窓に表示させるように(フォロー)するらしいんだ。
そんなサービスなんだけど、僕にとってはどこがそんなに面白いのか(便利なのか)理解できていないのが一番の理由。
だいたい、つぶやきを入力するのが面倒という性格もあるんだけど、そんな独り言を書いてどこが楽しいのかがわからない。
こんな僕って時代遅れなんだろうか?

Tags:

Leave a Comment

RSSフィードを表示するフリーCGIの文字化け

HTMLファイルに挿入するだけでブログのRSSフィードを表示してくれる便利なフリーCGI「大黒屋」さんの「jsRSS++ v3.15」を利用しているんだ。
このCGIは設定も簡単な上に、RSSを挿入したい個所にJavaScriptを挿入するだけでRSSフィードを表示させることができるので、応用が利くしとっても重宝している。
ただ、2005年12月で開発は止まっているので、ちょっとややこしいことに。
そのややこしいこととは、クライアントさんのブログのRSSをHTMLで表示させたところ、ある記事の内容のみ文字化けが発生してしまったんだ。
これまで、問題なく表示していたからその原因がわかるまで時間がかかってしまった。
原因はHTMLとCGIで書き出したRSSフィードデータの文字コードの違いだったんだ。HTMLは「shift_jis」で「jsRSS.cgi」で吐き出したデータは「EUC」。
それぞれ文字コードが違うからHTMLファイルのコードに合わせてEUCをデコードしてやらなくちゃならないんだけど、そのデコードのライブラリとPerlのバージョンのちょっとした違いでバグが発生してしまったということ。
で、その原因となった文字が「美」。たったこの1文字。
Googleで「Perl 美 文字化け」でググッてみると色々勉強になる。
そこで「jsRSS.cgi」のデバッグは下記のようにすることで問題が解決したんだ。
ソースコードの254行目あたりにある
$RSS = Jcode -> new(\$RSS) -> $enc if($enc ne ‘euc’);
をコメントアウトし、その下に次のソースを挿入する。
Jcode::convert( $RSS , “sjis”, “euc” );
以上で、文字化けしたRSSフィードは問題なく表示されるはず。
そうそう、サーバーとPerlのバージョン(最新バージョン)、日本語モジュールなどの条件が揃っていないといけないけど。
クライアントさんのサーバーはJcodeモジュールが使えるからこれで無事解決できたんだ。

Leave a Comment

Googleからの警告~SEO「ダメ」対策の証明

たまたまアクセスしたGoogleのウェブ管理者用のアカウントにメールが届いていたんだ。
内容は、
このたび、貴サイトにおきまして、Google のインデックスへの登録中に Google の品質に関するガイドラインに沿わない箇所が確認されました。品質に関するガイドラインは次の URL にてご確認いただけます。
今回は特に「隠しテキストや隠しリンク」に該当する不適合が確認されました。具体的には、http://*****/ における次の内容が不適合箇所の一例です。
というもの。早速示されたURLでNGになった内容を確認してみると
CSS を使用してテキストを隠す
がその理由だったみたい。
このテクニックは、昔よく使われていたものだけど、さすがに最近はSEO対策として使わない方がいいと言われていたもの。
Googleから指摘のあったサイトではそのままだったため、見事「ダメ」対策として証明されてしまった。
早速、HTMLを修正してアップする始末。

Leave a Comment

ものすごくシンプル且つ便利なオンラインストレージ

他の人はいったい大きなファイルのやり取りはどうしているのかなぁ?
メールに添付するのが一番簡単なんだけど、これだとファイルサイズが大きくなれば大きくなるほどダウンロードに時間がかかって相手に迷惑をかけちゃう。
インターネット上のサービスで、ファイルを一時預かってくれるサービスもあるんだけど、いちいちIDやパスワードでログインしなくちゃファイルのアップロードができないんだ。
それに、ファイルを選択するにはブラウザ上からフォルダとファイル名を探して決定しなくちゃならない。
僕が見つけたのは、それよりものすごくシンプル・簡単で且つ便利なオンラインストレージサービスなんだ。
どんな点がいいかと言いますと、

ファイルはexplorerからブラウザ上の領域にマウスでドラッグするだけでアップロードできちゃう。
このサービスを利用するのにIDの取得やパスワードの設定が不要。
ファイルサイズは50Mバイトまでアップロード可能。
ファイルの保存期間は1週間。
しかも、無料で利用できちゃう。

メニューなんか実質2つ「マウスで預け入れ」「引き出し」くらいしか使わない。
使い方も簡単で、

まずサイトにアクセスしたら「マウスで預け入れ」をクリックするとページ内に枠が表示されるから、そこにアップロードしたいファイルをドラックする。
アップロードが完了すると、ダウンロード用のパスが枠の下に表示されるから相手にはサイトのURLにパスをつなげて教えてあげる。

これだけで相手にファイルを送ることができるんだ。
自分がアップしたファイルをダウンロードするには上記のURLからでも可能なんだけど、パスの後ろにつながっている英数字が実はパスワードになっているんだ。メニューの「引き出し」をクリックしパスワード入力フォームに入力するとダウンロードが可能になる。
と、実に簡単。サイトのデザインもGoogleのように実にシンプル。
これはなかなかいいサービスですね~。
一つだけ注意点は、ブラウザのプラグインにJavaが必要になること。サイトにアクセスするとプラグインが無い人はSunのページに自動的にジャンプしてインストールのページが表示されるんだ。インストールが完了したらブラウザを再起動してもう一度サイトにアクセスする。Javaが自動的に最適化されて設定が完了するから、そうしたらサービスが使えるはずだ。
早速、気になる人は「無料ファイル転送オンラインストレージSTOC.AS」のサイトへ。

Leave a Comment

あなたのパソコンが乗っ取られる~ボット

19日のNHKクローズアップ現代は、インターネット社会に欠かせない話題が放送されたんだ。
「あなたのパソコンが乗っ取られる」と題して放送されたその内容は、知らないうちにPCがコンピュータウィルスに感染してしまうというもの。
ウィルス感染だけなら昔からある話題なんだけれど、番組ではもう少し踏み込んでボットについても詳しく解説していたんだ。
簡単に説明しちゃうと、ボットというコンピュータウィルスに感染すると、ある日時にある特定のサイトにアクセスを勝手に集中的に行うというもの。
その目的は、そのターゲットとなったサイトに処理しきれないアクセスを行うことでサイトの表示を行えないようにすることにあるんだ。
その攻撃を行うパソコンに自分のパソコンも参加しているということになるんだ。
けれど、そのようなことを行っているのにユーザーは全く気がつかないほど巧妙に作られているから気がつかない。自分のパソコンにメッセージが表示されたり、動作がおかしくなったりということが無いように作られているからたちが悪い。
そのようなウィルスに感染してしまう原因はインターネットにつながっているから。
パソコンにLANケーブルとその先のルーターがネットにつながっていればものの数分で感染してしまうんだ。覚えておいてほしいのは、メールやブラウザなどでインターネットに接続していなくても、ウィルスは向こうから勝手にやってきて感染するんだ。
昔は「メールの添付ファイルは開かない」「知らないサイトにアクセスしない」ということに気を付けていればよかったんだけど、今では、何もしなくてもインターネット側から勝手に届いて感染しちゃう。
一度感染しちゃうと、ウィルスは自分の姿を数分間隔で変えちゃうから駆除ソフトも対応ができなくなるんだ。
唯一の対策は、最新のウィルス対策ソフトを導入すること。そして、使用期限が来たら必ず更新することなんだ。一番新しいウィルス対策ソフトは、ワクチンパターンを数分間隔で更新しているので、ウィルスに感染する前にワクチンが有効になることが多い。
だれでも、必ず対策を取ってほしいね。
そこで、番組でも紹介されたウィルス検索駆除ソフトを使ってほしい。もちろん無料だから今すぐに行うことを勧めるよ。
実は、僕のPCで検索したところ53個のボットが駆除されたんだ。
最新のウィルス対策ソフトを入れていてもこれだけ感染しているから怖い!
サイバークリーンセンター(総務省、経済産業省)
https://www.ccc.go.jp/

Leave a Comment

クラウドコンピューティング

先日のNHK「クローズアップ現代」は面白い内容だったね。
今話題となっている「クラウドコンピューティング(リンク先は参考まで)」について解説と実例、それに今後の展望を伝えていたんだ。
クラウドコンピューティングの考え方はPCが生まれる以前から存在していて、実際に稼働していたんだ。ただ、当時はPCなんてなかったからそのような仕組みは、大企業しか知らなかったというわけ。
それが、PCが登場し、インターネットが発達したおかげでPCユーザーもその仕組みを利用できるようになったんだ。
昨年あたりからクラウドコンピューティングについて盛んにメディアに取り上げられるようになってきた。
さて、放送ではクラウドコンピューティングの事業に参加しようとするマイクロソフトの見解が流れていた。一方、すでにクラウドコンピューティングで急成長をしている企業と、それを利用している日本の中小企業の事例が紹介されていたりとよくできた内容だったんだ。
実際に、インターネットとブラウザがあればWindowsでもMacOSでも全く関係ないし、ましてPCにビジネスソフトをインストールしなくてもいいので今後この分野は発展することは間違いないと思っているんだ。
すでにスケジュール管理などグループウェアはクラウドコンピューティング化しているからね。
もちろん、弊害もあるんだ。
セキュリティはもっとも気をつけなければならない点だし、それ以外にもネットワークのダウン、サーバーのダウンで利用できなくなる可能性がある。手元にバックアップがないので障害が発生した場合は全くお手上げになる可能性があることも放送されていた。

Leave a Comment

CSS nite in SENDAI Vol2~東北Webサミット

8月9日に仙台市情報産業プラザ多目的ホールで「CSS nite in SENDAI Vol2~東北Webサミット」が開催されたんだ。
前回はから約半年で2回目の開催となったCSS nite。
Webを仕事にしている人ならこれに参加しないときっと後悔すると思うイベントなんだ。
前回に引き続き新しい情報を仕入れたので、僕なんか早速利用してみようと思っているところ。
ただ、2回目となる今回は副題に「Adobe祭り」と付いていることでもわかるとおり、Adobeのパッケージ製品やベータ版、さらにオンラインサービスに関する解説が中心だったんだね。
イベントも12時から始まり18時までびっしり6セッションもあるというとても充実したもの。
参加者グループを組んで、サービスを企画して発表すると言うワークショップもあったんだ。こうしたセミナー(カンファレンスと言うほうが正しい)も新鮮に感じたんだ。
次回も期待しましょう。
[gmaps:38.26255507350373/140.88108658790588/15/460/300](comment)[/gmaps]

Leave a Comment

仙台のIT業界は飽和状態!?

昨日は、メディアテークで行われたあるセミナーに行ってきたんだ。
宮城県内で活躍しているITやウェブ関連企業8社のプレゼンを聞くことができた。
僕がこのセミナーに参加したいと思った一番の理由は、今疑問にもっていることを確かめようと思って。
ITやウェブなどと看板を掲げて仕事が来る時代は終わったなぁってつくづく感じているんだ。
プレゼンを行った各社は今最も勢いのある企業や経営者なのでとても活気があって楽しかったし、共感することができて有意義な時間だったんだけど、やはり、皆も仕事が厳しくなっているようなんだ。
そのうち誰かのプレゼンで「仙台のITやウェブ業界は飽和状態」と説明したことがとても印象的。
同じ業界の人もそう感じていたことで、僕の疑問は晴れた。
そこで、看板だけで仕事が来る時代は終わったことで、次にどんな仕掛けをしようかと頭を切り替えることにしたよ。
今は、そのネタを探すことに時間を使おうと思っているんだ。

Leave a Comment

行って来ましたINTEROP2008

今年も行って来たんだ「INTEROP2008」
この展示会はインターネット技術の展示会で、僕はここ10年は毎年来ていると思う。いや?このうち1回は休んだかな?
それだけ、毎年のように欠かさず見学に来ている展示会で、楽しみにしているんだ。
会場も千葉県海浜幕張の幕張メッセで行われていて隣には千葉マリンスタジアムがあるんだけど…野球には興味が無いから行った事はないんだ。
毎年来ていると感じることが、年々規模が縮小されているなぁってことなんだ。
それは、出展企業がどんどん少なくなっていることから感じる。今年も昨年出展していた大きな企業が無いし、会場も狭くなっている。
ITバブル時代は各企業大きなブースを出して景品も豪華だったけど、今はブースもこじんまりして景品もボールペンなどが多くなったんだ。
そんなことからも景気後退がIT企業にとっても深刻なんだと感じるイベントだったね。
それに、インターネット技術についてはほぼ新しい物は出尽くした感じがするし、毎年革新的な製品の発表も少なくなっているのもこの展示会が縮小している原因なんだと思っているんだ。
さらに、コンテンツ関連は他にも展示会が行われているからソフトウェア企業はそちらにシフトしているのかも知れない。
最近の展示は、ネットワーク関連機器やサーバーマシンより、VoIPに代表されるIP電話機器関連が多い。
他には、セキュリティ関連のルーターやフィルタリング機器などが目立ている。
来場者はそれなりにあったけど、内容に物足りなさを感じてしまうのは正直な感想。来年の参加はちょっと考えちゃうなぁ。

Leave a Comment

NHKプロフェッショナル~仕事の流儀

昨日のNHKプロフェッショナル~仕事の流儀は面白かった。
世界に名が知れ渡っているという、ウェブデザイナーの中村勇吾さんだったんだ。
(スミマセン、正直存じ上げていませんでした)
ウェブの業界には8年前に入ったと言う30代の中村さんは、独学でプログラミングなどの技術を習得したんだそうだ。もともとは、建築(橋梁)の設計の仕事をしていてウェブ制作はまったくの趣味だったとか。それが今や世界中から仕事の依頼が来る売れっ子デザイナーに。
ウェブ制作のコンセプトは「気持ちがいいこと」だそうです。
彼のすごい点は、デザインもプログラミングも両方できるところにあるんだ。すばらしい才能だ!
今後は、彼のウェブサイトをブックマークしてウォッチしてみよう。
NHKのサイトには、番組中に放送されたプロフェッショナル向けに制作されたコンテンツが公開されているから一度試してみるといいよ。

Leave a Comment

1分で設置できるページアイコン(icoファイル)

以前のテーマのブログに書いたはずなんだけど、WordPressのバージョンアップとともに消えた記事にホームページのアイコンが簡単に作れるサイトを紹介したことがあるんだ。
現在のテーマにしてからサイトのアイコンを作っていなかったんだけど、ちょっと気が乗って突然作ってみたので、ブログにも書いておこう。
利用したのは
http://favikon.com/
と言うサイト。
作り方も簡単。たった4ステップでfavicon用のファイルとリンクタグができちゃうんだ。
事前にfavicon用の画像制作も不要!gifやjpgファイルからicoファイルが自動でできる。しかも、表示範囲が設定できるんだ。
作り方と設置は次の通り。
ステップ1
faviconファイルに変換したい画像ファイルへのパスを指定するか、ローカルから画像をアップロードする。
ステップ2
表示される画像からfaviconファイルとして表示したい位置をマウスで範囲指定する。確定したらicoファイルをダウンロード。
ステップ3
HTMLのヘッダタグ内に挿入するlinkタグが表示されるので、コピーペーストで自分のHTMLファイルのヘッダタグ内に加える。
ステップ4
ダウンロードしたicoファイルを自分のHTMLファイルがあるフォルダへアップロードする。続けて修正したHTMLファイルをアップロード。
これでブラウザからアクセスするとURLの左にアイコンが表示されているのが確認できるんだ。
ここまで、制作時間は1分だったよ。
そうそう、ブラウザはFireFoxで。IEではicoファイルは表示できないからね。

Leave a Comment

CSS Nite in AKITAに行って来ました

ブログの更新が遅くなったんだけど、11月24日(土)に秋田市内で行われたCSS Nite in AKITAに行って来ました。
大学コンソーシアムあきた カレッジプラザ講堂にはおおよそ100名(主催者発表)の参加者が秋田県内はもとより、仙台、盛岡、八戸、青森からも駆けつけて、みんなの期待の高さが伺えるね。
12:30の開演・オープニングセレモニーに続いて、書籍などがあたるプレゼント抽選会やじゃんけん大会があったんだ。
僕は、抽選に運良く当たって「Flash プロフェッショナル・スタイル 」をゲットしたよ。
う~ん、僕のFlash環境はアドビ社のモノじゃなくてサードパティの互換ソフトでFlashを作っているので、これはきっとITの神様が「アドビのオフィシャルパッケージを購入して、一から勉強しろ」ってことなんだね。
購入をまじめに考えてみようと思う。
その後は、
[Session1] 植木 真 氏 (70分)
[Session2] 鷹野 雅弘 氏 (60分)
[Session3]スペシャルゲスト:新谷 剛史 氏 (45分)
と続いて17時ちょうどに終了したんだ。
どの講演も大変にためになったよ。特に[Session1] 植木 真 氏のプレゼンテーションはアクセシビリティとSEO対策についての内容だったからとても参考になった。
直接質問もすることができて、個人的な不明点もクリアになったしね。
その後、懇親会では40名くらいが参加して交流を深めることができたんだ。さすがに全員と話をすることはできなかったけど。
そして、9時からは2次会と流れて大盛り上がり。って個人的にこのようなIT業界の人と一緒に飲むのは楽しいので一人で盛り上がってしまったんだ。
途中から、自分でもいつもよりテンションが高かったのは自覚していたんだけど、楽しくてね。
それに、僕は中学校、高校と秋田市内で過ごしたこともあって、久しぶりの秋田でうれしかったんだ。
そして、CSS Nite in SENDAIと続くから、今度はもっと楽しみなんだ。懇親会ではホームゆえちょっとセーブしないと仕事に影響するかな?

Leave a Comment

Polaroid Gallery

デジカメで撮影した画像をウェブで見せたいとき、ただ並んだ画像をクリックしてもうのは芸が無いと思っているのは僕だけじゃないと思うんだ。
そこでオススメしたいのが「Polaroid Gallery」というサイト。
ページ上にポラロイド写真がランダムに置かれたような配置から、見たい画像をダブルクリックすると拡大表示してくれるんだ。また、ポラロイド風の画像はドラッグで好きな場所へ移動できるんだ。
その仕組みはFlash。
でも使い方はとても簡単で、必要なファイルをダウンロードしたら表示させたい画像のファイル名と画像のコメントをテキストで記述するだけ。
今度知り合いのサイトに導入してみよう。

Leave a Comment

CSS Nite in SENDAI

いよいよ「CSS Nite in SENDAI」が開催されるんだ。
告知用のページも公開されカウントダウンが始まったね。
CSS NiteとはWeb構築の標準とされるCSSの情報交換を行うイベントで、当日はゲストスピーカーの講演などが予定されているんだそうだ。また、前日夜は前夜祭と称してアップルストアでのイベントもあると言うことでとっても楽しみなんだ。
詳しくは2008年1月12日(土)に開催する「CSS Nite in SENDAI」特設サイトをチェックしなくちゃね。

Leave a Comment

CSS Menu Generator

今回書き留めるのは「CSS Menu Generator」
CSS Menu Generator
http://www.cssmenumaker.com/index.php
ウェブページを制作するのに絶対に必要になるのがメニュー。
ここのサイトでは、マウスオンで変化するメニューをCSSで自動生成してくれるんだ。
生成されたHTMLコードをCSSを自分のページのHTMLファイルにペーストするだけで、面倒なメニューが完成しちゃう。
もちろん、マウスオンになったときの画像と元の画像もダウンロードできちゃう。
コードを流用して画像を別に用意するとオリジナルなメニュー制作も簡単なんだ。
う~ん、これは便利。

Leave a Comment

CSS Nite in SENDAI

CSS Nite in SENDAI(宮城県仙台市)で予定されているんだ。
正式に2008年1月12日(土)とリリースされているから、ウェブクリエーターはスケジュールを空けておいたほうがいいね。
CSS Niteと言うのは、ウェブのデザインに必須のCSSの解説と最新のテクニックをプレゼンするイベントなんだ。2005年10月に東京のアップルストア銀座でマンスリーイベントとして開催されたのが、今では全国各地のイベントに発展したんだ。
そして、ようやく仙台でも開催されることが決まったんだね。
当日のプレゼンターや予定など詳細は今後発表されるから注目しておいたほうがいいよ。

Leave a Comment

CSS Nite in AKITA

CSS Nite in AKITAが11月24日に開催されるだって。
CSS Niteと言うのは、ウェブ制作には欠かすことができないCascading Style Sheetsのことなんだけど、簡単にいうとウェブのデザインを表現している記述(コード)なんだ。ウェブのデザインはCSSで書かれているのが常識。
このCSSの解説とテクニックをプレゼンするイベントがCSS Niteというわけなんだ。2005年から東京をメインに開催されていたんだけど、今は全国でイベントが行われるようになったんだ。そこで、今回は秋田で。
僕は中学と高校は秋田市内だったので、とっても懐かしく是非参加してみようかと思っているところ。でも、毎年11月の週末にはホンダシティのオーナーズ全国ミーティングがあるので、日程がバッティングしなければいいなと心配しているんだ。
バッティングしたらどうしようか?

Leave a Comment

WordPressにLightWindowを実装(ポップアップウィンドウ)

つい先日、LightBoxのプラグインをWordPressに入れてみたところなんだけど、もうひとつのポップアップウィンドウツール「LightWindow」に変えてみたんだ。
LightWindowのいいところは、画像以外にも、HTMLやPDF、動画まで対応している点。ファイルの読み込み時と読み込んだファイルを表示するまでウィンドウがアニメーションで変化する点はLightBoxと同様だから見ていても楽しいページが作れる。
さらにすごいのは、ポップアップウィンドウにタイトル以外に説明文が付けられたり、ウィンドウ内にプルアップメニューを入れることだってできちゃう。これはなかなかすぐれものだね。
WordPressへの実装なんだけど、残念ながらプラグインは見つけられなかったんだ。
それで、直接CSSの編集作業が必要になる。
LightWindowのサイトからダウンロードしたファイルを解凍して、フォルダごとサーバーへアップロードするんだけど、実は、そのままだとブラウザの画面がグレーアウトできないんだ。正確には、グレー表示するpngファイルへのリンクが切れてしまうため。
そこで、サーバーへアップする前に、「javascript」フォルダ内にある「lightwindw.js」の
overlay : {
 opacity : 0.7,
 image : ’images/black.png’,
 presetImage : ’images/black-70.png’
},

overlay : {
 opacity : 0.7,
 image : ’lightwindow/images/black.png’,
 presetImage : ’lightwindow/images/black-70.png’
},
に書き換えて、次に
loading :     ’<div id="lightwindow_loading" >’+
 ’<img src="images/ajax-loading.gif" alt="loading" />’+</div>

loading :     ’<div id="lightwindow_loading" >’+
 ’<img src="lightwindow/images/ajax-loading.gif" alt="loading" />’+</div>
に書き換える。lightwindow/はフォルダへのパスだね。
書き換えたら、解凍したフォルダごとWordPressのフォルダへアップしてやるんだ。この場合、プラグインのフォルダでなくてもOK。
これで事前準備は完了。
次に、ダッシュボードの「表示」タブから「テーマエディタ」をクリックして、「テーマファイルのヘッダ」を選択するんだ。すると、ヘッダー部のソースコードが表示されるはずだから、ヘッダタグに下記のコードを追加するんだ。
<script type=”text/javascript” src=”javascript/prototype.js”>
<script type=”text/javascript” src=”javascript/scriptaculous.js?load=effects”>
<link rel=”stylesheet” href=”css/lightwindow.css” type=”text/css” media=”screen” />
そして、リンクタグを下記のように書き換える。
<a href=”images/temp.jpg” class=”lightwindow” title=”(画像タイトル)” caption=”(画像説明文)”>Link Name</a>
サイトにはサンプルが豊富にあるのでいろいろ実験してみよう。

Leave a Comment

LightWindow~画像の拡大表示

さて、もうひとつの画像拡大表示のツールを書いておこうと思っているんだ。
LightWindow
これも、ページの画像をクリックすると表示ページ全体がグレーアウトになり、JavaScriptによるポップアップアニメーションウィンドウが表示されるんだ。
動作や見た感じはLightBoxとおんなじなんだけど、大きく違うのはウィンドウ内に表示できるのが「HTML上に表示できるものなら何でもOK」ってことなんだ。例えば、Flashのアニメーション、PDF、各動画、そしてHTMLの他のページも。
使い方も、これまでのツールと同様に簡単なんだ。サイトからダウンロードしたファイルを丸ごとサーバーへアップ。そしてHTMLのヘッダー内に次のコードを追加するんだ。
<script type=”text/javascript” src=”javascript/prototype.js”></script>
<script type=”text/javascript” src=”javascript/scriptaculous.js?load=effects”></script>
<script type=”text/javascript” src=”javascript/lightwindow.js”></script>
<link rel=”stylesheet” href=”css/lightwindow.css” type=”text/css” media=”screen” />
そして、LightWindowで表示したい画像のタグにクラスを追加するだけ。
<a href=”images/temp.jpg” class=”lightwindow” >
もちろん、画像アルバムのようなページめくりの効果も付けられるるんだ。また、ポップアップするウィンドウのサイズだってパラメーターで自由に設定できる。
オフィシャルサイトには豊富な使いかたの例が掲載されているから誰でもこのようなすばらしい効果を実装することができるね。

Leave a Comment

ThickBox~画像の拡大表示

前回書いたLightBoxはJavaScriptで画像の拡大表示できるツールなんだけど、今回も同様のライブラリなんだ。
画像をクリックして拡大表示する方法にはポップアップウィンドウ(新ウィンドウ)が一般的だったんだけど、ユーザービリティの観点から今は使われなくなったテクニックなんだ。今後は、LightBoxや今回のThickBoxが主流なんだ。
そこで、ThickBoxの特徴なんだけど、一番大きな違いは画像ファイル以外にも利用できる点。HTMLやFlash、動画もOK。二つ目の特徴はライブラリの大きさが小さいっていう点なんだ。LightBoxを読み込むと100KB以上になるそうだけど、ThickBoxは31KB程度だそうだよ。
ThickBoxサイトから必要なファイルをダウンロードしたら、ヘッダーに下記の内容を書き加えるんだ。
<script type=”text/javascript” src=”path-to-file/jquery.js”></script>
<script type=”text/javascript” src=”path-to-file/thickbox.js”></script>
<link rel=”stylesheet” href=”path-to-file/thickbox.css” type=”text/css” media=”screen” />
そして、このライブラリを使いたいタグにclassを追加するんだ。
<a href=”images/temp.jpg” class=”thickbox”>
たったこれだけ。もちろん、アルバムのように画像送りもできる。relでグループ名を指定するんだ。
<a href=”images/temp.jpg” class=”thickbox” rel=”group” >
thickbox.cssを編集することでデザインを色々カスタマイズできるんだ。
サイトにはデモが豊富に紹介されているから簡単に実装できるね。

Leave a Comment

Reflection.js

今日ご紹介するツールも画像関係なんだ。
Reflection.js
このツールは、ウェブで表示する画像が鏡面の床に映りこんだような効果が得られるんだ。
アップルのサイトやiTunesなどで商品やCDジャケットが床に映りこんだように見えている、アレ。
このツールが無ければ画像ひとつひとつに写りこみの編集作業が必要なんだけど、これは、わざわざ写りこみの画像編集をしなくてもいいんだ。
使い方もとっても簡単。jsファイルをダウンロードしてフォルダごとサーバーへアップし、HTMLヘッダーに
&lt;script type="text/javascript" src="reflection.js"&gt;&lt;/script&gt;
を追加する(パスに注意)。そして、写りこみをさせたい画像タグにクラスを追加するだけなんだ。
class="reflect rheight40 ropacity20"
例えば
&lt;img src="images/template.jpg" width="150" height="200" alt="temp" title="temp" class="reflect rheight40 ropacity20"/&gt;
rheight(xx)で写りこみの長さ
ropacity(xx)で写りこみの反射率
が調整できるよ。画像はjpg、gif、pngが利用できるんだ。
ダウンロードしたファイルには詳しい解説が書かれたHTMLもあるので誰でも簡単にこの効果を取り入れることができるんだ。

Leave a Comment

Lightbox2~画像の拡大表示

インターネットや雑誌で見つけたちょっとしたツールを書いておこうと思うWeb2.0シリーズなんだ。今回は、画像の拡大表示機能をサイトに貼り付ける方法。
Lightbox2
サイトを見るとサンプルもあるので、どんな感じか確認することができるよ。いろいろなサイトに実装されているから見たことがあるかもしれないね。
これは、ページ上の画像をクリックすると画像のみが拡大表示してくれるJavascriptなんだ。画像のみの拡大表示はこれまで新たにウィンドウを開いて画像のみを表示させる方法が一般的だったけど、これはウィンドウを開くことなくブラウザ上に画像が表示されるんだ。
新しいウィンドウを開かないので、知らないうちに沢山のウィンドウが開いていたということもなくなるし、ユーザビリティが良くなるね。
しかも、画像の表示にはブラウザがグレーアウト(暗い色に)して画像の表示がアニメーションで表示される。表示がおわると画像のタイトルと画像のCLOSEボタンが表示されるからもとのページへもすぐに戻ることができるんだ。
さらにコイツのすごいのは、複数の画像をページ送りのように連続してみることができる点。写真を掲載しているアルバムサイトなんかにはもってこいなんだ。
使い方も簡単なんだ。サイトからjsファイル一式をダウンロードして解凍フォルダごとサーバーへアップする。あとはサイトの How to Use を見ながらJavascriptを呼び出してあげれば完成なんだ。
たったこれだけの機能なんだけど、サイトが一流になった気がするね。

Leave a Comment

HTML埋め込みのRSSリーダー

WordPressでブログを始めているんだけど、折角だから自分のオフィシャルのページにブログの最新エントリーを表示させてみたんだ。
エントリーを表示させる方法は二つ。
ひとつは、RSSリスティングのようにブログパーツを使う方法。ブログパーツといっても、表示されるHTMLのソースコードが表示されるので、それを自分のHTMLページやブログにコピー&ペーストすればいいんだ。
この方法の欠点は、広告が表示されてしまう点なんだ。
以前は、このブログパーツで表示させていたんだけど、今はやめた。
二つ目は、今日から使い始めた大黒屋本舗のjsRSS++ v3.15というHTMLやブログにJavascriptを入れてRSSリーダーを読み出すもの。
ソースコードをカスタマイズすることで、自分オリジナルのRSSリーダーを作ることができるんだ。
特に、大黒屋本舗のjsRSS++ v3.15というのは使い勝手がいい。RSSリーダー部分はPerlで書かれている点も気に入ったし、HTMLへの埋め込みもJavascriptなので簡単なんだ。それにパラメータでRSS表示を色々変えることだってできるんだ。
Perlソースの変更が自由だからね。オフィシャルサイトに合わせてカスタマイズができる。なにより、広告が入らないのですっきりするんだ。
利用にあたっては、サイトで詳しい説明がありさらにダウンロードしたファイルにも詳しい解説があるのでとても親切なんだ。
僕は、大黒屋本舗のjsRSS++ v3.15でこちらのページにこのWordPressのブログのエントリーを表示させているよ。

Leave a Comment

このページの先頭へ