スポンサーリンク

「Contact Form 7」とラジオボタンの考え方

WordPress

お久しぶりです、小暮です
思う所ありましてこのブログを復活させようかなと思い立ちました
とりあえずなんか気になったことから書き始めようと思いタイトルようなお話です

先日こちらの勉強会に参加させていただいたいのですが、参加者の方からこんなお話がありました

「Contact Form 7でラジオボタンを必須にしようとしたけど出来ない」

いやいやそんなことないでしょ?アスタリスク付ければ必須になるでしょ?記述の間違いでしょ?
と思っていたのですが、調べてみた所上記の考えが恐ろしく失礼だったことが分かりました

 

HTML的に考えると

Contact Form 7の開発者の方のおっしゃるには

radio はラジオボタン (HTML における <input type=”radio”>) のグループを表現します。入力必須版の radio (“radio*”) はありません。Contact Form 7 が “radio*” を提供しない理由は、そもそもラジオボタンとは入力必須のものだからです。このあたりのことについては HTML の仕様を見た方が早いでしょう。

引用元はこちら

 

確かになと
そして必須に出来ないと言ってた方にごめんなさいと
要するに
「ラジオボタンとはそもそも必須の項目であり、それをあえて必須にする必要は無いんじゃないの?」
ということですね、HTMLの仕様にもこのように書かれております

radio buttons
Radio buttons are like checkboxes except that when several share the same control name, they are mutually exclusive: when one is switched “on”, all others with the same name are switched “off”. The INPUT element is used to create a radio button control.
If no radio button in a set sharing the same control name is initially “on”, user agent behavior for choosing which control is initially “on” is undefined. Note. Since existing implementations handle this case differently, the current specification differs from RFC 1866 ([RFC1866] section 8.1.2.4), which states:
At all times, exactly one of the radio buttons in a set is checked. If none of the <INPUT> elements of a set of radio buttons specifies `CHECKED’, then the user agent must check the first radio button of the set initially.
Since user agent behavior differs, authors should ensure that in each set of radio buttons that one is initially “on”.

引用元はこちら

英語なんでGoogle翻訳にかけつつ簡単にまとめると

  • ラジオボタンはチェックボックスに似ているが、常に1つの項目しか選択できない
  • 初期値の選択はユーザーエージェント側では用意されていない
  • ラジオボタンのinput要素のどこにも「checked」を指定してないとユーザーエージェントが最初のラジオボタンをチェックしなければならない
  • だから初期値の設定はちゃんとしようね
  • checkedを設定しようね

といった感じになります
「ちゃんと情報を取得したいのなら、ラジオボタンを設置する場合は運営者側から初期値を設定しておきましょう」
ということですね

ユーザービリティ的な所と集計結果から考えると

例ですが、恐らく世界中で最も多く使用されている性別のラジオボタンで考えます

男性
女性

上のラジオボタンの場合、まず初期値が設定されておりません
この状態で仮にこのラジオボタンを無視された場合、この項目の情報を取得できないという結果になります
では何かしらの情報を確実に取得したいなら

男性
女性

このようにどちらかの性別を初期値にすればいいのですが、これにも問題があります
まずこのラジオボタンが無視された場合の解決策にはなっておりません、無視されたら「男性」になりますので、集計結果から本当の「男性」の数を算出できなくなってしまいます

また、性別はとてもデリケートな問題を含んでいる場合もあります
「メールフォームで自分の性別を相手に伝えたくない!」と考える方もいると思います
そうした場合は二者択一の選択をせまるラジオボタンは果たしてユーザーに優しいのか?という疑問も浮かんできます

じゃあどうしたらいいん(´・ω・`)?

ラジオボタンの特性をもう一度考えます

  • ラジオボタン自体が選択必須の項目である
  • 複数の項目からどれか1つを必ず選ばなければならない
  • 初期値はユーザーが選べない

上記をまとめると「ユーザーに必ず選択を強いる」という
実は非常に強力な入力項目だったということに気付かされます

強力であるがゆえに、逃げ道を用意してあげるのが良いのではないかと考えます
これは項目の内容によりますが、例としてあげた性別のような
デリケートな部分があるものはこのようにすればいいと思います

選択しない
男性
女性

とても腰の引けたラジオボタンの完成です

選択しない
男性
女性
その他

「その他」とかあるとより腰が引けてていいですね?

一見すると「無視された場合の解決策」にはなっていないと思いますがなっていません
しかし「ユーザーに二者択一の選択を要求した結果、正しい情報を得られない」と比較すれば「より正しい集計結果」を得られると考えられます
また、総数が増えれば増えるほどこの方法の方で正しい情報を得ることできると思います
(そもそも性別や年齢の情報が取得したければAnalyticsを使えばいいって話ですが、あくまで例題として)

全てのラジオボタンに対して「選択しない」や「その他」が必要かと言うとそうではないと思います
しかし逆に考えると全てのラジオボタンに「選択しない」や「その他」があったとしても何の問題もないと思います

じゃあContact Form 7でどうやってラジオボタンの初期値を設定するねん(default)

最初の問題に戻ります
「ラジオボタンは最初から選択必須の項目」というところから
「初期値が必要なのは分かったからどうやって設定するねん」というお話ですが
素晴らしき「Contact Form 7」にこのようなオプションが用意されております

[radio your-sports label_first default:2 "Football" "Tennis" "Pole-vault"]

実行結果はこうなります

Football
Tennis
Pole-vault「default」という設定で初期値を設定できます上の例だと「default:2」となっておりますので2番目の「Tennis」が初期値として選択されます

 

無理やり必須に出来るようにするのはどうなの?

調べると「functions.phpをいじってラジオボタンを必須化する方法」というのもありました
必須項目の未入力エラーを吐き出したい場合はその方法もアリかなと思います

しかしその実態は「ユーザーに無視できない選択を強いる」というユーザビリティ的にあまり親切ではない結果になります
それは果たして正しいのでしょうか?否定はしませんが疑問は尽きません

 

まとめ

  • Contact Form 7ではラジオボタンを必須に出来ない
  • しかしそもそもラジオボタンを必須にする意味がない
  • ラジオボタンの初期値は必ず設定しましょう

ラジオボタンは入力項目としてはとても強力なので用法に注意する必要があります
メールフォームを作る時は謙虚な気持ちで作りましょう

コメント

タイトルとURLをコピーしました