週刊Webテク通信

2021年7月第5週号1位は、Webデザイナーはそろそろスライダーを辞めるべきという提案、気になるネタは、音声SNS「Clubhouse」脱ベータ、招待・承認が不要な正式サービスに

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

1. Is It Time for Web Designers to Retire the Slider?https://speckyboy.com/web-designers-retire-slider/

Webデザイナーはそろそろスライダーを辞めるべきという提案です。人気がありつつ賛否両論なスライダーですが、この記事の筆者は最近は可能な限り使用を避けているとのことでした。

スライダーの代替手段として、以下の4つを紹介しています。

  • ヒーローエリア
  • カードレイアウト
  • 複雑なCSSグリッド
  • 動画

CSSの技術の進歩により、視覚的に魅力的で作成と管理が簡単なレイアウトができるようになったことも、スライダーが不要になってきた理由のようです。

図1 Webデザイナーはそろそろスライダーを辞めるべきという提案
図1 Webデザイナーはそろそろスライダーを辞めるべきという提案

2. The complete guide to making a responsive website | Dribbble Design Bloghttps://dribbble.com/stories/2021/07/20/editorx-responsive-website

レスポンシブなWebサイトを作るためのガイドです。

  1. ワイヤーフレームから始める
  2. ブレイクポイントを決める
  3. 最初に小さなスクリーン用のデザインをする
  4. 流動的なグリッドを作る
  5. 画像をレスポンシブデザインに最適化する
  6. 文字をレスポンシブデザインに最適化する
図2 レスポンシブなWebサイトを作るための完全ガイド
図2 レスポンシブなWebサイトを作るための完全ガイド

3. Full-Screen Video Backgrounds in Web Design: Pros, Cons & Tips | Design Shackhttps://designshack.net/articles/trends/full-screen-backgrounds/

フルスクリーンの背景動画を使うためのヒントと良い点、悪い点を解説した記事です。

  • 適切な動画を使う
  • 常に動画は短く
  • 気を散らす動画は避ける
  • ボタンなどの要素は強調する
  • 音声は入れない
  • 読み込み速度を最適化する
図3 フルスクリーンの背景動画を使うためのヒント
図3 フルスクリーンの背景動画を使うためのヒント

4. Ultimate footerhttps://footer.mdbgo.io/

無料で使えるフッターテンプレート集です。Bootstrapをベースとしたレスポンシブなフッターのコードを入手できます。

ページの最後には、完璧なフッターを設計するためのヒントも掲載しています。

図4 無料で使えるフッターテンプレート集
図4 無料で使えるフッターテンプレート集

5. Mastering the Basics of Icon Design with Adrien Coquet | by Jeremy Elliott | Jul, 2021 | Noun Projecthttps://blog.thenounproject.com/mastering-the-basics-of-icon-design-with-adrien-coquet-9c3802093e30

アイコンデザインの基本について、フランスのグラフィックデザイナーから学ぶ記事です。Illustratorを使ってのテクニカルなノウハウと、アイコンデザインの考え方の両方を勉強できます。

東京オリンピックで話題となったピクトグラムを作るためのヒントにもなりそうです。

図5 アイコンデザインの基本を学ぶ
図5 アイコンデザインの基本を学ぶ

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

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

Clover – The creative workspace with notes, whitboarding, todos, and a daily plannerhttps://cloverapp.com/

Cloverはノート、ホワイトボード、ToDoリスト、デイリープランナーをひとつにしたようなツールです。MiroのようでありNotionのようにも使えて、いろんなツールと競合しそうだと思いました。

無限キャンバス上でToDo、メモや画像を好きに配置でき、図形やフリーハンドでの描き込みも可能です。Figmaなどの埋め込みにも対応しています。パソコンだけでなくiPhone/iPadでも使えます。

個人で日々のアイデアノートに使えそうですし、グループで共有してリモートワークの打合せノートに使うのにも良さそうです。機能やゲスト数の制限はありますが、無料プランも用意しています。

図6 ノート、ホワイトボードなどをひとつにしたツール
図6 ノート、ホワイトボードなどをひとつにしたツール

おすすめ記事

記事・ニュース一覧