Material DesignのFloating Action Button
マテリアル・デザインのコンポーネントのひとつであるFloating Action Buttonsについての記事を読んでいた。Inbox by Googleを始めとして、さまざまなアプリに既に採用されているFloating Action Buttons(以下FAB)だが、主張が強すぎるため、没入型のアプリではその体験を阻害してしまうという話のようだ。 そういうものだ、という捉え方ももちろんできる。しかしマテリアル・デザインのガイドでプライマリー・アクションに使うものと定義されていて、かつアクション・バーにボタンが配置できる以上、わざわざコンテンツにかぶる形で置く必要はあまりないだろう。もしアクション・バーのボタンを使いつつとなると、記事でも触れられているように、そのFABには間違ったアクションを割り当てていることになる。 他、単純にインターフェイスとして欠陥があることも指摘している。FABと
ConEmuのタブごとにカレント・ディレクトリーを復元
ConEmuでは、再起動した際にタブを復元するように設定することができるが、うまくカレント・ディレクトリーが復元されないことがある。各タブで使っているシェルに依存するので、シェル側で設定してやる必要がある。例えばGit for Windowsのbash.exeでは、~/.bashrcでシェル変数PROMPT_COMMANDを使ってカレント・ディレクトリーを明示的に記憶させる。 PROMPT_COMMAND='ConEmuC -StoreCWD' これだけではなく、ConEmuC.exeにパスを通さなければならない。ConEmuのSettings→Startup→ComSpecで「Add %ConEmuBaseDir% to %PATH%」を有効にすることで可能だ。もちろんシステムのPATH環境変数を編集しても良い。 これでSettings→Startupで「Auto save/restor
Git for Windows v2.x.xのインストール
Git v2系のWindows版がGit for Windowsの方で少し前から公開され始めていたことを今さら知ったので、更新した。2015/05/05現在はv2.4.0がリリースされている。インストールから動かすまでけっこう手間取ったので、メモがてら記事に残しておく。Git v2の使い勝手とかについては特に書かない。 ~/.bashrcの読み込み このGit for Windowsでは、デフォルトで無理やり~/.bashrcを読みに行くことがなくなった。~/.bash_profileは読みに行くので、~/.bash_profileから~/.bashrcを読みに行くように、つまり普通にBashを設定してやれば良い。 if [ -f ~/.bashrc ]; then . ~/.bashrc; fi これだけ書いた~/.bash_profileを作成するのが良い。あまり関係ないイシューではそ
ConEmuでのスクロール
ConEmuではBuild 141022辺りから、画面のスクロールが変更され独自にスクロールされるようになった。今までは隠されたコマンド・プロンプト画面をスクロールさせ、それをコピーした画面を表示していたけどそうじゃなくなったことにより、スクロールがおかしくなって出力が重なることがなくなった。clsする頻度が大きく減って助かる。 ConEmuは色々と気持ち悪い。特に設定を探すために設定画面とかをずっと見つめてると使う気が失せてくる。後で設定を変える必要があることはほとんどないので、最初の設定という壁を超えられるかが使うための鍵と言えそう。そういう意味でcmderはちょっとバカにしていたけれど存在意義は大きいんだなと思った。実際僕もこれを見てConEmu使ってみようかという気分になったし。 最近のConEmuは起動時にタブ(のプログラム)とそのカレント・ディレクトリーを復帰できるようにもなっ
インストーラー
事前に内容を確認できフォルダーごと捨てるだけでアンインストールできるように、ZIPアーカイブでアプリケーションが配布されていることを数年前までは好んでいた。しかし今はインストーラーを好むようになった。 ZIPアーカイブを展開して、フォルダー名をちゃんとして、特定のパスへ移動するという作業がとにかく面倒になった。近年のWindowsはシステム・フォルダーへの移動やそこでのファイルの作成に制限があるので、アプリケーションの管理を複数のパスで行わなければならなくなるのももう飽きた。 インストーラーだとインストールはもちろん自動化されている。最近はきれいにアンインストールされることも多いので、そういう点でも頭を使わなくて済む。 インストーラーの悪さはその不透明さで、特にWindowsではレジストリに密かに色々書き込まれて、よくわからないことになるのは致命的だ。少し前にInkscapeのインストーラ
反論
好きなものや気に入っているものについて否定された時に、そうじゃないだろと反論したい気になるのはわかる。しかし、往々にして反論のための論理で食ってかかることが多く、それでは溝を広げる結果にしかならない。溝を埋めることは難しいが、食ってかかってわざわざ溝を広げる必要もない。 反論のための論理で展開される記事でありがちなのは、否定された点についてすべて反論するような形のものだ。対象のトピックについて気に入ってはいてもパーフェクトであることはまずないので、それらのいくつかは自分が今までまったく気にしていなかった点や我慢していた点が必ず含まれるはずだ。そういった点に対しても反論しようとすると、反論のポイントがずれやすい。 そういった反論は埋めたい溝とは見当違いのところを埋めようとする作業に他ならない。そのため溝を埋めるどころか、周辺の味方に迷惑をかけることになる。 そのような記事は、最終的に反論する
コンテンツとUIパーツの比率
コンテンツとUIパーツ(chrome)の比率についての記事を読んだ。単純にコンテンツを最大限確保するのではなく、画面サイズに応じて適切な大きさでUIパーツを提供することによって、コンテンツとUIパーツの比率への影響を最小限に抑えるべきだという風に読んだ。U-Siteでの日本語訳に期待したい。 Chrome (ブラウザーの方)やFirefoxのハンバーガー・ボタンやWindows 8のチャーム(廃止されるらしい)のような極小化したUIパーツは、発見性や再現性、そしてインタラクション・コストが高いということのようだ。ハンバーガー・ボタンの文脈でよく語られるあの三本線が何を意味しているかユーザーがわかるのかどうかという話のもっと前の段階で問題があるということだろう。 主にデスクトップ・アプリケーションでの話だけれども、逆にモバイル・アプリケーションでUIパーツを大きくしすぎないことにももちろん繋
G.F.
Google Fontsのフォントをだらだら眺めることの出来るページ、G.F.を作った。ページを開いて少し待つと最初のフォントが表示される。何もないところをクリックで次のフォントが表示されるので、ひたすらクリック！ Shiftを押しながらだとひとつ前のフォントに戻れるので、あっと思っても大丈夫。 カラースキームは適当に24パターン作ってランダムに使用している。全体的に落ち着いたトーンのものにした。フォントによっては見づらくなるのは愛嬌。色は右上の丸に?をクリックすると出てくるヘルプ・メニューに操作法とともにrgb()で表示しておいた。 Chrome 29が一番速く普通に表示される。Firefox 24ではFOUTの関係上フォントが表示されてから適用されるまでに間がある。Internet Explorer 10では描画されないWebフォントのパースとレンダリングが裏で行われてしまうようで、最
Gruntべったり
Gruntをよく使うようになったけど、プロジェクトの中心にどっかと存在していると不自由なことが多い気がするなーと感じている。Gruntべったり、つまりプロジェクトをGruntに強く依存させるとポータブルである保証のあるタスクだけを使う(書く)ことを強いられる。Gruntはその雑な自由度が良い所で、そこに何かしらの制限が加わってしまうのはその良さを低減させてしまうと思う。 Node.js自体にクロスプラットフォームだけどさほど書かれるスクリプトのポータビリティを意識した作りになってないような印象を持っている。そのためその上で動くGruntでポータビリティとかなんの冗談だとか思ってしまう。 Gruntの開発チームが公式にメンテナンスしているgrunt-contrib-*は確かに安定して優秀で、大体のことはポータブルなそれらで事足りたりする。だけど簡単なタスクを書いて使いたい時はもちろんあるし、
altってあれでしょ？ あのーほら……
HTML Standardsの中でも屈指のややこしさな気がする4.8.1.1 Requirements for providing text to act as an alternative for imagesを全容を把握しやすいように箇条書きにして日本語に訳した文書、HTMLにおけるimg要素のalt属性を作成した。 ややこしいというよりも説明それ自体はかなり親切なんだけど、その親切さのお陰で情報量がものすごく多いため読んでるうちにポロポロと読んだことを忘れていく気がする。なので、サンプルコードや仕様書特有の正確だけど持って回りすぎた難しい言い回し等を省いたこの箇条書きならなんとなく覚えられると思う。その上で原文の実践的なサンプルコードを読めば理解がかなり進むんじゃないかと。 HTML Standardsにはこういうアンチョコ・セクションはいくつかあって、他だと4.4 Sections
CSSでアイコンをデザイン
ものすごく大雑把に言うと今まで画像編集ソフトでやっていた、角を丸くするとか背景をグラデーションにするなどという作業をCSSでやってしまおうというお話。もちろんCSSでできないことは多くあるので万能というわけではないが、できることに限って言えば数行のCSSコードでスクリーンショットのような効果を柔軟に適用することができる。 Demo: Design icon with CSS ul li a { display: block; width: 32px; height: 32px; background-image: url("icons-w.png"); background-repeat: no-repeat; text-indent: -10000px; } 各アイコンになるa要素へのスタイルは以上のような単純なものがベースになる。icons-w.pngがアイコンの前景をつなげたスプライ
Bookmarks MenuのUIフォントにSegoe UIを使う
ブックマーク バーが邪魔でしょうがない気がしてきたので、ブックマークをツールバーボタンからドロップダウンで参照できるBookmarks MenuというGoogle Chromeの拡張を使い始めた。ドロップダウンのUIはそこそこカスタマイズ出来るものの、なぜかUIフォントが訳の分からないフォント、Arial Rounded MT BoldやらLucida Consoleやら限定な感じでかなり悲しい。とはいうもののこの拡張に限らずChromeのポップアップと呼ばれるツールバーボタンクリックして出てくるアレは普通のHTMLのためユーザースタイルシートでフォントの置き換えが効き、結構簡単にSegoe UIに置き換えることが出来る。 まずは置き換えても害の無さそうな、つまりウェブで使われてなさそうなArial Rounded MT BoldをUIフォントとして普通に設定する。 次にGoogle Ch
Google Chrome 10以降で昔のフォント設定ダイアログを呼び出す
メモとして書いたGoogle Chrome 10以降の注意点でのフォントのフォールバックの問題は解消されていない上、stableも10になってしまったのでこのメモの方法はもう通用しない(Google Packだとまだ9系統かも)。が、昔のフォント設定ダイアログを呼び出す方法があるので、それを使ってフォント設定をしてやれば回避できる。 やり方は任意のウェブページの入力エリアのコンテキスト・メニューからスペルチェックのオプション→言語設定と辿るだけ。 すると以前のフォント設定ダイアログが出てくるので、そこで改めてフォントを設定してやればちゃんとそのフォントがフォールバックされるようになる。 フォントのフォールバックとは、CSS等で指定されたフォントに含まれてない文字を表示する時に使うフォントを決定する仕組み……のことを指す(正確になんというものかはよく知らない)。この仕組みによって、 font
What Does It All Mean? - Dive Into HTML5の日本語訳
多くの人がDive Into HTML5のコンテンツの中で最も気になるであろう(X)HTML( 4)からHTML5への移行を題材として、HTML5の書き方や新しい要素などの説明したWhat Does It All Mean?の日本語訳、「結局どうすればいいの？」を公開した。前に二度全部訳そうと思って、言い回しの複雑さにさじを投げたが、今回はとりあえず自分が一番最初に熟読したWhat Does It All Mean?に絞って訳した。 この章は既存のウェブページのHTML5への移行を題材としているだけで、移行法についての解説とは少し違う。そう読んでもそんなに期待外れではないが、脱線が特に序盤に多いので、細かいことに興味はないならHeadersあたりから読んでも良いかも。もちろんこの文書はHTML5の完全な解説ではないので、例えばaside要素やsection要素の詳しい説明などは欠けているし
Vimで最後のタブを閉じても終了しない
Firefoxとかタブ付きエディタによくある最後のタブを閉じても終了せずに新規ファイルを編集するタブが開かれる機能がVimにもずっと欲しかった(特にgVim)。なるべく閉じないように使うことにしていたが、よく:wqaとか勢いで打ってしまい悲しいことに。そろそろどうにかしようと色々調べて、:cabbrevコマンドで:qとかを書き換えてやれば良さそうということがわかった。 :cabbrevでのビルトイン・コマンドの置き換えはReplace a builtin command using cabbrevで知った。コマンドの種類を取得するgetcmdtype()とコマンドの開始位置を取得するgetcmdpos()を使って、割り当てがコマンドの途中にでてきたりした場合に展開されないようにする。 現在のウィンドウを新規ファイルを編集する状態にするには:enewで良いので、:qaや:wqaの場合は:ta
Windows 7のナビゲーション ウィンドウを比較的安全にカスタマイズ
ネタ自体はインストール後最初にやりたくなることで何を今更な話。が、ググるとHKEY_CLASSES_ROOTを開いてアクセス権を変更して……とかばっかりだったので、HKEY_CURRENT_USER以下で大概なんとかなるのでそっちでやろうという話。せっかくCLSID以下はなかなかいじれないようになっているのに……みたいな宗教。嘘かもしれない。 マイコミジャーナルのWindowsスマートチューニングとかに書かれているやり方はHKEY_LOCAL_MACHINEかHKEY_CLASSES_ROOT以下をいじる方法で、デフォルトの状態に復活させるのがとても面倒。レジストリのキーを書きだしてバックアップ……とかやりたくない。実はHKEY_CLASSES_ROOT以下はHKEY_CURRENT_USER\Software\CLASSES以下のキーとHKEY_LOCAL_MACHINE\Softwar
未整理のブックマークをブックマークツールバーに表示
最近はブックマークを適切なフォルダに整理することを放棄して、どんどん未整理のブックマークに放り込み、ロケーションバーから絞込みしやすいように適当に半角英数でタグ付けするだけな感じで生活している。これで大抵の場合は問題ないが、Fx3.5では未整理のブックマークには履歴とブックマークの管理のウィンドウからしかアクセスできない(よね？)ので、一覧したい時などにかなり不便。ブックマークツールバーにでも表示させられれば良いのになぁとちょっと調べてみたら結構簡単に出来たのでメモ。 未整理のブックマークはFirefox内では以下のようなで参照されているので、これをブックマークすれば良い。 place:folder=UNFILED_BOOKMARKS 具体的には下記スクリーンショットのようにしてブックマークを作成するだけ。いきなりブックマークツールバー上に作成すると、フォルダにならずクリックしても「pla
スマートキーワードは後ろが良い
IE5(やそれを利用したタブブラウザ)を利用していた頃からロケーション・バーで検索していたので、特に操作性が優れているわけでもない検索バーなどはまったく使う気になれずスマートキーワードしか使ってない。最近はロケーション・バーで履歴やブックマークの絞込みも可能なので、ますます重要度が上がった。このスマートキーワード機能自体に特に不満があるわけではないのだけど、キーワードは前に付けるのではなく後ろに付けるのが良いのじゃないかと、履歴やブックマークの絞込み機能が付いて以降は考えるようになった。「g foobar」じゃなくて「foobar g」というように。 上述の通り、今の多くのブラウザは履歴やブックマークをロケーション・バーから手軽に検索できるので、 とりあえず探したい情報に関係ありそうな単語をロケーション・バーで入力する 見つかった: そのままドロップダウンから選択して開く 見つからなかった
Version Control for Designers
このドキュメントは Version Control for Designers の日本語訳であり、元のドキュメントと同じくソースコード管理に予備知識がまったくない人を想定している はじめに リポジトリの構造 ブランチ 作業の流れ ブランチを切る その他の便利なツール ベスト・プラクティス はじめに What have you done for me lately? バージョン管理、ソース管理やリビジョン管理とも呼ばれているものはあらゆる開発に必須である。なぜなら基本的にはメールやインスタント・メッセンジャーと同じようなコミュニケーションをとることができるツールでありながら、人々の会話ではなくソースコードを元にして機能することができるからだ。 バージョン管理 他のプログラマと簡単に意思の疎通を図ることができる 開発チームでコードを共有することができる デプロイしている「製品」バージョンを別個
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
git push --delete