Hi everybody !
Before coding anything, I had a quick look on the internet in order to find some interesting resources, but sadly I couldn’t find any complete solution. There were HTML+CSS templates, but without the contact management, or PHP source code without any HTML+CSS pretty template, or even some kind of crappy PHP source code without any security concerns.
That’s why I decided to build my own solution, based on a few resources I found. First, I started from Stéphanie Walter‘s wonderful CSS3+HTML5 contact form without any images. I don’t like to use images everywhere on a website, and I like clean and light design, so her solution was exactly the kind of form I was searching for:
If you want to understand how to implement this kind of form, have a look to her great tutorial !
Then, I added a few PHP source code, in order to manage the mails sent from the form, with a few basic security management: escaping special characters, checking for injections in the mail field, and validating that every filed has been properly provided. At this point, I had a completely working solution, but I was not completely confident about the security. I thought about adding some kind of Captcha mechanism on the form, but Captcha are too boring, and clearly ugly.
As I didn’t want to add such a crappy thing on my beautiful form, I searched on the internet about another solution for securing contact forms without using Captcha, and I found this really interesting article from the jQuery documentation !
So I put everything together, and here is the result !
A complete PHP, HTML5, CSS3, jQuery contact form, which allows to send mails with a quite correct level of security. If you have any comments/suggestions, feel free to fork my repository and make a pullrequest, or you can also create an issue with your remarks, or even leave a comment right here
I hope it’ll help some of you !