2019年9月第4週号 1位は、シェア（共有）機能、シェアボタンについての考察、気になるネタは、アリババ、スマートスピーカー「Tmall Genie」でスタバのコーヒーが注文可能に

ネットで見かけたWebテク（Webテクニック・Webテクノロジー）記事から、Webデザイナーの目で厳選したネタを週刊で紹介するこのコーナー。今回は、2019年9月16日～9月22日の間に見つけた記事のベスト5です。

シェア（共有）機能、シェアボタンについて、モバイルとパソコンの違いやアイコンデザインについて考察した記事です。

モバイル環境では、6割の人はシェアボタンを使ったことがないというアンケート結果もあるそうです。しかし、OSが用意しているシェア機能を使う場合も、シェアボタンがあることがシェアしようと思うきっかけのケースもあるので、ボタンが押されたことだけが重要ではないとのことでした。

モバイルではOSが用意するシェア機能を使い、パソコンでは独自のシェアボタンを出すのが今のところ最適解のようです。シェアボタンに「メールで送信」ボタンを入れるケースもありますが、Gmailなどオンラインのメールとうまく連動しないことが多いので、URLをコピーするボタンの方がおすすめと解説しています。

OS標準のシェアボタンは、Androidのものが認識されやすく、以前Appleが使っていた左向き矢印のものはYouTubeで使われて認識率が上がったそうです。今のAppleの上向き矢印のものは、ダウンロードの逆になっているだけでわかりにくいという評価でした。

フォームのボタンの配置についてのヒントを紹介しています。

5は検索窓などのケース、6はCMSの管理画面で記事一覧を操作するボタンなどのケースですね。

ダークモードのための配色について解説した記事です。

カラーシステムを管理し、設計時にライトモードとダークモードを切り替えるSketchのプラグインも紹介しています。

パーフェクトなレスポンシブメニューの作り方です。

PCサイズでは右寄せの水平メニュー、モバイルサイズではハンバーガーメニューから展開し、横方向センター揃え＆縦方向均等配置のメニューになります。

個性的なレイアウトのウェブサイトを15個紹介しています。Webflowでこんなサイトが作れるというPRの意味もある記事です。

一見シンプルで色数も少ないですが、スクロールしていくと変化する凝ったサイトが多いです。スクロールによる効果が多いのは、Webflowがそういうページを作りやすいからなのでしょう。

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

Chromeブラウザのカスタマイズやタブグループ化など、今秋登場の新機能 - ITmedia NEWS
アドレスバーに質問を入力すると、アドレスバー内に回答が表示される機能は面白いですね
Google検索結果、動画の“⁠重要なポイント⁠”を表示 - ITmedia NEWS
「⁠例えばハウツー動画ならステップごとに、長い講演ならテーマが変わるポイントなどに、直接飛べる」とのこと
Googleのペアレンタルコントロールアプリ、ファミリーリンクがより実用的になった | TechCrunch Japan
アプリ単位の制限となり、個々のアプリの使ってもいい時間を指定できるようになりました

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

ウェブページ上のボタンの色と文字色／ボタンの色とその背景色に、十分なコントラストがあるかどうかを診断してくれるサービスです。URLを入力してスキャンボタンを押すと結果が表示されます。

ボタンの通常時／ホバー時／フォーカス時の全てを自動でチェックします。ボタンだけでなくリンク文字の色も対象です。結果は要素ごとに「AAA／AA／失敗」で評価されます。

WCAG （⁠アクセシビリティガイドライン）2.1に準拠しており、ガイドラインの内容もまとめてあります。チェックした結果もシンプルで見やすく、無料で使えるのもうれしい便利なサービスだと思います。

中国では、Alibabaのスマートスピーカーでスターバックスの配達を注文できるようになったそうです。また、スターバックスデザインのスマートスピーカーを3000台の数量限定で発売したところすぐに売り切れたとのこと。

中国でもスターバックスは人気なんですね。一方日本では、スターバックスでの決済に使えるボールペン「STARBUCKS TOUCH The Pen」が登場しました。FeliCaチップを内蔵して非接触決済に使える、ゼブラと協力して開発したボールペンです。

スターバックスは世界中にファンがいるので、スターバックスデザインのスマートスピーカーやSTARBUCKS TOUCH The Penを欲しがる海外の人も多そうですね。