タグ

uxとFrontEndに関するcyber_snufkinのブックマーク (3)

  • 応答性を示す新しい指標「INP」 | フロントエンドBlog | ミツエーリンクス

    ユーザーの直帰率や離脱率とパフォーマンスの関係から、コンテンツを表示する速度や応答性(ページがユーザー入力に応答する速度)がいかに重要であるかは、既によく知られるようになってきています。 ではコンテンツを表示する速度や応答性を上げるにはどうしたらいいでしょう。 結論から述べるとパフォーマンスを客観的な指標に基づいて正確かつ定量的に測定し、そこから課題を見つけて解決することが必要になります。 GoogleChrome User Experience Reportに新しく応答性指標INPを導入しました。 INPとは INP(Interaction to Next Paint)は、ページの読み込みを開始してからユーザーがページを離れるまでの間に発生するユーザー入力の応答性(インタラクション)を評価する測定基準で、遅延時間を計測します。 計測対象のインタラクションは、以下となります。 ユーザー入

    応答性を示す新しい指標「INP」 | フロントエンドBlog | ミツエーリンクス
  • これだけは押さえよう!住所フォームの作り方 - ケンオールブログ

    まとめ 住所フォームの作り方 住所フォームを作るときには以下の4つを押さえましょう。 オートコンプリート機能に最適化する 郵便番号フィールドは1フィールドにしてハイフン有無どちらも対応する モバイルUX優先なら郵便番号が入力されたら即座に補完。精度優先なら郵便番号補完ボタンを設置 住所フィールドは「都道府県」「市区町村」「町名以下」の3フィールドが基。「建物」フィールドはオプション 文 地域SNSのユーザー登録、ECサイトの配送先入力、資料請求、自治体サイトでの電子申請など、ウェブサービスを活用する上で住所入力は欠かすことができません。 住所入力をシンプルかつ正確に行えるような入力インタフェース(住所フォーム)は、離脱率を減らし、コンバージョン率を向上させる上で重要です。 郵便番号を入力すると対応する住所を自動入力する機能(郵便番号による住所補完)は、住所フォームの改善方法として最も効

    これだけは押さえよう!住所フォームの作り方 - ケンオールブログ
  • Web UX 指標を3つに再整理、定量化した Web Vitals とそのツールの紹介 - Qiita

    技術もユーザーの期待値も日進月歩する Web において最高のエクスペリエンスを提供するためのガイダンスを提供するサイト web.dev にて web vitals が 2020/5 に開設されました。稿はその紹介になります。 [2020/5/12追記] Google から日語要約Web Vitals の概要: サイトの健全性を示す重要指標が公開されましたので、こちらも合わせてご覧ください。 TL;DR web vitals とは複雑化した Web サイトの UX 指標を3つに再整理し、定量化したものとその測定ツール (JS ライブラリと chrome extension)のこと web-vitals-extension をインストールしてみては(まだ alpha ですが...) web-vitals(npm) のドキュメントをチェックしてみては (同上) Web Vitals とは O

    Web UX 指標を3つに再整理、定量化した Web Vitals とそのツールの紹介 - Qiita
  • 1