政府のサイトに統一感を持たせるためにアメリカ政府が開発したツール「USWDS」とは？
アメリカでは国の組織ごとにさまざまなウェブサイトが作成されています。そうしたサイトはそれぞれの組織が自ら作成しているのですが、別の組織が作成しても統一感が出るようにするために政府自らツールを作成し、パブリックドメインで公開しています。 18F: Digital service delivery | Introducing the U.S. Web Design Standards https://18f.gsa.gov/2015/09/28/web-design-standards/ Introducing USWDS 2.0 / DigitalGov - Building the 21st Century Digital Government https://digital.gov/2019/04/08/introducing-uswds-2/ アメリカ政府のウェブサイトはそれぞれの組織
分かりやすいWeb入力フォームのための十戒 | POSTD
1. 各々の入力欄に、常に見えて分かりやすいラベルを付けよ 記入する前の入力欄にだけ、フォームのラベルを表示するのがWebデザインの主流になっています。これはユーザネームやパスワードなどを入力する際にはシンプルで使い勝手がいいのですが、それ以上に長い文字列になると少々勝手が悪くなります。 そのため余白があるのであれば、ラベルを表示すべきです 特に、長いフォームの場合では、ユーザは入力したものを見直すでしょう。どのラベルが入力欄と合致するのか分からなければ、間違いがないよう見直すことなどできるはずがありません。 改善前:入力欄中にラベルが記入してあります。今は見やすいかもしれません。 しかしフォームに入力するとラベルが見えなくなってしまい、間違いを見つけにくくなってしまいます。 改善後:それぞれの入力欄に、クリアでいつでも見えるラベルを付けましょう。 2. 十分な大きさのフォントを使用せよ
WebエンジニアのためのWebサービスデザイン実践講座
DeNA 社内勉強会に呼んでいただいて、お話させていただきました。 Reviewに登場していただいてるサービスはこちらです。 動く小説投稿サイト Denkinovel by @katryo さん http://denkinovel.com/ ご協力ありがとうございました( ˘ω˘)
Easel
Easel is an in-browser, high-fidelity web design tool aimed at designers and developers on small teams.Design For the Web Easel is an in-browser, high-fidelity web design tool that lets you mockup, share and implement your ideas with ease. Design Design accurately with built-in web fonts and true-to-browser rendering. Start quickly by importing your existing styles with our chrome extension. Share
破綻しない色の組み合わせが簡単に作成できる「ColorJack: Sphere」 - GIGAZINE
色彩構成を決めるのはなかなか難しいものがありますが、この「ColorJack: Sphere」を使えば、色彩の理屈にぴったり合った感覚のみに頼らない正確な色彩構成が可能です。 詳細は以下の通り。 ColorJack: Sphere 例えばこの「Neutral」なら連続した色を簡単に選ぶことができます 「Analogous」ならもうちょっと間隔を開けて選択するので色彩に幅ができます 「Clash」は補色の関係を考えるのに使える 「Six-Tone」あたりは割と使いやすい 「Websafe」にするといわゆるセーフカラーのみで選択可能になります 元々の色の組み合わせ自体をスペクトラム風以外にもいろいろと変更可能で、カスタム設定すればこんなことも可能です
ウェブ簡単ロゴ作成「FREE Logo Maker」 - ネタフル
ロゴをオンラインで作成できるFREE Logo Makerはネットサービスがわかっていすぎるというエントリーより。 自動生成系のロゴメーカーというのは、これまでにもけっこう見たけど、ここまでのデザインパターンとフォントの自由さを持ったものは完全にはじめてお目にかかりました。 みたいもんで「FREE Logo Maker」が紹介されていました。 1. ベースデザインを選んで 2. 文字を決めて 3. フォントを決めて 4. カラーを決めて 5. サイズを決めて（ベースデザインもフォントもサイズを変えられる） 6. 角度を決めて（ベースデザインもフォントも角度を変えられる） 7. 位置を調整（ベースデザインもフォントも位置を変えられる） 試してみたのですが、実に簡単ですねぇ。 さらに良いのは「このデザインどうよ？」と友達にメールで聞けるところなのです。きちんと集計までしてくれるそうです。 ロゴ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
CSS Cheat Sheet
