2016年6月第3週号 1位は、サイトをプロっぽく魅力的にする21の方法、気になるネタは、Siriを人前で使うのはわずか3％──米調査結果

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

サイトをプロっぽく魅力的にする方法をまとめた記事です。プロではない人でもプロっぽくという内容ですが、プロにも参考になると思います。

初心者のためのプロトタイピングの総合ガイドです。

といった項目に分けて解説しています。

JavaScriptとCSSのライブラリを多数紹介しています。

軽量でシンプルに使えるCSSフレームワークのPicnicや、絵文字やGoogleマップ、YouTubeビデオやTwitterなどを簡単にページに埋め込めるEmbed.jsなどが紹介されていました。

スクロールに合わせていろいろなアニメーション効果を与えられる「AOS」というライブラリを取り上げています。

WOW.jsと同じようなライブラリですが、細かいコントロールがしやすく、JavaScriptではなくCSSだけでアニメーションをコントロールできるところも特徴です。

CSSのFlexboxを使った実用的なサンプルを紹介した記事です。

レスポンシブに対応した、ナビゲーションバー、画像サムネイル、フォームと、固定フッタのコーディング例と解説が掲載されています。

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

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

WAIT! Animateは、ループするCSSアニメーションにおいて、一時停止させる設定を行えるサービスです。指定した秒数停止した後また動き出すというループアニメーションを簡単に作れます。

アニメーションの全体の長さと移動するタイミングとを調整することで、CSSだけで動きにインターバルを持たせています。Font Awesome Animationライブラリを元にしていて、豊富なアニメーションから動きを選べます。

動き自体をカスタマイズすることもできたり、SASSのミックスインも用意してあったりと、シンプルながら気の利いたサービスです。

アメリカのスマートフォンユーザーを調査したところ、iPhoneユーザーの98％はSiriに呼び掛けたことがあり、人前で使ったことがあるのは3％だったそうです。調査はAndroidユーザーも含めてのもので、「⁠OK Google」の方は使ったことがあるのが94％、人前では12％とのことでした。

日本では音声での操作を使う人は少ない印象があります。街中でスマホに音声で命令している人も見たことありませんね。機能がそれほど認知されていないという理由もありそうです。お年寄りや子どもが使いこなす上でも、音声での操作は将来性があるはずだとも思います。

子どもは家でも外でも平気でSiriに話しかけているので、小さい頃から音声操作に慣れた世代が増えてくると、人前で使うのも当たり前になってくるのでしょう。とはいえ、日本ではスマホを使うシチュエーションといえば電車の中が多いので、マナーの点からも音声操作は普及しないかもしれませんね。