<style scoped>
input:invalid, textarea:invalid { color: red; }
</style>
<label for="fURL">URL</label>
<input type="url" id="fURL">
Hasilnya akan tampak seperti berikut :
Jenis masukan url adalah untuk URL absolut, yang, tapi definisi, selalu menyertakan sebuah protokol.
Safari, Chrome, Opera, Android dan Firefox semua hanya memerlukan satu huruf plus titik dua: a: valid. IE membutuhkan setidaknya 2 huruf sebelum titik dua. Tidak ada browser yang memerlukan protokol umum seperti http, https atau ftp, atau bahkan //.
Mobile Safari tidak melakukan validasi, namun menampilkan keyboard yang dilengkapi kunci [/] dan [.com], dan menghapus kunci spasi. Android, hingga setidaknya 4.3, tidak memberi pengguna keyboard khusus URL.
Jika invalid, Firefox, Chrome, dan IE memberikan pesan kesalahan. Opera memberikan fokus elemen tanpa verbiage. Safari (Saat ini 7) tidak memberikan batasan validasi pada form submission.
Cross verbiage browser:
Firefox: Silahkan masukkan URL.
Chrome: Harap masukkan URL
IE: Anda harus memasukkan URL yang valid
Untuk memastikan protokol tertentu, gunakan atribut pattern
Agar tidak memerlukan protokol, kita akan bisa menggunakan jenis input teks dengan atribut inputmodel setidaknya untuk mendapatkan keypad terbaik dalam mendukung browser.
