2014年5月第4週号 1位は、ブラウザ上でのWebデザインに必須のツール、気になるネタは、大画面スマホでも端まで指が届く親指形スタイラス

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

ブラウザ上でのWebデザイン（design in browser）に必須のツールをまとめた記事です。

Photoshopなどでのレイアウト作業を行わずに、いきなりブラウザ上で動くプロトタイプを作成していく、いわゆる「design in browser」に役立つツールを6つ紹介しています。

ポートフォリオサイトに役立つツールを多数紹介しています。

作品の写真を見せるためのギャラリー系ツールがほとんどです。

ギャラリー系ツールとしては、「⁠25+ Best Responsive jQuery Slider Carousel Plugins」というスライダー／カルーセルのjQueryプラグインをまとめた記事もありました。

黒色ベースのWebデザインを行うためのテクニックと、参考例となるギャラリーをまとめています。

黒色や濃いグレーを背景にした場合、文字が読みにくくなる可能性が高まりますが、ページ上で最も重要な情報に注目を集めやすいという良さもあるとのことです。

そのためには、ホワイトスペースを十分に使い、文字を大きく読みやすくすることが大事だと説明してありました。

コード共有サイトから、CSSによるドロップダウンメニューを多数紹介しています。CSSのみではなく、多くのケースではJavaScriptも使われているようです。

Codepen、CSSDeckに投稿されているものからまとめられています。

1つの文字の半分ずつに別の色を付けるCSSテクニックが紹介されています。そういうことができないかという問いに対し、多くの人がいろいろなコーディング例を投稿しています。

このStack Overflowというサイトは、プログラマー向けのQ＆Aサイトなんですね。

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

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

今回は、「⁠文章校正など、ブログ記事作成に役立つ無料ツール9選」という記事を紹介します。

といった文章の校正に役立つツールをはじめ、以下のようなWeb関連やSEOに役立つものも掲載されていました。

大画面スマホのために、指サック型のスタイラスが登場しました。その名も「親指形スタイラス指のび～る」です。発想はいいと思うのですが、指の形をしているためジョークグッズに思えてしまいます。

iPhoneも大画面モデルが出るという噂があるので、この親指スタイラスのニーズは高まるかもしれません。アップルが何かしら大画面での片手操作対策をしてくれることも期待したいです。アップルがデザインした「指のび～る」も見てみたいですね。

Webサイトを作る側として考えると、モバイルページの操作系の要素は、なるべく下に持って来た方がいいのでしょう。左上にロゴがあってホームに戻るというのは定番ですが、スマホ片手持ちでは一番指が届きにくいのが左上なので、その常識も考え直す必要があるのかもしれません。