html - Browser automatically validates a non-mandatory field with an empty value -

i have simple form contains <input> intended filling in email addresses should user decide so, i.e. field not mandatory. use type="email" attribute helps autocompletion particularly benefits smartphone users - causes keyboards rearrange in order facilitate email input.

however, there users not advanced mobile devices may have difficulties typing @ sign. also, there still exist desktop users cannot type either; know , presume there many more. these users set initial value of <input> @. shall stress not placeholder.

but these 2 things clash. browsers' native form validation mechanisms activated type="email" prevent form submission since not understand field not mandatory , not mind users sending @ value.

is there way tell browser validate field only if value not @ or empty string? obviously, easy make own validator using javascript not resort that.

or premise users unable type @ sign false , solve issue leaving <input> empty in first place? there research on matter? still see relatively recent complaints desperate users on various tech forums , imagine vast majority of similar inexperienced users not go ask online, perhaps because not know how to.

or should use old type="text"?

how think should approach this?

thank in advance!

it seems way disable user agent validation add novalidate form. disable ua validation on form , not 1 input. maybe use javascript validation other inputs , use input[type="text"] else.

<form novalidate>     <input type="email" value="@">     <input type="submit" value="submit"> </form> 

i use javascript alter field depending on user agent.

its real shame w3c didn't think of this, surely simple novalidate on input suffice, hope gets fixed, otherwise input[type="*"] kind of useless future use.