我的春秋: パンくずリストのマークアップ
ちょっと前に パンくずリスト（Topic Path）を作成する際に使えそうなサンプル8種（CSS HappyLife）というエントリーが盛況でしたが、今日はパンくずナビゲーションの論理構造面を補強する意味も込めて、(X)HTML マークアップの例を、サイト構造やサイトの目的に応じて、いくつか挙げてみました。CSS の話まで入れると長くなるので、今回は（も？）(X)HTML マークアップに話を絞ります。CSS については、特にセレクタまわりが結構 変わってしまいますが、ひとまず、HirasaWa さんのエントリーなどを参照してください。（気が向いたら、別エントリーを立てますけど、実際に書くかどうかは未定。） 階層型構造（tree structure） ［2006-02-11 追記］ 石川一靖さんより、「セマンティクスを重視するならa要素にrel/rev属性を加えてリンクの関係性を明示するのが
80年代のAppleに学ぶUIの部品化とガイドライン ― ＠IT
インタラクションデザインパターン（1） 80年代のAppleに学ぶUIの部品化とガイドライン ソシオメディア 上野 学 2007/2/7 インタラクションデザインパターンのプロローグとして、その原則や秩序の歴史を見てみよう。20年前のAppleはどのように質の高いアプリケーション開発を目指していたか デザインが優れていれば、道具はより楽しいものになり、利用者はより生産的になるはずです。道具のデザインというものは大昔から私たち人間が取り組んできたことですが、近年急激にデジタルデバイスが多様化したことによって、インタラクティブな道具をデザインするための方法論は技術の進歩に追い付くことができなくなっています。利便性を高めるはずの新技術が使い方を複雑化する要因となり、利用者の混乱は増すばかりです。 最近私は携帯電話を買い替えたのですが、同じメーカーの3年前の機種と比べて、著しく使い勝手が悪くなって
忘れてはいけない超絶JavaScriptライブラリ「BlueShoes:JavaScript Collection」:phpspot開発日誌
BlueShoes: JavaScript Collection Get all the above components in one package. There is an example that uses most of the components.忘れてはいけない超絶JavaScriptライブラリ「BlueShoes:JavaScript Collection」。 既に紹介したと思っていたJavaScriptライブラリであるBlueShoesの紹介。 ご存知の方も多いと思いますが、知らない人も多いようですね。 ライブラリ、というより、リッチなコンポーネント集といったイメージで、次のような様々なコントロールが使えます。 WYSIWYGエディタ Excel風スプレッドシート ツリービュー スライダーコントロール 他にも下記の様々なリッチコンポーネントが使えます。 入力系コンポーネ
3Dデスクトップ環境「Project Looking Glass」を試してみた － ＠IT
2007/01/11 コンピュータの操作環境として、2次元の「デスクトップ」というメタファーが登場してから20年以上が経過している。画面を架空の机として扱い、そこに電卓やノートパッドを必要に応じて配置する。本格的なGUI環境の普及をWindows 95以降と考えるとしても、このユーザーインターフェイスには、10年以上も本質的なイノベーションは起こらなかったことになる。 一方でゲーム用途にドライブされる格好で、3Dアクセラレーション機能は長足の進歩を果たした。しかし、ゲームユーザー以外には無用の長物となって久しい。 これを背景として、最近はデスクトップを3次元空間として扱う、3Dデスクトップ環境の実験的プロジェクトや実装が増えてきている。われわれが仕事をしている机というのは3次元的で、書類を立てて縦に並べることもできれば、上下に重ねることもできる。下になって微妙に色だけが見えている書類は、処
人力検索はてな - 入力フォームのデザインがすばらしいページを教えてください。 派手さや装飾ではなく、使いやすさ、見やすさなど機能美優先でお願いします。 海外のサイトでも結構で
入力フォームのデザインがすばらしいページを教えてください。 派手さや装飾ではなく、使いやすさ、見やすさなど機能美優先でお願いします。 海外のサイトでも結構です。
100種類のデータ表現手法を学べる『aPToVM』 - IDEA*IDEA ～ 百式管理人のライフハックブログ ～
ドットインストール代表のライフハックブログ
デモではものができあがっているように見せない
Kathy Sierra / 青木靖 訳 2006年12月27日 (アルファ版のような)開発中のものを私たちが世間や、クライアントや、ボスに見せるときには･･･彼らの期待のレベルを設定することになる。これは3通りの方法でやることができる。磨き上げられたモックアップで幻惑するか、プロジェクトの現状に合ったものを見せるか、ほとんどできていないものを見せながら順調に進んでいるから「信用しろ」と言っていら立たせるかだ。 結論を言うなら: どれくらい「できている」ように見えるかは、実際どれくらい「できている」かに合わせるべきだ。 ソフトウェア開発者はみんなそのキャリアにおいてこのことを何度も思い知ることになる。しかしテクニカルライターもまた、デスクトップパブリッシングツールによって同様の問題に直面する——フォントやレイアウトが完璧に仕上げられたドラフトを誰かに見せるなら、その人はあなたが考えるよりも
温度に合わせて色を変化させる蛇口 - sta la sta
MOCO LOCO – Modern Contemporary Design 上の写真、青色の水が蛇口っぽい所から流れていますが、こちらはドイツのHansaという会社が考案した『温度に合わせて色を変化させる蛇口』だそうです。 Hansa HP:Startseite | Willkommen auf der HANSA Armaturen Webseite 色はLEDを使用して変化させているそうで、冷たい場合は青色、熱い場合は赤色になるのでしょう。直感的に分かっていいですね。 これならお子様が間違ってお湯に触れてしまう危険性も軽減できそうです。（突発的な場合は対応難しいでしょうけど。） またリンク先にもあるように使い方次第ではお部屋のインテリアにもなるでしょうし、水槽に組み込むのも面白いかもしれません。（魚は嫌がるかな。。） こちらにプロトタイプのビデオが紹介されています。 まだ写真の蛇口ほ
日付時刻の入力を支援するJavaScript - snippets from shinichitomita’s journal
WebページでスケジュールやToDoの完了日などの日付データを入力するのに、カレンダーで日付をピックアップさせるのもいいのですが、「来週の火曜の午後５時」というような自然文に近い表現で指定できたら役に立つかもなと思って作った、どちらかというと実用系のスクリプト。 「１０／１１ １３：００−１４：００」 「２日後 3:00(3h)」 「再来週金曜日」 といった表現から、JavaScriptのDateオブジェクトを作成します。 期間指定の場合は配列で開始日時と終了日時を返します。 実行例： http://stomita.web.fc2.com/dateextracttest.html ソースはこちら。 http://dateextract.googlecode.com/svn/trunk/js/dateextract.js 入力文自体が限られる環境においては、自然文の解析は予め想定されるパター
ファイルシステム - babie, you're my home
ディレクトリ管理とかダルイよね。検索ベースのファイルシステムって普及するのかな。Google デスクトップとか MSN デスクトップサーチ(だっけ？)とか出てるけど、ベースのファイルシステム自体はやっぱ変わらないのかな。その方がフレキシブル？ でも、構造化できると、構造化しないとダメなんじゃないかと強迫神経症的に思っちゃうからダメだよね。 あー、バージョン管理っつートピックがあったね。Plan 9 とか触ってみたいね。 フラットで、検索ベースで、バージョン管理、デフォルトは時系列順にリスティング、かねぇ。今でも Explorer というか Finder というか、TortoiseSVN みたいなラッパーアプリは作れるね。ファイル名と中身は、すなわち key と value なわけだから、subject と body でもあって、title と body でもあるから、ブログの記事とかがエク
Technologies for UI
自己紹介 2006年2月1日ライブドア入社 メディア事業部 開発部所属 プログラマ livedoor Readerなんかを作ってます
DarwiinRemote でプレゼン - naoyaのはてなダイアリー
そうそう、昨日のライブドアでのセミナーは ma.la と僕のプレゼンの二本立てだったんだけれども、その ma.la が Wii コントローラをリモコン代わりにプレゼンを操作してました。 DarwiinRemote (名前がイカス) を使って早速の Hack。 http://blog.hiroaki.jp/2006/12/000433.html 本人も特にその点にも触れてなかったし、後ろの方からだと気づきづらかったと思うのですが、昨日の面白トピックということで。 Wii コントローラは単体で買えて4,000円くらいだそうなので、普通のプレゼン用デバイス買うより安いしかっこいいんでない? なんて話をしてました。 Wiiリモコン メディア: Video Game購入: 2人 クリック: 138回この商品を含むブログ (68件) を見る
TRANS [hatena] - 印刷用CSSをまとめてみた。
以前、絵文禄のことのはさんのところで、サイトの横幅を640ピクセルにする理由――統計と現状に基づく結論というエントリーがあった。それから、ちょっと印刷用CSSに興味を持って、色々と調べてみたり、自分で書いてみたりした。そのまとめ。 ちなみに、#naviがグローバルナビゲーション、#primaryがメインコンテンツ、#secondaryがサブメニュー、#footerがフッター。 とりあえず、最低限やっておいたほうがよいこと。 body { font-size: 12pt; color: #000000; background-color: #FFFFFF; } a:link, a:visited { text-decoration: underline; color: #000000; } img { border: 0; } 印刷で読まれることを勘案するのなら、font-sizeはある程度
![TRANS [hatena] - 印刷用CSSをまとめてみた。](https://cdn-ak-scissors.b.st-hatena.com/image/square/860579fb9ea6fc896c86331cc2f3af60ddeb6ef1/height=288;version=1;width=512/https%3A%2F%2Fogimage.blog.st-hatena.com%2F6435988827676522384%2F6435988827676523499%2F1448268251)
Geekなあの人に贈りたい、オープンソースギフト MOONGIFT
さて、そろそろクリスマス。皆様ご予定はいかがでしょうか。 Geekな彼氏彼女をお持ちのあなたには、オープンソースなギフトはいかがでしょう。 例えば先日のオープンソースMP3プレーヤや、オープンソースロボット、オープンソースビールにオープンソースMIDIなどがあります。 尚、出来るだけお安くと言う方には、Portable Apps SuiteをUSBメモリに入れてプレゼントなんて手もあります。 個人的にはLinux入りのメディアプレーヤが好みです。 MAKE: Blog: The Open source gift guide - Open source hardware, software and more for the holidays
タイトルの区切り必要です
以前から何度か書いてるんですが… たとえば あれとかこれとか （Lefty） 大須は萌えているか？ （爆） 片方はブログトップ、片方は個別記事へのリンクです。 …やっぱりものすごくわかりづらいです。 記事タイトルとブログタイトルの間は単純なスペースじゃなく、 " : "とか、" - "とか、見てわかる区切り記号がほしいです。 やっぱり。 TB:gooブログ スタッフブログ 概要文機能改善のお知らせ
シニアはログインでつまづく？！ - Trans
最近、シニア向けのあるWebサービスを構築している。その中で、シニア（特に、団塊世代、もしくはそれ以上）の方が、どういったところでWebサービスにてつまづくのかが少し分かってきたので、自分の備忘録も兼ねてメモしておく。 先に言っておくと、シニアはまずログイン、もしくは新規登録でつまづく。「中に入れない」「何かパスワード間違えているみたいなんだけど」そういった質問が、どんどん寄せられる。このWebサービスを構築する前に、できる限りネット上でシニアのネット行動特性みたいなものは調べてみたが、その多くは「ログイン後」、もしくは「ログインする必要がないサイト」のことだったと、今更ながら気が付いた。例えば、 ユーザビリティ研究所: シニア向けウェブサイト構築のための10のポイント 使いやすさを考えてみる。(アクティブシニア・シルバー層の現場から) そう、シニアのネット上の行動特性はある程度研究が進ん
キャズムを超えろ！ - 団塊～シニア層向けのWeb設計 やっちゃいけない10のＵＩ
一時期パソコン教室の講師をやっていたことによる経験と、昨今Webサービス運用にあたって中高年層からのクレームなどを自分なりにまとめた結果として、50代以上のユーザに対するWebサービス＆PCアプリケーションのUI設計における以下10のTIPSを公開してみたいと思う。...といってもたかだか10個で収まる簡単な話ではないので、思いついたら都度追加して行きたい。 ID，ニックネームを考えさせてはいけない。半角英字開始限定は論外 IDやニックネームが思いつかない方が多い。これはシニアに限らず、ITリテラシーがそれほど高くない若年層についても言えること。作る側の人間も「過去にWebで使ったID,Nicknameは全て使っちゃダメ。何か新しいのを考えて入れてみて。」と言われると結構悩んじゃうもの。それと同じ状態に陥ると思っていただけるとわかりやすい。「IDのかわりに電話番号でもいいですよ」というと結
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IBM 仕事中に口笛を吹いて、コンピューターにコマンドを実行させる - Japan
みんな仲良しのつもり(2007-01-10) - UNIXパイプはどう失敗しているか
かなりクールで無償なHTMLテンプレート集、TemplateWorldより MOONGIFT
