週刊Webテク通信

2019年10月第5週号 1位は,色のコントラストのアクセシビリティへの俗説に対する反論,気になるネタは,iPhoneケースと合体する小型ドローン登場 重さ68グラム カメラ搭載で空からセルフィー

この記事を読むのに必要な時間:およそ 2 分

ネットで見かけたWebテク(Webテクニック・Webテクノロジー)記事から,Webデザイナーの目で厳選したネタを週刊で紹介するこのコーナー。今回は,2019年10月21日~10月27日の間に見つけた記事のベスト5です。

1. The Myths of Color Contrast Accessibilityhttps://uxmovement.com/buttons/the-myths-of-color-contrast-accessibility/

色のコントラストのアクセシビリティに関する俗説とそれを否定する根拠とを解説しています。

  • 俗説1:Webコンテンツアクセシビリティガイドラインの要件は常に最適
  • 俗説2:テキストはAAA要件を満たす必要があり,そうでなければアクセシブルではない
  • 俗説3:インターフェイスコンポーネントのコントラスト比の基準もテキストと同じ
  • 俗説4:グレーの背景色にグレーのテキストのボタンはアクセシブルではなく認識できない
  • 俗説5:色覚異常のユーザーは,対照的な色の違いを区別できない
  • 俗説6:情報を伝えるのに色だけを手がかりにするのは十分ではない

図1 色のコントラストのアクセシビリティへの俗説に対する反論

図1 色のコントラストのアクセシビリティへの俗説に対する反論

2. The problem with dropdown fields (and what you should use instead) | Design Smartshttps://designsmarts.co/the-problem-with-dropdowns/

ドロップダウンの問題点と正しく使うためのヒントを解説しています。

ドロップダウンの良い点
  • スペースを節約できる
  • 標準的な入力方法である
  • あらかじめ用意した答えを集めることができる
  • 柔軟性がある
ドロップダウンの悪い点
  • 使うのが難しい
  • ユーザーはときどき見逃す
  • 標準状態では利用可能なオプションが隠れている
  • ユーザーの処理速度が遅くなる

図2 ドロップダウンの問題点と正しく使うためのヒント

図2 ドロップダウンの問題点と正しく使うためのヒント

3. 30 Creative Pinterest Design Boards You'd Love!http://www.webdesigndev.com/pinterest-design-boards/

デザインワークの参考になるPinterestのボードをまとめています。

UI/UXデザインをまとめたもの,ウェブデザインをまとめたものもありました。

図3 デザインワークの参考になるPinterestのボードいろいろ

図3 デザインワークの参考になるPinterestのボードいろいろ

4. Vector Creator — Create engaging illustrations in-browser for freehttps://icons8.com/vector-creator?ref=producthunt

用意されたイラスト素材を配置して,1枚の画像を作成して書き出せるサービスです。

アイコン素材でおなじみのICON8が作っています。ICON8は写真素材を組み合わせて画像を作成するツールも作っていて,以前紹介したことがあります。

図4 イラスト素材を配置して画像を作るサービス

図4 イラスト素材を配置して画像を作るサービス

5. 25 Days of CSS Animations: Teaching Myself CSS through Motion Design. - DEV Community 👩‍💻👨‍💻https://dev.to/acupoftee/25-days-of-css-animations-teaching-myself-css-through-motion-design-4l10

25日間でCSSアニメーションを学ぶ様子を作品とともにまとめた記事です。

人の作品を真似することから始めたこと,途中で自分のやっていることに価値があるのか疑問に思い,ウェブ制作に応用してみたことなど,考え方がしっかりしていて参考になります。

図5 CSSアニメーションを学ぶ様子をまとめた記事

図5 CSSアニメーションを学ぶ様子をまとめた記事

そのほか,最近の記事の中から,気になるニュース記事を紹介します。

先週の気になるWebサービス

Direktor - The Bit.ly of URL Splittinghttps://direktor.io/

1つのリンクで複数のページにランダムに移動できるURLを作れるサービスです。ABテストなどに使えそうです。

作り方は簡単で,URLを1行に1つ記述していくだけです。生成されるURLに,自分の好きな文字列を入れることはできません。最初の1つのリンクは無料で,次からは1つ1.5ドルで作れます。月額7ドルの作り放題プランも用意されています。

わたしのやっているポッドキャストのリンクを作ってみました。ポッドキャストは配信先がたくさんあるので,ランダムにAnchor,Spreaker,Spotify,Apple Podcast,Google Podcastに飛ばすリンクとなっています。

図6 複数のページにランダムに移動できるURLを作れるサービス

図6 複数のページにランダムに移動できるURLを作れるサービス

今週の気になるWebネタ

iPhoneケースと合体する小型ドローン登場 重さ68グラム カメラ搭載で空からセルフィー - ITmedia NEWShttps://www.itmedia.co.jp/news/articles/1910/25/news125.html

専用iPhoneケースに装着して持ち運べる小型ドローンが登場しました。最初,iPhoneを装着したまま飛ぶドローンかと思ったのですが,違いました。

小型で軽いのはいいですが,たまにしか飛ばさないドローンを常にスマホと共に持ってるのもどうかなという気もします。12メガピクセルのカメラを搭載し,0~15メートルの高さから静止画や動画を撮影できるそうです。

重量が改正航空法の適用基準を下回っているので,禁止されている場所を除けば許可なしで飛ばせるのもメリットです。人の顔を認識して自動追尾できるそうで,いつでもセルフィーを撮りたい人には魅力的なドローンですね。

著者プロフィール

芦之由(あしのよし)

Webデザインやサイト制作に役立つブログ記事やニュースをほぼデイリーでお届けするメルマガ「デイリーWebテク」発行人。フリーのWebデザイナー兼イラストレーター&ライター。シャープMZ-80Bからのパソコンユーザーで,Macintosh IIciからのMacユーザー。嫌いな言葉は「IEで見ると表示が崩れてるよ」。

デイリーWebテクの購読やバックナンバーについては,以下の紹介サイトをご覧ください。

デイリーWebテク - Webテク関連の話題を毎日配信 -
URLhttp://www.rgs680.com/dwt/