2016年8月第3週号 1位は、レスポンシブWebデザインのテストで気をつけること、気になるネタは、パンに絵が焼けるスマホ連携トースター「Toasteroid」--焦げ目で天気予報も

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

レスポンシブWebデザインのテストをするときに、気をつけるべきことをまとめています。

テストの際にやりがちな間違いとして以下の3つの項目が紹介されていました。

ユーザーが実際に閲覧する環境でテストするため、回線状況や位置情報、広告ブロックなどにも気を配る必要があるとのことでした。

スモールビジネスのWebサイトでの、UXデザインのトレンドについてまとめた記事です。

アプリやWebサービスなどのプロダクト紹介サイトに限定した、Webデザインのギャラリーサイトです。

以下の5項目に分類して紹介しています。

背景画像をマウスオーバーで拡大する効果を、CSSだけで実装する方法をレクチャーしています。

実際に動かして確認できるデモが、コード共有サイトのCodePenで共有されています。マウスオーバーが効かないモバイルデバイス向けの対策も紹介されていました。

グラデーションをうまく使ったWebデザインを紹介した記事です。

Web2.0の時代のような派手なものではなく、最近ではごくわずかなグラデーションが一般的で、フラットな要素、美しいベクターイラストと一緒に使われたり、写真の上に重ねて使われるとのことでした。

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

GoogleがChrome 53でFlash排除拡大、バックグラウンド動作無効化へ。Adobeとも協力 - Engadget Japanese
Flashしかサポートしない動画サイトでのみFlashをデフォルト動作させるようになるとのことです
ライブ動画「LINE LIVE」がついに一般開放--“⁠顔スタンプ⁠”やギフトで交流 - CNET Japan
アプリから、1回あたり最大30分のライブ動画を配信できます
ASCII.jp：Google検索から、レストラン予約する機能を導入
Android／iOSのGoogle検索アプリからの検索時に「席を予約する」という項目が表示されるそうです

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

EZ Mapは、Googleマップをサイトに埋め込むためのコードを生成するサービスです。マーカーの追加や、地図のデザインのカスタマイズが簡単です。

あらかじめ用意された100種類以上のテーマから、地図のデザインを変えることができるのも面白いです。コントローラー類の表示／非表示も簡単にコントロールできます。

マーカーは豊富に用意されたアイコンから選べます。マーカーを押した後のフキダシに表示する文字を設定でき、リンクも入れられます。ログインしなくても使えますが、ログインするとマップを保存したり、自分で用意した画像をマーカーに使えるようになります。

焦げ目でパンに自由に絵を描けるトースターが、クラウドファンディングサービス「Kickstarter」で支援募集中です。キティちゃんなどキャラクターの焦げ目をつけられるトースターはありましたが、スマホアプリを利用して自由な絵をかけるところが画期的です。

こういった、スマホアプリと連動させることで実現した機器類が最近増えています。トースター自体にお絵かき機能を持たせるのは現実的ではありませんよね。今後もユーザーインターフェイス部分をスマホアプリに頼った機器がどんどん出てくることでしょう。

トースターは朝使うものなので、その日の天気予報がパンに焼き付けられたら便利だろうという発想も面白いです。毎朝、家族それぞれのその日の運勢の占いが焼き付けられたパンが食卓に並んだら、朝食タイムが盛り上がりそうですね。