Archive for 5月, 2009

いわゆるGENOウイルスに備えて:Flash PlayerとAdobe Readerのバージョンを確認する

金曜日, 5月 22nd, 2009

みなさまこんにちは、加賀田です。表題に挙げた“GENOウイルス”。Web上でその脅威が騒がれ始めてもう2か月になろうとしています。

いまからここで話題として取り上げるのは少々遅きに失した感もありますね。ですがつい先日社内で話題に上がったり、今朝もITmediaで関連ニュースが報道されたりもしているので、改めて取り上げてみたいと思います。

とはいえ、ウイルスの挙動や被害状況については、すでにお詳しい方々がまとめサイト等を開設していらっしゃるようです。ありがたいことです。

なので当ブログでは、感染予防に欠かせないFlash PlayerとAdobe Readerのバージョン情報を確認する手順、そして旧バージョンを使用している場合は最新版に更新する方法についてまとめておきます。両プラグインを最新のバージョンに更新しておくことが、GENOウイルス感染に対する現状最も有力な予防策のようです。まだの方はこの機会にぜひご確認を。

まずはFlash Playerから。これについてはAdobeからバージョン確認ページが提供されています。Flash Playerを有効化した状態で確認ページを開くと、バージョン情報が表示されます。

p_200905221

本記事を執筆している2009年5月22日現在では、上記画像のとおり10,0,22,87が最新バージョンとなっています。旧バージョンをご利用の場合は、最新版のFlash Playerをダウンロード・インストールしておきましょう。

続いてAdobe Readerのバージョン確認について。これに関してはgtk042さんが詳細にまとめてくださっています。現在のところ最新バージョンは9.1.1ですので、9.1.0や9.0台をお使いの場合は最新版に更新する必要があります。Adobe Reader 9.1.0をダウンロード・インストールした上で、さらにReaderを起動し、メニュー「ヘルプ」→「アップデートの有無をチェック」で9.1.1にアップデートします。最新のバージョン9.1.1が直接ダウンロードできないのはちょっと面倒ですが、ここまでやっておきましょう。

Dreamweaver 拡張機能

水曜日, 5月 20th, 2009

皆さんこんにちは。中尾です。

新型インフルエンザが関西で猛威を奮っていますが、対策はされていますでしょうか。手洗い・うがい・マスクなど、新型・季節性どちらのインフルエンザに対しても注意をしていただければと思います。

ネット上では世界各地域の感染マップ(Google Map)というものも出ています。

さて、本日はDreamweaverの拡張機能についてです。入社するまではやっぱり手打ちが一番!という意味不明の理由によりほとんど使っていなかった同ソフト。テンプレートやライブラリ、スニペットなどの各種機能を知った今ではそのすっかり虜になりました・・。(ところで「ドリ」って呼びますか?「ウィーバー」って呼びますか?)

そんなDreamweaverを更に便利にしてくれる拡張機能をご紹介いたします。

  1. CSSプロパティーフォーマット
    書いていくうちにどんどんブレが出てくるCSS。数日後何故にこの順序?とカスケーディングの力に甘えた自分を疑ったりしてしまいます。この拡張機能はCSSを予め設定した記述順序に揃えてくれる優れもの。管理面で非常に役立つ機能です。
  2. Page List
    サイトにある全てのファイルをHTMLで書き出してくれる拡張機能です。タイトル、相対パス、リンク、最終更新日時やメタタグ(キーワード、ディスクリプション)を書き出してくれます。Tableタグでの表組みで出力されますので、そのままエクセルにインポートして使え、便利です。
  3. 全角・半角変換拡張機能
    資料からそのままコピーして使うと、全角の数字や半角カナなどを変換漏れを見付けてしまいます。この拡張機能は膨大な文字列から見つけることの難しいそれらの文字を簡単に確認・置換が行えます。
  4. SnippetUtil
    お気に入りのコードが溜まってきたスニペットをバックアップ・復元できる便利な拡張機能です。かなり昔の記事を紹介させていただきましたが、今のところ不具合は出ていません。

現在のところ以上の拡張機能を駆使してDreamweaverの更なる効率化に励んでおります。皆さまのおすすめの拡張機能がございましたら、ぜひお知らせください。

※ご紹介の各種ソフトは自己責任でバックアップを取った上でご使用ください。

ITホワイトボックス

火曜日, 5月 12th, 2009

みなさまこんにちは、加賀田です。本日は表題のテレビ番組をご紹介します。何かのまわし者というわけじゃないですが、参考になったので。

NHK総合で放映中の『ITホワイトボックス』。番組Webサイトでは、内容について次のようなふれこみで内容が紹介されています。

今や、電気やガス、水道とならぶライフラインとなったインターネットや携帯電話などのIT=情報技術。
使っちゃいるけどその仕組みはさっぱりわからない・・そんなITのブラックボックスに光をあてるのが、ITホワイトボックスです。

NHKらしい素朴な雰囲気でIT技術をわかりやすく紹介してくれる、いい番組です。

親しみやすい空気を装いつつも、取り上げる話題は公開鍵暗号の概念であったりDNSの再帰検索であったり、硬派なものも織り交ぜられていて興味深く見ています。RFC作成の現場など、ほかではなかなか見られないような映像がさりげなく出てきてどきどきすることも。

Web制作の現場ではHTMLだのCSSだの手元のテクノロジーにばかり目を向けがちですが、Web専門企業としてのサービスを総合的に考えると、こういったIT全般の素養は欠かせないなと感じます。これからも引き続きチェックしていこうと思います。次回放映はあさって14日(木)23:30から。

…余談ですが、この記事を書くために番組Webサイトを見ていて、MCの森下千里さんが自分と同い年だということに気づきました。へーえ。

N700系のユーザビリティ

月曜日, 5月 11th, 2009

皆さんこんにちは。中尾です。

連休最後の土日は地元福井県の同級生の結婚式に参加しました。片道3時間半の道のりを少しでも楽しむために、最新のN700系新幹線に乗ることに決めました。N700系は社内で無線LANが導入されインターネットが楽しめる新幹線として話題になっています。

そして、至るところに「利用者にやさしい配慮」を見つけることができました。本日はそのN700系新幹線で気が付いたウェブサイトのユーザビリティにも活かせそうなポイントについてご紹介いたします。

文字が大きい
座席案内板や電光掲示板、消火器やトイレのアイコンなどほとんどにおいて「ちょっと大きめ」に表記されており、様々なお客様をスムーズに誘導できる配慮がされていました。

かつては自分もよくやってしまいました。座席番号が見つからず、通路を立ち止まり混雑を招く・・そのような光景がこれからは少なくなるのかもしれません。ウェブサイトも様々なお客様が様々な環境で閲覧することを考えると読みやすい文字に越したことはありません。

現在地表示
座席のテーブルの裏の車両案内地図。これは以前からありましたが、今現在乗車している車両が反転で表示されていました。これによりトイレや公衆電話などの場所がわかりやすくなりました。

これはパンくずリストとサイトマップの機能を併せ持つようなものだと思いました。自分が現在地、近くに何があるか、といった地図はサイト閲覧者を迷わせないために必要です。

通路/座席間の境界線に模様
どこからが通路で、どこからが座席か、床に施された淡い模様でやさしく誘導しています。これは最新の新幹線に限らず多くの電車で導入されていますが、深く座ることの多い新幹線でも重要だと感じました。

ウェブサイトにおいてもどこからが本文で、どこからがナビゲーションなのか、ひと目で誘導することでよりスムーズに閲覧が可能になります。

その他にもシートの快適な座り心地はもちろん、天井が高くやわらかい照明や、運転時の振動の少なさなど・・たくさん感動を受けました。まだまだ気が付いていない、あるいは意識すらさせてもらえない見えない配慮があるかもしれません。次回乗車の際の新たな発見を楽しみにしたいと思います。

弊社でも分かりやすくストレスを感じさせないインターフェイス設計に努めてまいりたいと思います。

下記リンク先も参考にさせていただきました。車内の写真もご覧いただけます。

IE8への自動アップデート開始

木曜日, 5月 7th, 2009

みなさまこんにちは、加賀田です。黄金週間はいかがお過ごしでしたか?

さて、スラッシュドット・ジャパンの伝えるところによると、待ちに待った(?)Windowsの自動更新機能によるIE8の提供が日本でも開始されたとのことです。

全世界的には去る日本時間4月29日よりIE8の自動更新が開始されていたとのことですが、日本だけは「ゴールデンウィークなどの日本特有の事情を考慮し」て先延ばしされていたのでしたね。黄金週間が明けたということで、満を持しての更新開始というところでしょう。

先に挙げたスラッシュドット・ジャパンのストーリーでは、まだまだ海のものとも山のものとも知れない新アプリということで、更新に対しては慎重な論調が目立ちます。

しかし、いまのところIE8へのアップグレードによる重大な不具合は聞かれませんし、レンダリング性能だって向上してるんです。IE6のレンダリングバグに泣かされる日々を送るWeb屋としては、この機会にぜひぜひ更新をお願いしたいところです。

とはいえ、わたし自身も自宅マシンのIEはさっそくアップグレードしましたが、作業用マシンでの更新には二の足を踏んでしまいます。IE8のシェアが十分上がるまでは、IE7(や6!)の検証環境が手元にあったほうがいいですからね。

まあそういう意味では、当ブログをご覧のみなさまがIE8への更新作業を完了してはじめてわれわれもIE8に手を出せるともいえます。そういうわけで、みなさまのPC環境に責任を負えない都合上声高に訴えられないのは残念なところですが、みなさまの勇気あるIE8更新をひっそりこっそりお待ちしております(?)。

POSH

金曜日, 5月 1st, 2009

皆さんこんにちは。中尾です。
ゴールデンウィークは概ね天気が良さそうですね。

POSHという言葉をご存知でしょうか。Plain Old Semantic HTMLの略で、昔ながらの意味的なHTMLを書きましょうという概念です。microformatsのwikiによると下記のような起源で生まれたようです。

POSHという用語は、2007年4月6日にmicroformatsのIRCチャネルにおいて、<kwijibo>によって考案されました。POSHとは、plain-old-semantic-htmlの頭文字を取った略語です。John Allsopp、Tantek Celik、Jeremy Keith、Chris Messinaらが2007年4月18日のWeb 2.0 Expo後に行われたMicroformats Dinnerで交わした議論を通して、microformatsのよりどころでありそれが正しいサブセットともなっているPOSHの発想と、そのより幅広い目標を広めることの重要性があらためて注目されました。詳しくはPOSHの歴史を参照してください。

上記POSHは略語なのですが、Poshという言葉自体の意味も辞書(Yahoo!辞書)で調べてみました。

  1. きわめて快適[優雅]な, 豪華な.
  2. スマートな, いきな, こぎれいな;((英))上流階級らしい, 気取った

HTMLコーダーにとってはなんとも素晴らしい略称に思えてきました。

シンプルで意味的なHTMLを無理せずに書くということはリソースの負担も少なく、精神衛生上も気持ちの良いものができるはず。弊社でも、そのような無駄の無いコーディングを是非とも目指したいと思います。

さて、同microformats内のPOSHの説明によると、POSHには下記のようなチェックリストがあります。

POSHチェックリスト(編注:項目に番号を付けました。)

  1. POSHの最初のルールとして、まずあなたのPOSHを必ず検証しましょう。
  2. 次に、単なる表現上の目的で使われているTABLEや、スペーサーGIF画像、いわゆる表現的なHTMLを取り除きましょう。
  3. さらに、(BタグやBRタグの濫用を典型とする)その場しのぎ(Bed and BReakfast)のマークアップを修正しましょう。
  4. 空っぽアンカー(Anorexic Anchors)を取り除きましょう。
  5. よい意味的なクラス名を使いましょう。

スポットを当てたいのはいつも悩まされ続けている5番目のクラス名の箇所です。なるべく無駄、無意味なクラス名は付けたくない・・けれどこれってどういう意味?という悩みが尽きません。その場しのぎという意味では3番目にも通ずる道・・意味のあるクラス名をつけ、健康的なコーディングを心がけたいものです。

W3Cには良きクラス名のページが用意されています。

Good names
warning, important, downloadableImage and submenu are all good names. They describe what a certain element represents, and they are not likely to change. A warning will always remain a warning, no matter how much the look of the page changes.
Bad names
border4px, lighttext and prettybackground are examples of bad names. You might fatten that border to a whopping 5 pixels, or the background may look pretty old after a while, and not pretty at all. An advantage of using CSS is that you won’t have to change much in order to change the looks of your website. If you have to change all light text into dark text, and thus change all classes lighttext to darktext in all your HTML pages, you’re likely to miss a few.

下記も非常に参考にさせていただきました。

醤油造りや蕎麦打ちなど、匠の域にも通ずるPlainでOldでSemanticな職人を目指したい・・そう思った今日この頃でした。