Google Fontsのファイルサイズを簡単に軽量化できる！日本語フォントにも対応
Google Fontsは英語フォントだけでなく日本語フォントもあり、すでに使用している人、もしくは使用を検討している人も多いと思います。その際に懸念されるのが、フォントファイルのサイズです。 フォントファイルのサイズを劇的に軽減できる機能があります。 パラメーターで使用する文字のみフォントファイルを読み込め、これによりフォントファイルのサイズを大幅に削減できます。 タイトルや見出しのみにGoogle Fontsを使いたい時にぴったりです。 Google Fonts -Optimizing your font requests Google Chromeのエンジニア マネージャーであるAddy Osmani氏によると、CSSファイルにパラメーターを付けるだけで簡単にできる、とのことです。 日本語フォントにも対応しています！ Tip: Shave up to 90% off the size
現在の制作環境に合うよう開発された、使い勝手がよさそうな新しいCSSリセット -Destyle.css
使い勝手がよさそうな新しいCSSリセットがリリースされたので、紹介します。 Destyle.cssは現在の制作環境に合うよう開発されたCSSリセットで、Eric MeyerのリセットとNormalize.cssの不満点を解消するようスタイルのリセットと正規化の両方が実現されています。 Destyle.css Destyle.css -GitHub Destyle.cssの特徴 Destyle.cssのサポートブラウザ Destyle.cssの使い方 Destyle.cssの特徴 Eric Meyerのリセットは必要としない要素・未使用の要素・非推奨の要素もリセットされています。これによりスタイルは肥大化され、開発およびデバッグの効率が低下してしまいます。また、Normalize.cssは要素がブラウザ間で一貫して見えるようにうまく機能しますが、UAごとのスタイルは削除されずに残ります。 D
SaaS Pages
In version 2.0 you can now compare new vs old design on the company's page!
Google、画像のライセンス情報を画像検索に表示する機能を導入
[レベル: 上級] 画像権利の情報を示すラベルを画像検索に表示する機能を Google は試験的にスタートする予定です。 画像のライセンス所有者は構造化データまたは ITPC メタデータを構成することで、Google 画像検索に画像権利情報を表示できます。 Soon, we will begin beta testing a new way for sites to display licensing information about content that appears in Google Images. The new badging and license information display isn't live yet, but you can prepare your content for it now. Learn more: https://t.co/dPGAP2
UXデザインにおけるダークサイド｜zaxirolls
今回のお話サービス・プロダクトのUXとは何でしょうか？ サービス・プロダクトとユーザーの相互コミュニケーションを上手くつなげたり、ユーザーの目的を達成するためのデザイン（=仕組み・設計）がUXとも言えるかと思います。 サービス・プロダクトのUXをより良くするために、様々なデザインを考え実施していくことになりますよね。 その中で「邪悪だ」とか「ダークサイドに落ちた」と思ったことはあるでしょうか？ また何かしらのサービス・プロダクトを使っていてこれは邪悪だと感じるようなデザインに触れたことはありますでしょうか？ 今回はこの記事を見ながら、UXにおけるダークサイド・邪悪さについて考えていきましょう。 ①ダークサイドUX＝「企業の利益＞ユーザーの利益」という状態この記事では、ダークUXと記載していますがスターウォーズ好きのためダークサイドと記載させていただきます。 さて、この記事でのダークサイドU
ナッジを使ったUI/UXデザイン｜zaxirolls
今回のお話普段からアプリやWEBサービスを使って、SNSや買い物を楽しんでいるかとは思います。 その中で通知やポップアップ、アラートなどを見て「ウザいな」と思ったことはありませんか？ また反対に「いいタイミングで通知してくれて助かったな」と思ったりしたこともあるのではないでしょうか。 一体ユーザーによって何かしらの行動を気持ちよく促してあげられるデザインとはなんなのでしょうか。 今回は、この記事を見ながら「ナッジ」について考えていきましょう。 ３行まとめ①ナッジとは「自発的に望ましい行動を促す仕組み」 ②選択構造を意識したデフォルト設計 ③ユーザーの行動の誘引を与えよ ①ナッジとは「自発的に望ましい行動を促す仕組み」 ナッジという言葉は聞いたことがあるでしょうか？ 行動経済学や心理学などを大学などで学んだことがある方は一度は聞いたことがあるかもしれません。 ナッジとは2017年にノーベル経
「トークシナリオ法」でUIを設計する｜TSUYOSHI KANEKO / GOGEN株式会社CXO
インターフェースの設計をユーザー視点で構築するのは、決して難しいことではありません。 ここでご紹介するのは、私がユーザーとUIの整合性を取るために使う、最も簡単な思考法です。 良いインターフェースは会話をするあなたがこれから設計するインターフェースは、あなたの代わりにユーザーと会話をしてくれる人間のような存在です。 何かを販売・広告するウェブサイトなら、あなたの代わりに24時間営業トークを行うセールスマンのようなものであり、 また、ライフスタイルのアプリ等であればそれを隣で説明する良き友人であり、それが業務ツールであれば使い方を教えるよきメンターになります。 良いインターフェースのデザインを設計したいのであれば、このような優秀な解説者のトークシナリオ（台本）を作成するかのようにUIを設計するのが一つの解決策です。 よく設計されたインターフェースは、ユーザーの一つひとつの思考に対して、一つひ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
