Smartphone スマホ

 
スマホデザイン・UI

スマホサイトの文字入力を快適にする「オートコンプリート」

スマホサイトオートコンプリート
スマホサイトで最もストレスを感じるページは「お問い合わせ」「決済ページ」ではないでしょうか? PCに比べてスマホでは文字入力がしづらく、同じ情報を2度入力しなくてはいけない項目があると、面倒になり「後からPCで入力しよう…」となりますよね。

そんな文字入力のストレスを解消し、スムーズな文字入力ができる機能を紹介します。

オートコンプリートで簡単入力を実現

オートコンプリート古くから使われている機能ですが、<form>タグに「autocomplete属性」を挿入することで入力内容の自動補完をしてくれます。つまり、入力フォームなどで、氏名やメールアドレス、住所、電話番号など繰り返し入力する手間を省いてくれる機能になります。

この機能の素晴らしい点は、バックエンド側に手を加えることなくマークアップのみで実装できてしまうところ。

自動補完機能があれば、文字入力の間違いや繰り返し入力する手間がなくなるため、スマホサイトでのコンバージョンを上げるための重要な機能になるかもしれません。

Google Chromeがサポートを開始!

2015年3月18日に、Googleのウェブマスター向け公式ブログで以下の内容が発表されました。

Google では 3 年前、フォームへの入力をすばやく、簡単に、スマートに行えるようにするため、Chrome で新たに「autocomplete」属性をサポートすることを発表しました。現在では、最新の WHATWG の HTML 標準(英語)に準拠する形で「autocomplete」属性が完全にサポートされています。

引用:オンライン フォームを入力しやすくするために

ここでは、メールアドレスにオートコンプリート機能を使うためのマークアップも紹介されています。

<input type=”email” name=”customerEmail” autocomplete=”email”/>

引用:オンライン フォームを入力しやすくするために

こういったブラウザのサポートが後押しになり、オートコンプリート機能がついたスマホサイトが増えると、ユーザーにとって快適なサイトが増えてきますね。

オートコンプリート機能を無効にしているサイトが意外と多い

セキュリティの観点から、「autocomplete=”off”」でパスワードなどを保存させない設定にしているサイトが多く見受けられます。ただ、ほとんどのブラウザが、これを無視してしまうためあまり意味がありません。
オートコンプリート機能については様々な意見があるようですが、ブラウザのセキュリティも堅固になっており、ユーザー自身で保存されたパスワードの削除もできるため、個人利用であれば大きな影響はないと言えます。

オートコンプリート機能は使うべきか?

ブラウザのサポート体制が整っているため、オートコンプリート機能は積極的に採用しても良いと思われます。制作側から見てもフロントエンドで完結するため実装も楽ですし、ユーザーにとっても入力作業が省かれるため、ストレスなく使えるようになります。

もし、セキュリティに不安を感じるようであれば、ユーザー自身がパスワード管理を徹底し必要な項目のみ使用するのでも良いかもしれません。

この記事を書いた人


モバイルラボ 編集部
ヨコハマ・モバイルラボとは? モバイルならではの表現ってなんだろう? 一瞬のひらめきや感動は手のひらから始まっています。 新しいクリエイティブのカタチをここから探してみましょう。
タグ

記事mobifyロゴ
Mobify(モビファイ)とは

Googleが認定しているマルチスクリーン対応のための最適化サービス。
デバイスに応じ、専用にデザインされたサイトを表示することができます。
ページの表示を高速化させる仕組みも持ち合せており、ユーザーの離脱を防ぐことが可能です。

▸Mobify(モビファイ)についてさらに詳しく

 最新記事