Movatterモバイル変換


[0]ホーム

URL:


はてなブックマークアプリ

サクサク読めて、
アプリ限定の機能も多数!

アプリで開く

はてなブックマーク

  • はてなブックマーク
  • テクノロジー
  • 【フロントエンド初心者向け】ユーザビリティを上げるちょいテク
  • Twitterでシェア
  • Facebookでシェア

気に入った記事をブックマーク

  • 気に入った記事を保存できます
    保存した記事の一覧は、はてなブックマークで確認・編集ができます
  • 記事を読んだ感想やメモを書き残せます
  • 非公開でブックマークすることもできます
適切な情報に変更

エントリーの編集

loading...

エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。

タイトルガイドライン

このページのオーナーなので以下のアクションを実行できます

タイトル、本文などの情報を
再取得することができます
コメントを非表示にできますコメント表示の設定

ブックマークしました

ここにツイート内容が記載されますhttps://b.hatena.ne.jp/URLはspanで囲んでください

Twitterで共有

ONにすると、次回以降このダイアログを飛ばしてTwitterに遷移します

296usersがブックマークコメント23

    ガイドラインをご確認の上、良識あるコメントにご協力ください

    0/0
    入力したタグを追加

    現在プライベートモードです設定を変更する

    おすすめタグタグについて

      よく使うタグ

        【フロントエンド初心者向け】ユーザビリティを上げるちょいテク

        296 userszenn.dev/seya

        ガイドラインをご確認の上、良識あるコメントにご協力ください

        0/0
        入力したタグを追加

        現在プライベートモードです設定を変更する

        おすすめタグタグについて

          よく使うタグ

            はてなブックマーク

            はてなブックマークで
            関心をシェアしよう

            みんなの興味と感想が集まることで
            新しい発見や、深堀りがもっと楽しく

            ユーザー登録

            アカウントをお持ちの方はログインページ

            記事へのコメント23

            • 注目コメント
            • 新着コメント
            latena
            スクロールで出たり消えたりするヘッダー、本当にやめてください。ちょっと上を読みたいからスクロールしてるのに、ちょうど読みたい部分が隠されて、本当にイライラします。

              その他
              sabotem
              バリデーションルールを最初から表示して、通過したらOKカラーになるの良いな。

                その他
                localnavi
                良い。「エラーの表示はユーザが入力し終わってからにしよう」エラーではないが、はてブの【自分のブックマークページ】の検索窓もユーザーが入力し終わってから検索結果を出してほしい。

                その他
                akahigeg
                スケルトンローディングに関してはこれが必要なほど遅いのは負けな気がする

                その他
                tofu-kun
                “エラーの表示はユーザが入力し終わってからにしよう” これすごいわかる。実装者の気持ちもユーザの気持ちも。良い指摘。

                  その他
                  Keisuke69
                  Emptyの状態をしっかり作るってのなるほど!ってなった。まだまだこの分野は勉強が必要だ

                    その他
                    d4-1977
                    使ってて気持ちいいを提供する時に必要になるヤツ!納期があると省かれていく非機能要件をどうやって盛り込んでいくか?ってところが腕の見せどころ?と思ってきていて、ぐぬぬって数年なってる…

                    その他
                    piayo
                    条件出すのいいな。

                    その他
                    kasuke18
                    これは確かに便利。ユーザー登録時のパスワード欄でイラっと来ることが多い。セキリュティ的な懸念があるなら仕方ないが…“インプットの側に「どんな条件を満たしたらOKなのか」を記述するデザイン”

                      その他
                      mayumayu_nimolove
                      有名なサイトでよく見るテク

                        その他
                        Rishatang
                        スクロールで消えるヘッダ、そもそもヘッダを固定しない方向で努力してほしいってのはある

                          その他
                          otchy210
                          Cocoda 方式良いな。みんなこうなって欲しい。

                            その他
                            ftype
                            スクロールして消えるやつって本当にいいのかな?アプリだったらいいと思うんだけど出たり消えたりがうざく感じる場合もある

                              その他
                              akahigeg
                              akahigegスケルトンローディングに関してはこれが必要なほど遅いのは負けな気がする

                              2021/07/01リンク

                              その他
                              latena
                              latenaスクロールで出たり消えたりするヘッダー、本当にやめてください。ちょっと上を読みたいからスクロールしてるのに、ちょうど読みたい部分が隠されて、本当にイライラします。

                                2021/07/01リンク

                                その他
                                Keisuke69
                                Keisuke69Emptyの状態をしっかり作るってのなるほど!ってなった。まだまだこの分野は勉強が必要だ

                                  2021/07/01リンク

                                  その他
                                  hirose504
                                  “Partially Persistent Headers” を覚えた、マイクロインタラクションはやりたいけどアニメーションは自作するもんなの?ど

                                    その他
                                    Shinwiki
                                    イランイランの広告出てねえなぁ

                                      その他
                                      Nobkz
                                      内容に結構突っ込みたくなるけど、とりあえず、これを「ユーザビリティ」と呼ぶのやめろ!!!!!

                                        その他
                                        localnavi
                                        localnavi良い。「エラーの表示はユーザが入力し終わってからにしよう」エラーではないが、はてブの【自分のブックマークページ】の検索窓もユーザーが入力し終わってから検索結果を出してほしい。

                                        2021/07/01リンク

                                        その他
                                        knjname
                                        フォーム周りはサイト全体でどの辺までバーを上げるかっていうので悩む

                                          その他
                                          kagehiens
                                          いいですね、こういうの。

                                            その他
                                            yarumato
                                            “ローディング(クルクル)を出そう トースト(ニュッと出てサッと消えてくやつ)を出そう スケルトンローディング(灰色の文字塊)を表示させよう ユーザ入力中はエラー表示せず、条件を添える”

                                              その他
                                              sabotem
                                              sabotemバリデーションルールを最初から表示して、通過したらOKカラーになるの良いな。

                                                2021/07/01リンク

                                                その他
                                                clubman023
                                                いいね

                                                  その他
                                                  nebos
                                                  素敵

                                                  その他
                                                  tofu-kun
                                                  tofu-kun“エラーの表示はユーザが入力し終わってからにしよう” これすごいわかる。実装者の気持ちもユーザの気持ちも。良い指摘。

                                                    2021/07/01リンク

                                                    その他
                                                    arx0balest
                                                    「エラーの表示はユーザが入力し終わってからにしよう」の実装案がすばらしい。真似したい。

                                                    その他
                                                    take-it
                                                    名前と知らんかったのあるので助かる。

                                                    その他

                                                    注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています

                                                    リンクを埋め込む

                                                    以下のコードをコピーしてサイトに埋め込むことができます

                                                    プレビュー
                                                    アプリのスクリーンショット
                                                    いまの話題をアプリでチェック!
                                                    • バナー広告なし
                                                    • ミュート機能あり
                                                    • ダークモード搭載
                                                    アプリをダウンロード

                                                    関連記事

                                                      usersに達しました!

                                                      さんが1番目にブックマークした記事「【フロントエンド...」が注目されています。

                                                      気持ちをシェアしよう

                                                      ツイートする

                                                      【フロントエンド初心者向け】ユーザビリティを上げるちょいテク

                                                      フロントエンドの開発が初めての人が意外と抜けがちな観点をまとめてみました。 初めにざっくりと概要を...フロントエンドの開発が初めての人が意外と抜けがちな観点をまとめてみました。 初めにざっくりと概要を話すと「デザイナーが作るデザインでは表現しづらいもの」をまとめたものになります。 デザイナーが作るデザインは静的なものなので(たまにがっつりプロトタイプを作ったりもありますが)、いわゆる"状態"を表現するのが難しかったり抜けたりしがちです。 具体的に言うとローディング、Empty、エラーなどです。これらをよしなに補完できるフロントエンドエンジニアはデザイナーからもきっと「頼りになるぅ!」と思われること間違いないでしょう。 と言うわけでそんな例を紹介していきます。 今後も思いついたら追加する可能性が無きにしも非ず。 ローディングを出そう こう言うクルクルするやつとか こんな感じでシュインシュインするやつがあります。 基的にユーザがアクションを起こした時に待たせる場合は必ず表示させましょう。 ロ

                                                      ブックマークしたユーザー

                                                      • sh0g02023/05/16sh0g0
                                                      • techtech05212023/04/27techtech0521
                                                      • yamamotoshu11272022/11/16yamamotoshu1127
                                                      • sivipp2021/10/21sivipp
                                                      • hush_in2021/10/03hush_in
                                                      • shiromatakumi2021/08/01shiromatakumi
                                                      • heatman2021/08/01heatman
                                                      • mkt122021/07/08mkt12
                                                      • akira_maru2021/07/06akira_maru
                                                      • hitomi01052021/07/06hitomi0105
                                                      • d4-19772021/07/04d4-1977
                                                      • mimickn2021/07/04mimickn
                                                      • herakures2021/07/03herakures
                                                      • mieki2562021/07/03mieki256
                                                      • wushi2021/07/02wushi
                                                      • o_hiroyuki2021/07/02o_hiroyuki
                                                      • miiton2021/07/02miiton
                                                      • ver_Shiba2021/07/02ver_Shiba
                                                      すべてのユーザーの
                                                      詳細を表示します

                                                      ブックマークしたすべてのユーザー

                                                      同じサイトの新着

                                                      同じサイトの新着をもっと読む

                                                      いま人気の記事

                                                      いま人気の記事をもっと読む

                                                      いま人気の記事 - テクノロジー

                                                      いま人気の記事 - テクノロジーをもっと読む

                                                      新着記事 - テクノロジー

                                                      新着記事 - テクノロジーをもっと読む

                                                      同時期にブックマークされた記事

                                                      いま人気の記事 - 企業メディア

                                                      企業メディアをもっと読む

                                                      はてなブックマーク

                                                      公式Twitter

                                                      はてなのサービス

                                                      • App Storeからダウンロード
                                                      • Google Playで手に入れよう
                                                      Copyright © 2005-2025Hatena. All Rights Reserved.
                                                      設定を変更しましたx

                                                      [8]ページ先頭

                                                      ©2009-2025 Movatter.jp