週刊Webテク通信
2017年11月第5週号 1位は，ウェブサイトのカラースキームを作るための実践ガイド，気になるネタは，トヨタの小型ロボ「KIROBO mini」全国発売 クルマとも連携
ネットで見かけたWebテク
1. A Practical Guide For Creating the Best Website Color Schemeshttps://
ウェブサイトのカラースキームを作るための実践ガイドです。
以下の項目に分けて紹介しています。
- 伝えたい感情から始める
- 色数を制限する
- 完全な黒を使わない
- 60:30:10ルールに従ってみる
- 最初にグレースケールでデザインする
- 重要度を色のコントラストで表現する
- 連続性を持たせる
- アクセシビリティに考慮する
カラースキーム作成に役立つツールもいくつか紹介しています。
図1 カラースキームを作るための実践ガイド
2. Advocating for Accessible UI Design | CSS-Trickshttps://
UIデザインのアクセシビリティについて，
- アニメーションで簡単に
- 背景とテキスト色に十分なコントラストを付ける
- 画像の上に文字を載せるときは慎重に行う／
もしくは載せない - フォントの太さとサイズによる読みやすさについてダブルチェックする
- 外部リンクを分かるようにする
- ソーシャルメディアのプロフィールへのリンクとシェアなどのボタンとの区別を付ける
- アイコンと色だけで伝えようとしない
- インタラクティブ性がないときにデザインがどう見えるか考える
図2 UIデザインのアクセシビリティについての主張
3. 6 Animation Guidelines for UX Designhttp://
UXデザインにおけるアニメーションのガイドラインを6つ掲載しています。
- アニメーションはあとから考えるべきではない
- アニメーションは目的を果たさないとならない
- アニメーションはブランドを反映するべき
- アニメーションは主役ではない
- アニメーションは自然に感じされるものであるべき
- アニメーションは時間を無駄にさせてはならない
図3 UXデザインのためのアニメーションのガイドライン
4. 10 Must-Have User Interface Design Toolshttp://
ユーザーインターフェイスデザインのツールを10個まとめた記事です。
デザインツールだけでなく，
図4 ユーザーインターフェイスデザインのツール紹介
5. jQuery Pagination Plugins To Downloadhttp://
ページネーションのためのjQueryプラグインを紹介しています。
Bootstrapなどのフレームワークと組み合わせて使い，
図5 ページネーションのためのjQueryプラグインいろいろ
そのほか，
- プライベートモードはChromeよりもFirefoxが高速 | マイナビニュース
Mozillaによるベンチマーク結果の公表です - Facebook，
「Messenger」 の写真を4Kへ高精細化--まず日本， 米国， 韓国などから - CNET Japan
自動で処理されるので制限を気にしたことはなかったですが，2K→4Kに解像度アップとのことです - YouTube，
不適切なコンテンツ対策を強化 「YouTube Kids」 ガイドライン公開も - ITmedia NEWS
特に家族向けのようで実際はそうではないコンテンツが増えていることの対策だそうです
先週の気になるWebサービス
Threed.
スマホの画面に任意の画像をハメコミ合成できるサービスの3D版です。3Dで扱っているので，
スマホの3Dモデルは1種類だけですが，
まだベータ版とのことで，
図6 3Dモデルのスマホにハメコミ合成した画像を作れるサービス
今週の気になるWebネタ
トヨタの小型ロボ
ウェブサイトで先行販売していたコミュニケーションロボット
利用するにはスマホアプリが必要で月額350円かかるとのこと。新aiboもPepperもそうですが，
個人的には胸にバーンとロゴが入っているのでトヨタファン以外は買うのをちょっとためらうんじゃないかと思いました。OEMで違う会社から違うロゴで発売されても面白いかもしれません。
著者プロフィール
芦之由（あしのよし）
Webデザインやサイト制作に役立つブログ記事やニュースをほぼデイリーでお届けするメルマガ「デイリーWebテク」発行人。フリーのWebデザイナー兼イラストレーター＆ライター。シャープMZ-80Bからのパソコンユーザーで，Macintosh IIciからのMacユーザー。嫌いな言葉は「IEで見ると表示が崩れてるよ」。
デイリーWebテクの購読やバックナンバーについては，以下の紹介サイトをご覧ください。
デイリーWebテク - Webテク関連の話題を毎日配信 -
URL：http://www.rgs680.com/dwt/
バックナンバー
週刊Webテク通信
- 2017年11月第5週号 1位は，ウェブサイトのカラースキームを作るための実践ガイド，気になるネタは，トヨタの小型ロボ「KIROBO mini」全国発売 クルマとも連携
- 2017年11月第4週号 1位は，CSSグラデーションのチュートリアルと3つの利用例，気になるネタは，ビジネスチャット「Slack」に待望の日本語版--国内向けに「送信ボタン」新設
- 2017年11月第3週号 1位は，ログインするときのユーザー体験を向上させる方法，気になるネタは，Instagramストーリーズ，24時間以上前の写真も投稿可能に
- 2017年11月第2週号 1位は，FlexboxとCSS Gridを併用したレイアウトのススメ，気になるネタは，iPhone Xの顔認証はだませるか？ 実機で検証
- 2017年11月第1週号 1位は，モバイルでのUXの見栄えを良くするための5つのデザイントリック，気になるネタは，Saying Goodbye to Firebug（さよならFirebug）
関連記事
- 2018年12月第1週号 1位は，モバイルアプリのUXデザインでやるべきこと＆やらないこと，気になるネタは，「Microsoft Office」のアイコンデザイン、6年ぶりに刷新へ
- 2018年9月第2週号 1位は，ウェブデザインにアイコンをどう活用するか，気になるネタは，Microsoft，手書きのUIスケッチをHTMLに変換する「Sketch2Code」を発表
- 2018年8月第2週号 1位は，固定ナビゲーションメニューのトレンド，気になるネタは，FacebookとInstagramに使いすぎ防止機能追加へ
- 2018年7月第2週号 1位は，モバイルECサイトで上部にナビゲーションバーを追加することのススメ，気になるネタは，アプリで読み取ると商品ページに飛ぶ「Amazonスマイルコード」--雑誌などの出版物に
- 2018年2月第4週号 1位は，優れたデザインチームでも陥りがちなUXの間違い，気になるネタは，HomePodの“輪染み”防止用コースター、19.95ドルで予約受付中