タグ

2015年6月25日のブックマーク (8件)

  • 分かりやすいWeb入力フォームのための十戒 | POSTD

    1. 各々の入力欄に、常に見えて分かりやすいラベルを付けよ 記入する前の入力欄にだけ、フォームのラベルを表示するのがWebデザインの主流になっています。これはユーザネームやパスワードなどを入力する際にはシンプルで使い勝手がいいのですが、それ以上に長い文字列になると少々勝手が悪くなります。 そのため余白があるのであれば、ラベルを表示すべきです 特に、長いフォームの場合では、ユーザは入力したものを見直すでしょう。どのラベルが入力欄と合致するのか分からなければ、間違いがないよう見直すことなどできるはずがありません。 改善前:入力欄中にラベルが記入してあります。今は見やすいかもしれません。 しかしフォームに入力するとラベルが見えなくなってしまい、間違いを見つけにくくなってしまいます。 改善後:それぞれの入力欄に、クリアでいつでも見えるラベルを付けましょう。 2. 十分な大きさのフォントを使用せよ

    分かりやすいWeb入力フォームのための十戒 | POSTD
    kyaido
    kyaido 2015/06/25
  • 私がAtomからSublime Textに戻った理由 - 文系プログラマによるTIPSブログ

    テキストエディタの基礎部分となる、パフォーマンス面からatomとSublimeTextを比較して見た結果、Sublime Textに戻ったよ、というお話です。 macのプログラマ御用達のテキストエディタと言えば、真っ先に挙がるのが「Atom」と「Sublime Text」ですね。 最近「atomスゲーよ!!」というブログ記事をチラホラ見るようになったので、私は去年から半年間、会社でプログラミング用途としてatomを使ってみました。その実体験を元に両者の真実を書いてみようと思います。 最近ではLight Tableなんかも出ましたが、今回はこの2つのテキストエディタに焦点を当ててみます。 ※ 今回はGIFアニメ多めです おさらい Atom Sublime Text 検証環境 何が問題なのか パフォーマンス atomによる一括置換の様子をGIFアニメで確認する Sublime Textによる一

    私がAtomからSublime Textに戻った理由 - 文系プログラマによるTIPSブログ
    kyaido
    kyaido 2015/06/25
  • Re: role 属性を正しく設定してアクセシビリティを高める - 水底の血

    role 属性を正しく設定してアクセシビリティを高める | NEAREAL リンク先をざっと目を通した感じ、真摯に書かれているエントリーだと思いますが、いくつかコメントしてみるテスト。 role 属性は HTML などで使いますが、role 属性に与える値や役割は HTML とは切り離された、 ARIA や WAI, WAI-ARIA と表記される区分に定義されています。 role によって役割を明確にする意味 - role 属性を正しく設定してアクセシビリティを高める | NEAREAL role属性の定義はWAI-ARIA仕様でなされますが、これをWAIとは表記しないんじゃないかなあと。 で、WAI-ARIAとはなんぞやと言うことですが、1つの説明として仕様から引用してみましょう。 WAI-ARIAは、ネイティヴ言語のセマンティックに対する代替としてでなく、補足として使用されることを意

    Re: role 属性を正しく設定してアクセシビリティを高める - 水底の血
    kyaido
    kyaido 2015/06/25
  • 日本一の透明度を誇る清流でSUP体験&土佐の珍味に溺れた2日間 | エクストリーム体験・観光のレポート|高知家

    このたび、「高知をめいっぱい楽しんできてください」というありがたいミッションをうけ、「えっ、いいんですか。私でよければ死ぬほど楽しんできますよ」と二つ返事で高知にやってきました。

    日本一の透明度を誇る清流でSUP体験&土佐の珍味に溺れた2日間 | エクストリーム体験・観光のレポート|高知家
  • すごい人達呼んで「Webは死ぬか?」をマジメに語り合ってもらった-前編- | HTML5Experts.jp

    【及川卓也・清水亮・羽田野太巳・藤村厚夫】すごい人達呼んで「Webは死ぬか?」をマジメに語り合ってもらった(前編) 白石 俊平(HTML5 Experts.jp編集長) 今また、「Webの死」を予言する論調をそこここに見かけます。モバイルやウェアラブルといった新たなコンテキストが、プラットフォームネイティブな技術の優位性を後押ししているだけではなく、Webコンテンツの消費の仕方を大きく変え、Web上で成り立っていたビジネスモデルをも脅かしつつあります。 当にWebはヤバいのか、気になってしょうがないので、スゴい人たちに集まってもらって、「Webは死ぬか」について語り合っていただきました。Webを取り巻く様々な論点を包括的に議論でき、貴重な場になったのではないかと自負しております。 Webに関わる人にとっては必読の対談だと思います!でもこの記事、長くて濃いので、心してかかってくださいね:-

    すごい人達呼んで「Webは死ぬか?」をマジメに語り合ってもらった-前編- | HTML5Experts.jp
    kyaido
    kyaido 2015/06/25
  • Contextual Styling: UI Components, Nesting, and Implementation Detail – CSS Wizardry

    13 June, 2015 Contextual Styling: UI Components, Nesting, and Implementation Detail Written by Harry Roberts on CSS Wizardry. Table of Contents Implementation Detail Nesting The Good The Bad Utility Classes The Good The Bad One Stateful Class The Good The Bad The Best Solution The Takeaway With the recent move toward componentised UIs—that is, instead of building monolithic, page-based websites, w

    Contextual Styling: UI Components, Nesting, and Implementation Detail – CSS Wizardry
    kyaido
    kyaido 2015/06/25
  • Nesting Components

    ..or the struggles with contextual styling. — Using CSS components is somewhat straightforward. We add the markup and give it the component’s class name and all is good. Where it gets trickier is when we try to nest components. And when they need to be tweaked based on the context. Where should the styles be defined? It’s a question I’ve been asking myself a few times and what this article is tryi

    Nesting Components
    kyaido
    kyaido 2015/06/25
  • Photoshopの使い方: 作業パフォーマンスを向上させる最適な環境設定のまとめ -CC2015対応 | コリス

    Photoshopでの作業がもたついたり、もっときびきび動作させたい、とパフォーマンスを向上させたい時に、見直したいPhotoshopの環境設定の項目を紹介します。 How To Optimize Photoshop For Better Performance 下記は、以前紹介した記事をCC2015対応に編集したものです。 ※翻訳・編集にあたり、元サイト様に許可を頂いています。 ヒストリーとキャッシュ グラフィックプロセッサー 仮想記憶ディスク メモリの使用状況 64ビットモード レイヤーパネル フォントプレビュー UIのアニメーション動作 作業時にパフォーマンスをさげない方法 ヒストリーとキャッシュ Photoshopで作業する際に最初にチェックしておきたい項目は、キャッシュです。キャッシュを必要最小限にすることで、パフォーマンスが向上します。 設定方法 [環境設定] - [パフォーマ

    Photoshopの使い方: 作業パフォーマンスを向上させる最適な環境設定のまとめ -CC2015対応 | コリス