「Web系の最新情報を知りたいけど、日々業務が忙しくて追いかけられない」という方のために、1ヶ月のWeb系ニュースの中で「これだけは押さえておきたい」というものを1つの記事にまとめています。
デザイン
AdobeのFigma買収とAdobe XDのこれから
9月の大きなニュースは、やはりAdobeによるFigma買収だと思います。このブログでも記事にしています。
関連: Adobe、Figmaを約2.9兆円で買収へ デザインコラボツール大手
フォトショップの作業が楽になる、覚えておきたい小技テクニック18選
とても有益ですが、レイヤーの複製はoption+ドラッグではなくcommand+Jの方が速いと思います。
ちょうどいいWebデザインギャラリー
そのWebサイトのいいところが言語化されているギャラリーサイトです。
Screen Sizes
iPhone・iPadなどのスクリーンサイズまとめサイトです。
- のんびり学ぶ Figma 〜コンポーネント編〜 (1) | さくらのナレッジ
- デザイナーやエンジニアの作業効率が向上するFigmaの運用方法を考える|osanai / ui designer|note
- 2022年上半期、注目されたUIデザインのテクニックのまとめ
- 「Canva」にノーコードでサイト作成可能な「Canva Webサイト」など6つの新機能搭載 | Web担当者Forum
- こんなやり方が!フォトショップ時短テクニックや役立つヒント・裏技15個まとめ
- カラー変更やグラデーションなどのカスタマイズが自由になった「カラーフォント」がGoogle Fontsに追加
コーディング
自然に見える画像の枠線を求めて – Qiita
画像の枠線を自然に見せたい問題が、これで解決したかもしれません。
- Safari 16で追加されたWebKit機能まとめ
- CSSの疑似クラスと疑似要素、:と::の違い
- CSSの:has()疑似クラスの便利な使い方のまとめ
- 有名サイトで使用されているCSSテクニックまとめ – Qiita
- detailsとsummaryタグで作るアコーディオンUI – アニメーションのより良い実装方法 – ICS MEDIA
- 新しいCSSの書き方 最新テクニック20選まとめ実用サンプルコード付き
- 【WordPress】Sass の @import が非推奨になるから、「おじいちゃん平成くさーいwww」とキッズから馬鹿にされる前に遅ればせながら滑り込みで @use に書き換えてみたよ【editor-style.css】
- モーダル要素の実装に便利なCSSの新機能「:modal疑似クラス」、主要ブラウザのすべてにサポートされました
プログラミング
ブラウザで:has()セレクタが実装されてjQueryの:has()セレクタの挙動が変わったの調べた – hogashi.*
Webブラウザーに :has() セレクターが実装されたことで、jQueryで :has() を使用しているWebページで挙動が変わってしまい、正常に表示できないケースもあるようです。ご注意ください。
- 定番のコード規約とライブラリから学ぶJavaScriptの命名テクニック(初級編) – ICS MEDIA
- JavaScriptのメモリリークを検出するフレームワーク「MemLab」、メタがオープンソースで公開
- JSONデータをキレイに可視化してくれるオンラインツール「JSON Crack」は手軽でお勧め/画像化してクリップボード・ローカルファイルへエクスポートすることも【やじうまの杜】
- 【分野別】VSCodeのおすすめ拡張機能まとめ – Qiita
- ウェブ制作で React(Next) や Vue(Nuxt)、jQuery が最近どれぐらい使われているのか調べてみた – feb19
- JamstackなWeb制作者になるためのロードマップ
SEO
Google、国ごとに検索最適化 アジア主要国に専任組織
「(他国と比べて)日本での検索ワードは簡潔なことが多い」と指摘。そのため探している情報にたどり着きにくい傾向がある
とのことです。
セキュリティ
- GTA新作リークに使われた“多要素認証疲れ”攻撃とは 1時間以上通知攻め、従業員の根負け狙う
- Security | WordPress.org 日本語
- 【速報】「Windows 11 2022 Update」の一般提供が開始 ~初の大型アップデート/デスクトップ環境、アクセシビリティ、セキュリティなどに新機能が満載
その他
Webページの特定テキストへ直接ジャンプしてハイライトするリンクの作り方/「Chrome」「Edge」は標準機能で、「Firefox」は「Link to Text Fragment」拡張機能で【レビュー】
Chromeは右クリックして[選択箇所へのリンクをコピー]でリンク作れるのですね。
iOSアプリではアプリ内課金の平均価格が1年間で40%も上昇していることが判明、一体なぜ?
Appleのプライバシー保護施策の結果、新規ユーザーの獲得コストが増加し、iOSのみアプリ内課金の平均価格が1年間で40%も上昇。プライバシー保護はユーザーにとってメリットだけではなかったようです。