タグ

2019年10月17日のブックマーク (2件)

  • 新規登録 UI まとめてみた|あき

    シンプルだけど難しい「新規登録」のデザイン。 派手さはないけど、地道な工夫の繰り返し。 新規登録まわりで離脱の少ないデザインを勉強したかったので、いくつかアプリをスクショしました。自分用で作成しましたが、誰かの参考になればと思います。 また、まとめ内のコメントは個人的感想です。まだまだ勉強中なので、お気軽にご意見いただけるとうれしいです〜。 パターン一覧 1. 登録必須型 2. 登録先行型 3. 利用先行型 4. メリット先行型 目的別の参考事例 1. 不要な遷移を削る 2. 不要な操作を削る 3. わかりやすく伝える 4. 魅力的に伝える おわりに ・最適な新規登録のタイミング ・注意すべきデザインの視点 ・スクショの保管場所1. 登録必須型ユーザー登録なしではアプリが利用できないパターン。 傾向 母数としては一番多い形式。プロフィールが大切なフィットネス系では、利用前にかなりの入力を求

    新規登録 UI まとめてみた|あき
  • CSSで見出し固定+レスポンシブ対応の表を作成

    2022年4月27日 CSS, HTML, Webサイト制作 料金表やサービスプランの比較、タイムテーブルなどなど、使う場面が多い割には制限も多く、初心者には少しとっつきにくいと思われがちな表。今回はあると便利な表の見出し固定やレスポンシブ対応の方法を紹介します。 ↑私が10年以上利用している会計ソフト! 見出しの行を固定する 表の中の行が増えてくると、スクロールした時に表の見出しが画面から見えなくなり、なんの値だったのかがわかりづらくなります。そんな時のために、行数の多い表では一番上にくる見出しの行を固定しておくといいですね。 まずはベーシックな表を作成します。table タグに border-collapse: collapse; を指定することで、セル間のスペースがなくなってフラットな見た目になりますよ。 HTML <table> <tr class="heading"> <th>車

    CSSで見出し固定+レスポンシブ対応の表を作成