Cambiar color de un input cuando hay error

[ShinFDuran]

Mi recomendación sería primero añadir una validación de JavaScript con una expresión regular para saber si el correo es válido, con eso se cubriría la mayor parte de los casos. En caso de que no fuera válido seguir el consejo de rauldev.

Yo uso una validación similar que comprueba y al darle a enviar revisa el correo, si no es correcto o está vacío envía un alert y en caso contrario envía el formulario:

Código Java:

function validate(){        
    var email = document.getElementById("email").value;
    if (email == null || email.length == 0){
        alert("Introduzca un email");
        return false;
    }else if (!(/^[_a-z0-9-]+(\.[_a-z0-9-]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,3})$/.test(email))){
        alert("La dirección de email es incorrecta");
        return false
    }
 
    //alert("Datos correctos.");
    return true;
}
 

Igualmente, mantén la validación por php por si algún listillo le da por desactivar JavaScript, pero la mayoría de usuarios habituales con el check por JavaScript sobrados y te ahorras tener que estar recargando la página para hacer la comprobación.