週刊Webテク通信
2020年11月第1週号 1位は,CSSによって要素を隠す方法の比較,気になるネタは,Appleが簡単動画作成アプリClips 3.0発表,縦位置ビデオサポートでTikTok世代を狙う
ネットで見かけたWebテク
1. Comparing Various Ways to Hide Things in CSS | CSS-Trickshttps:// css-tricks. com/ comparing-various-ways-to-hide-things-in-css/
CSSによって要素を隠すいろいろな方法とそれらの比較です。
以下の4つの項目を踏まえて比較しています。
- アクセシビリティ:非表示の要素はスクリーンリーダーで読み取られるか
- ドキュメントフロー:非表示の要素はレイアウトに影響を与えるか
- レンダリング:非表示の要素のボックスモデルはレンダリングされるか
- イベントトリガー:非表示の要素はクリックやフォーカスを検出するか
方法としては以下の5種類と,
- displayプロパティを使った方法
- visibilityプロパティを使った方法
- opacityプロパティを使った方法
- positionプロパティを使った方法
- visually hiddenクラスを使った方法
2. Practical Guide to Color Theory for UI designershttps:// designerup. co/ blog/ practical-guide-to-perfect-ui-color-palettes/
色のセオリーとUIデザインに用いるカラーパレットに関する実用的なガイドです。
6つの主要なカラーカテゴリを紹介しています。UIに使う色は,
- ジュエルトーン
- パステル
- アースカラー
- ニュートラル
- 蛍光灯/
ネオン - シェード
3. Website Footer Best Practices & Examples to Learn From in 2020 - Noupe Online Magazinehttps:// www. noupe. com/ design/ website-footer. html
ウェブサイトにおける良いフッターデザインの作り方と,
- フッターに必要なもの
- 利用規約
- プライバシーポリシー
- コピーライト表記
- フッターにあると良いもの
- お問い合わせ
- サイトマップ
- わたしたちについて
- ソーシャルメディアへのリンク
4. Free Mockups, Templates & Icons for Your Next Design Project | Dribbble Design Bloghttps:// dribbble. com/ stories/ 2020/ 10/ 29/ free-design-mockups-templates-icons
無料で配布されているモックアップ,
ビジュアルでどういうものかわかるものばかりなので,
5. Minimal CSS Frameworks — dailydevlinkshttps:// dailydevlinks. com/ minimal-css-frameworks/
ミニマルなCSSフレームワークを9つ紹介しています。
最近流行の,
そのほか,
- IEで互換性のないWebサイトにアクセスした場合,
Edgeにリダイレクト | マイナビニュース
これまでは切り替えを促すメッセージを出していたのが,自動でリダイレクトするように変更されたそうです - YouTubeアプリ,
上にスワイプで全画面など, 複数のUI改善 - ITmedia NEWS
TikTokなど別のアプリの影響も受けつつUIが変わったようです - Zoomが待望の無料ミーティングのためのエンドツーエンド暗号化を開始するが機能制限多数 | TechCrunch Japan
エンドツーエンドの暗号化を利用する場合は,クラウド録音など使えない機能があり, ブラウザ版では参加できないとのことです
先週の気になるWebサービス
PatternPad - Editorhttps:// patternpad. com/ editor. html
CSS Background Patterns by MagicPatternhttps:// www. magicpattern. design/ tools/ css-backgrounds
今回はパターンを作成するサービスを2つ紹介します。PatternPadはSVG形式を含む画像ファイル,
PatternPadは丸や四角,
CSS Background Patternsは,
今週の気になるWebネタ
Appleが簡単動画作成アプリClips 3. 0発表, 縦位置ビデオサポートでTikTok世代を狙う | TechCrunch Japanhttps:// jp. techcrunch. com/ 2020/ 10/ 29/ 2020-10-28-apple-eyes-the-tiktok-generation-with-an-updated-version-of-clips/
Appleのカジュアルな動画作成アプリClipsの新バージョンでは,
縦型ビデオのサポートがClipsに対する要望で最も多かったとAppleも発表していたとのことです。iMovieへの縦長動画対応への要望もきっとAppleに届いているはずですよね。
iPhoneで縦長動画で動画を撮るケースは多いと思うのですが,
バックナンバー
週刊Webテク通信
- 2020年11月第4週号 1位は,デザインの一貫性についてのまとめ,気になるネタは,OPPO,巻取りスマホのコンセプトモデル「OPPO X 2021」を公開
- 2020年11月第3週号 1位は,エンゲージメントを高めるお問い合わせページをデザインする方法,気になるネタは,「Googleフォト」,無制限の無料ストレージを2021年5月末で終了へ
- 2020年11月第2週号 1位は,Google新アイコンの区別の付きにくさを改善する試み,気になるネタは,自撮り画像を他人が撮ったように変換する技術「Unselfie」 Adobeなど開発
- 2020年11月第1週号 1位は,CSSによって要素を隠す方法の比較,気になるネタは,Appleが簡単動画作成アプリClips 3.0発表,縦位置ビデオサポートでTikTok世代を狙う
関連記事
- 2020年8月第2週号 1位は,Webページの16種類の基本タイプ,気になるネタは,Google,同時通訳もする無線イヤフォン「Pixel Buds」を日本で8月20日発売
- 2020年5月第5週号 1位は,ウィンドウサイズが中途半端なときの「中間の」デザインが崩れる問題と対策,気になるネタは,ZOZO,Web会議向け“着るグリーンバック”Tシャツ発売 デジタルファッションを提案するページ開設で
- 2020年5月第4週号 1位は,古いCSSの問題に対する現代的なCSS解決策まとめ,気になるネタは,Housepartyは一緒にイベントを楽しむサービスでビデオチャットを超える
- 2020年5月第3週号 1位は,より柔軟なレスポンシブデザインが可能になるCSS関数のmin、max、clampを詳しく解説,気になるネタは,ビデオ会議などの自己紹介に役立つ「バーチャル名刺背景ジェネレーター」
- 2020年5月第2週号 1位は,成功するワイヤーフレームの作り方,気になるネタは,ビデオ会議ツール「Google Meet」が個人でも無料で利用可能に/Facebookがビデオ会議機能「Messengerルーム」発表