Form Design Patterns デモ URL の変更 (Heroku から Render に移行)
私の監訳書「Form Design Patterns — シンプルでインクルーシブなフォーム制作実践ガイド」では、各章の冒頭で「この章で解説するフォームの完成形」としてデモページをご用意しております。もともと原書用に公開されていたものをフォークして、主にラベルまわりを日本語化したものです。キーボード操作やスクリーンリーダーでの挙動も含めて確認できるようになっているので、実際に触れていただいて、アクセシビリティに優れたフォームの一例として参考にしていただけるかと思います。
このデモページは、これまで Heroku で公開していましたが、このたび Heroku の使用を、2024年4月末をもって終了することにいたしました。移行先は Render で、既に公開済です。
本書をお持ちの方は、各章の「この章で解説するフォームの完成形」に記載されている URL のうち、「herokuapp.com」の部分を「onrender.com」に差し替えていただくことで、引き続きデモをご覧いただくことができます。下記のような具合です。
- 旧) https://form-design-patterns-ja.herokuapp.com/examples/***
- 新) https://form-design-patterns-ja.onrender.com/examples/***
以下、各章のデモページの新しい URL へのリンクです (スリープ状態になっていることがあり、その場合、開くまでに1分ほど時間がかかることがあります)。
- 第1章:登録フォーム
- 登録フォーム
- 第2章:決済フォーム
- 任意の電話番号フィールド
- 配送オプションのラジオボタン
- 文字数のカウントダウン付きの配送メモ
- 支払いフォーム
- 第3章:航空券予約フォーム
- オートコンプリート
- 覚えやすい日付
- デートピッカー
- ステッパー
- 座席選択 (入れ子)
- 座席選択
- 第4章:ログインフォーム
- ログインフォーム
- 第5章:受信トレイ
- 受信トレイ
- 第6章:検索フォーム
- 検索フォーム
- 第7章:フィルターフォーム
- フィルターフォーム
- 第8章:アップロードフォーム
- ドロップゾーン
- 第9章:経費フォーム
- さらに追加
出版元のボーンデジタルさんのウェブサイトでも、正誤表と併せてご案内をさせていただいておりますので、よろしければ、ご参考にしていただけますと幸いです。