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

1. Everything I Learned About min(), max(), clamp() In CSShttps://ishadeed.com/article/css-min-max-clamp/

CSS関数のmin，max，clampを詳しく解説した記事です。2020年4月8日にFirefoxでサポートされたので，すべての主要なブラウザで使えるようになったそうです。

これらのCSS関数を使うことで，ビューポートを使わずにレスポンシブにサイズを変更できます。ブレイクポイントごとに数値を変更するのとは違い無段階に可変するため，より柔軟なレスポンシブデザインが可能になります。

起こりうる問題や実用的な例，非対応のブラウザを考慮した記述方法を紹介しています。

2. 7 best practices for using photography in UI design | Dribbble Design Bloghttps://dribbble.com/stories/2020/05/05/7-best-practices-photography-ui-design

UIデザインに写真を使うときのヒントを7つまとめています。

1. 高品質な写真にこだわる
2. ストック写真っぽくない写真を使う
3. テキストを載せたとき十分なコントラストを保つ
4. 関連性のある画像だけを使う
5. 高い解像度の写真を使う
6. 同じモチーフのものを繰り返し使う
7. Less is more（少ない方が豊かである）

3. The Pragmatic Designer: Local and Self Hosted Design Tools by Stéphanie Walter - UX designer & Mobile Expert.https://stephaniewalter.design/blog/the-pragmatic-designer-local-and-self-hosted-tools-for-banking-insurance-and-other-institutions/

オンラインのデザインツールと，その代替となるローカルで動くデザインツールを紹介した長い記事です。

チームの共同作業との親和性の高いオンラインのデザインツールが増えてきたものの，セキュリティ上の理由でオンラインツールを使えない企業もあります。

そこで，各種オンラインデザインツールの代替となるローカル，セルフホスティング，オープンソースのものを紹介するとともに，マイクロソフトオフィスなど企業で一般的に使われているツールで代用するコツやテクニックを解説しています。

4. 3 Tips to Master a Minimalist Web Designhttps://www.searchenginejournal.com/minimalist-web-design/361934/

ミニマリストのウェブデザインをマスターするためのヒントをまとめた記事です。

以下の3つの項目に分けて解説しています。

1. 視覚要素
2. 色とコントラスト
3. 空白

5. 20 Amazing Examples of Neumorphism - New Design Trends 2020 - Web Design Ledgerhttps://webdesignledger.com/30-examples-of-neumorphism-design/

ニューモーフィズムの作品例を多数まとめています。リッチで新しい感じのするデザインばかりです。

この記事ではニューモーフィズムについて，「⁠スキューモーフィズム，フラットデザイン，リアリズムを組み合わせた新しいモダンなグラフィックデザイン手法」と解説していました。

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

• Skypeのビデオ通話で背景を変更する方法 | ライフハッカー［日本版］
  従来の背景ぼかしに加え，バーチャル背景も使えるようになりました
• Google、混沌のコミュニケーション系アプリ担当を1チームに統合 - ITmedia NEWS
  ハングアウトやDuoがMeetに統合されることはないそうです
• Googleのビデオチャット「Duo」に「ファミリーモード」やWebでのグループ通話機能を追加 - ITmedia NEWS
  Google Meet同様にリンクを送ってビデオチャットをスタートできるようになります

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

everysize - Check your responsive webpage looks great in every size 🖥 💻 📱 👀https://everysize.kibalabs.com/

everysizeはウェブページの複数画面サイズでの表示チェックをするサービスです。ブラウザ上でレスポンシブデザインの確認作業ができます。

ウインドウサイズは，あらかじめ用意されているiPhone，iPadなどのデバイス名から選ぶか数値で指定します。表示倍率も5段階に変更可能です。複数のウィンドウを画面上に自由に配置できます。

ちなみに，同様のことができるアプリケーションとして，Sizzy（Mac，Windows，Linux⁠）⁠，Solis（Mac）があり，わたしはSolisを使っています。Sizzyは月5ドルからのサブスクリプションで，プランがいくつかあります。Solisは29.99ドルの買い切りです。