2018年5月第5週号 1位は、CSSでの各種レイアウト手法を初歩から分かりやすく解説、気になるネタは、CSSEdit、Espressoの開発元MacRabbitが終了を発表

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

CSSレイアウトの入門記事です。flexbox、CSS Gridといった最新の手法を押さえつつ、CSSでレイアウトする各種方法を初歩から分かりやすく解説しています。

float、 positionプロパティによる配置、flexレイアウト、gridレイアウト、とコーディング例を挙げながら簡単に説明し、より詳しく学びたい人のための関連情報へのリンクもあります。

アイコンフォントとそのアイコンフォントを活用するためのCSSツールキットをセットで提供しています。商用でも無料で利用できます。

アイコンはくせのないシンプルなもので、矢印などの記号類やオンラインツールのインターフェイスに使われるものなど、一般的なものはだいたい揃っているようです。企業やサービスのロゴなどブランドアイコンが充実しています。

FontAwesomeのようなものですが、FontAwesomeが実質有料になった今、無料で使えるところに魅力を感じる人も多いでしょう。

明るいはっきりした色を背景に使ってはいけない理由を解説した記事です。背景色には暗く、彩度が低い色を使った方が良い理由は、やはり見やすさということでした。

色見本を使って最適な背景色を見つける方法も解説しており、背景色の良い例＆悪い例も掲載しています。

ウェブページやモバイルアプリのユーザーの導線を図にしたフロー図（や流れ図などと呼ばれる図）を作るのに特化したツール「Overflow」の使い方を紹介しています。

Overflowは最近パブリックベータになったとのことで、もちろんダウンロード先へのリンクも掲載しています。Overflowのページにある動画を見ると、どういうツールか分かりやすいと思います。

UXライティングで良いプロダクトを作る方法を実例を交えて紹介した記事です。UXデザイナーという肩書きは日本でも見かけるようになってきましたが、海外ではUXライターという肩書きも生まれているようです。

コピーライターとUXライターの違いや、UXライターのやることも紹介しています。ボタン内のテキストやエラーメッセージなどの「マイクロコピー」を書くのがUXライターの仕事ということですね。

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

Googleマイビジネスの投稿タイプに「商品」が追加。検索結果からの販売が可能に | 海外SEO情報ブログ
商品情報（写真、名前、値段、説明）を投稿でき、購入や予約、オンライン注文ができるのではないかと予想しています
Alexaが夫婦の会話を勝手に録音して部下に転送非常に珍しいが対処するとAmazon - ITmedia NEWS
会話の中に「メッセージを送信」「⁠ユーザーの連絡先リストにある人の名前」と受け取れる音声があったためとのこと
Instagramがミュート機能を導入。相手に知られず投稿を非表示に - Engadget 日本版
投稿だけか、投稿およびストーリーをミュートにするかを選択できるそうです

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

Instagramのストーリーズ用の画像や動画をデザインするための、ウェブサービスやモバイルアプリを紹介した記事です。テンプレートを元にデザイナーでなくても作れるツールをまとめています。

オンラインデザインツールのEasilは、Instagramストーリーズのためのテンプレートが豊富です。同様のツールとしてCanvaもありますが、Canvaにはストーリーズ用のテンプレートが今のところありません。

Adobe Sparkはアプリだけでなくウェブサービス版もあります。円状のインターフェイス上で丸をグルグル回すとデザインを提案してくれる機能が面白いですね。Creative Cloudのすべてのプランでプレミアム版が使えるので、Adobe CCユーザーには特におすすめです。

CSSEdit、Slicy、EspressoといったMac版ウェブデザイナー用ツールを提供していたMacRabbitが終了すると同社サイトで発表しました。Espresso、CSSEditはWarewolfという会社が引き継ぎ、Espressoの開発は続けられるようです。

CSSEditが大好きで、いまだにたまに使っているわたしとしては、とても残念です。Macのソフトらしい、使っていて気持ちの良いツールを提供するところでした。PhotoshopのPSDファイルからウェブ用に画像をスライスして書き出すSlicyも、一時期ファンが多かったと記憶しています。

Espressoは、メインのコーディングツールとしてではないですが、現在使用しています。開発会社が変わるということで不安ではありますが、次のバージョンのリリースを期待して待ちたいです。