週刊Webテク通信

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

この記事を読むのに必要な時間:およそ 2 分

ネットで見かけた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 ノート,ホワイトボードなどをひとつにしたツール

今週の気になるWebネタ

音声SNS「Clubhouse」が脱ベータ,招待・承認が不要な正式サービスに | マイナビニュースhttps://news.mynavi.jp/article/20210722-1928130/

Clubhouseがベータサービスから正式サービスに移行しました。招待や承認がなくても誰でも利用できるようになります。正式のロゴが作られ,Webサイトもリニューアルしました。

これまでは,ロゴのかわりに絵文字が使われているのが割り切っていて面白いと思っていました。Webサイトも以前は絵文字以外に画像が使われていないシンプルなものでしたが,ちゃんとビジュアル要素の入った作り込んだものになっています。

一過性のブームだったと思われているClubhouseですが,競合のTwitterスペースがそれなりに人気ですし,まだまだこれからだと思います。配信する側にとっては誰でも利用できるプラットフォームの方が良いので,Android版も出て招待制がなくなったことの影響は大きいはずです。

著者プロフィール

アシカガコウジ

フリーのWebデザイナー&ライター。ポッドキャスト「アシカガCAST」でデジタル活用のヒントを発信中。シャープMZ-80Bからのパソコンユーザーで,Macintosh IIciからのMacユーザーでApple好き。Webテク情報やツール(ソフトウェア)の案内,デジタル活用情報をまとめた「アシカガノオト」をNotionで公開しています。

http://bit.ly/ashikaganote