Die eigene E-Mail-Adresse im Blog veröffentlichen, das möchten viele verständlicherweise nicht. Zu viel Angst vor Spam und außerdem muss der Nutzer so auch erst sein E-Mail Programm öffnen, wenn er euch eine Nachricht zukommen lassen will. Dabei weiß doch jeder, dass es Interessierten besonders einfach gemacht werden sollte, weil sie sich sonst unter Umständen gar nicht erst melden. Doch was ist die Alternative? Einfache Kontaktformulare lassen häufig viel Spam durch und Kontaktformulare mit PHP oder Javascript, die sind für viele einfach zu kompliziert einzubauen. Schließlich braucht es da schon ein wenig Hintergrundwissen, um keine Fehler zu begehen.
Es müsste also eine einfache Möglichkeit geben, problemlos ein Kontaktformular in die eigene Website zu integrieren und nach Belieben zu gestalten. Okay, sagen nun einige, solche Anbieter gibt es doch schon. Ganz genau, aber die verlangen häufig hohe monatliche Gebühren für ihren Service. Anders ist Formspree. Ohne Anmeldung, ohne Aufwand, ohne Probleme, könnt ihr mit Formspree Formulare generieren und einbauen. Zeit euch das Angebot mal genauer vorzustellen.
Was genau ist Formspree?
WerbungIm Grunde nimmt sich Formspree dem oben erwähnten Problem an. Ihr möchtet ein einfaches Kontaktformular integrieren, doch so einfach ist das eben nicht. Entweder ihr braucht PHP, oder ihr zahlt für einen Online-Service. Bei Formspree nicht. Formspree ist ein Formular to go, wenn man so möchte. Der Code wird einfach nur in eure Seite integriert, schon erscheint dort das entsprechende Kontaktformular. Einfach so. Selbiges könnt ihr dann via CSS noch frei anpassen und auch beliebige Felder hinzufügen.
Ist das Formular eingebaut und live erreichbar, bestätigt ihr einmalig die E-Mail Adresse und fortan funktioniert das Kontaktformular problemlos. Es dauert also kaum eine Minute, bedarf keiner komplizierten Einrichtung, läuft nicht auf dem eigenen Server, verursacht keine Last und ist damit ideal für alle, die einfach und schnell eine Kontaktmöglichkeit auf ihrer Seite hinzufügen möchten. So wie ich vor kurzem.
Wie ich zu Formspree fand
Als freier Autor und Content-Lieferant, habe ich mir vor einiger Zeit eine kleine Website aufgebaut. Nachdem alles sehr minimalistisch war, so wie ich es nun einmal liebe, fehlte noch eine einfache Kontaktmöglichkeit für Interessierte, die mir bezüglich einer Zusammenarbeit schreiben wollten. Was also tun? Ich bin Minimalist und Performance-Fanatiker und dementsprechend wollte ich jetzt nicht extra PHP nutzen, wo der Rest der Seite komplett statisch ist. Auch die kostenpflichtigen Services lohnen sich für mich nicht, vor allem weil ich wirklich nur ein simples Kontaktformular brauchte. Ohne Extras, ohne viele Zusätze oder separate Möglichkeiten. Dann erinnerte ich mich an Formspree, einen Dienst den ich schon lange als Lesezeichen abgelegt hatte, weil ich wusste, dass der Tag kommen wird, an dem ich ihn benötige.
So habe ich Formspree bei mir integriert
Im Grunde muss nur der Code von der offiziellen Website kopiert werden. Alles was wichtig ist, wurde dort bereits vermerkt. Beispielsweise, dass jedes Input-Feld einen »name tag« besitzt. Wer will kann weitere <select>, <input> und <textarea> -Felder hinzufügen, die am Ende ebenfalls korrekt übertragen werden. Alles vollkommen frei und nach Lust und Laune. Das alleine macht es schon sehr einfach und praktisch Formspree zu verwenden. Da ich nur ein einfaches Kontaktformular wollte, ganz simpel, sah der Code bei mir am Ende so aus:
<form action="https://formspree.io/name@meinedomain.de" method="POST">
<textarea name="text" placeholder="Nachricht einfügen" style="font:16px/25px arial,sans-serif;color:#777;width:90%;height:200px;padding:5%;text-align:center;border-radius:5px;background:#eee"></textarea>
<input type="email" name="email" placeholder="E-Mail einfügen" style="font:16px/25px arial,sans-serif;color:#777;width:97%;margin:15px 0 -25px;padding:1.5%;text-align:center;border-radius:5px;background:#eee">
<input style="font:700 24px/27px arial,sans-serif;display:block;width:100%;margin:35px 0 0;padding:25px 0;cursor:pointer;text-align:center;color:#fff;border-radius:5px;background:#e91e63;" type="submit" value="Nachricht senden">
</form>
Das fertige Formular, welches von mir genutzt wird, könnt ihr euch ganz unten auf meiner Website mal ein wenig genauer ansehen.
Dabei habe ich bewusst das komplette Aussehen bereits inline (also direkt im Code, nicht in einer separaten CSS-Datei) integriert. So bleibt das Kontaktformular abgetrennt vom Rest und ist in Sachen Styling nicht vom allgemeinen CSS-Code abhängig. Natürlich könnt ihr den Code aber auch sauber in eine separate Datei verlagern. In meinem Fall wollte ich das Formular allerdings eben möglichst kompakt und losgelöst vom restlichen Content der Seite belassen und hab mich daher für diese Lösung entschieden. Ganz oben unter »name@meinedomain.de« müsst ihr noch eure eigene E-Mail Adresse einfügen, an die später die Nachrichten weitergeleitet werden sollen.
Bestätigung und weitere Möglichkeiten
Ist das Formular auf der Seite integriert und online aufrufbar, müsst ihr es einmalig abschicken. Daraufhin bekommt ihr eine E-Mail und bestätigt diese, indem ihr den entsprechenden Link anklickt. Nachdem das geschehen ist, werden alle gesendeten Nachrichten korrekt an die angegebene E-Mail Adresse weitergeleitet.
Wer mehr möchte, kann noch problemlos weitere Felder in das Formular einfügen. Zum Beispiel für einen Betreff, den Namen oder jegliche Form von weiteren Angaben. Probiert es einfach aus, alles ist sehr einfach gehalten. Außerdem lässt sich noch die Seite festlegen, auf die Nutzer nach dem absenden des Kontaktformulars weitergeleitet werden. Das geschieht mit einem versteckten Feld, welches einfach vor das schließende </form> eingefügt wird.
<input type="hidden" name="_next" value="//meinedomain/absendeseite.html" />
Nicht nötig, aber vielleicht praktisch
Formspree stammt von Entwicklern, die das Problem mit den Formularen erkannt haben. Die Lösung funktioniert problemlos, ist kostenlos und hat kaum Einschränkungen. Trotzdem gibt es natürlich auch einen Gold-Account, für alle die das Projekt nutzen und unterstützen wollen, oder mehr als die Standards brauchen. 1.000 E-Mails pro Monat ist beispielsweise das Limit für Nicht-Zahler.
Wer einen Gold-Account hat, kann seine E-Mail Adresse außerdem im Formular verstecken, sodass diese im Code nicht sichtbar ist. Auch ein Archiv ist im Gold-Acccount vorhanden und natürlich dürfen weit mehr als 1.000 Mails pro Monat empfangen werden, auch wenn nur wenige dieses Limit überschreiten werden. Der Gold-Account ist mit 9,99 Dollar im Monat übrigens auch nicht allzu teuer, zumindest nicht wenn ihr die einfache Art und Weise von Formspree zu schätzen wisst und entsprechend oft nutzt. Alle Infos gibt es direkt auf der Website selbst, dort sind auch die wichtigsten Einstellungsmöglichkeiten auch noch einmal genauer erklärt. Für mich ein faires Angebot, wobei mir persönlich der Free-Account reicht.
Simpel und unkompliziert
Wer schon einmal in der Situation war, dass er ein Kontaktformular brauchte, dafür aber eben kein Plugin oder eine komplizierte PHP-Lösung verwenden wollte, der ist mit Formspree bestens bedient. So bin ich selbst auf den Service gestoßen. Das ist quasi Drag n’ Drop, mit freier Auswahl der benötigten Eingabefelder.
Formspree ist schnell und einfach eingebaut, funktioniert wunderbar und erzeugt keine Last auf meinem Server. Da es kein Plugin ist, beinhaltet es auch keine potenziellen Sicherheitslücken und da es kein PHP beansprucht, läuft es auch auf statischen Seiten rasend schnell. Von meiner Seite aus, kann ich euch Formspree daher auch nur wärmstens empfehlen. Eine wunderbare Möglichkeit, schnell und einfach ein Kontaktformular zu integrieren und nach den eigenen Wünschen anzupassen. Für Nischenseiten, Blogs, Websites, eigentlich für jeden Bereich. Schaut euch den Dienst also ruhig mal ein wenig genauer an.
Werbung
Automatisch rechtssichere DatenschutzerklärungLust auf eine Datenschutzerklärung, die sich selbst aktualisiert? Mit Plugins für WordPress, Joomla und Co.www.avalex.deSo verdienst du mit YouTube GeldDiese Anleitung zeigt, wie du dir mit YouTube ein Nebeneinkommen aufbauen kannst, auch wenn du bisher noch kein Video hast.www.cashtubemasterclass.de3 Monate kostenloses HostingBeim deutschen Hoster All-Inkl.com gibt es günstiges und leistungsfähiges Hosting. Optimal für Affiliate-Websites und Blogs.www.all-inkl.com
Hi Peer! Ich verfolge nun schon eine sehr lange zeit deine Blogs als Stiller leser und ich lehrne jedes mal was neues bei dir :)
Die Idee mit der Einbindung eines Externen Kontaktformulars finde ich gehrade bei einer Statischen Seite einfach super! Es nimt viel Arbeit ab und dazu bleibt die kleine Website Statisch und schlank!
Werde den Tipp gleich bei einem meiner Webprojekte einbauen!
Danke für den Super Artikel!
Hallo David!
Was ist denn mit folgenden Problemen?
1) Die E-Mailadresse steht als Klartext im Quelltext. Zwar steht noch eine URL davor, aber trotzdem ist es sicherlich nicht schwierig, diese Adressen automatisch zu sammeln und mit Spam zu versorgen.
2) Wird durch die Bestätigung verhindert, dass jemand anderes das Formular verwendet und dich so direkt mit Nachrichten flutet? Also werden nur Nachrichten von deinem Server angenomen?
3) Der Datenschutz gibt mir noch zu denken. Zwar sagen die Entwickler, sie speichern „nur“ die letzten 100 E-Mails, aber trotzdem geht der ganz Datenverkehr der Formulare über den Formspree-Server. Außerdem verwendet Formspree die SendGrip-API, die amerikanischem Recht unterliegt.
Besonders aus Gründen des Datenschutzes bzw. der Datensicherheit würde ich extrem gut abwägen wollen, ob sich der Einsatz eines externen Anbieters lohnt.
Ansonsten stehe ich auch oft vor dem Problem mit Kontaktformularen bei statischen Seiten. Eine für mich akzeptable Lösung habe ich noch nicht gefunden und fand deinen Beitrag daher interessant.
Viele Grüße
Heiko Mitschke
1) In der Bezahlvariante wird sie verschleiert. Ansonsten ist das ein altbekanntes Problem und ehrlich gesagt… komplett egal. Spammer kriegen deine E-Mail eh immer, jedenfalls ist es mir noch nie effektiv gelungen das zu verhindern, weshalb ich inzwischen fast überall die E-Mail einfach direkt hinschreibe und gut ist. Alle „Sicherheitsmaßnahmen“ enden meist nur damit, dass jemand er die kontaktieren will große Probleme bekommt und es dann einfach sein lässt.
2) Google ReCaptcha verhindert das.
3) Das ist bei solchen Services natürlich immer so eine Sache. Wer 100% sicher gehen will, sollte sich nach einem deutchen Service umschauen.
Hallo David!
Danke für deine Antworten!
1) Es gibt durchaus Varianten, die (zumindest noch) funktionieren. Bei E-Mailadressen, bei denen ich JavaScript gemischt mit Unicode-Zeichen nutze, hatte ich glücklicherweise noch nie das Problem. (Ja, die Adressen sind noch direkt als Links verfügbar und sehen auch so aus.)
2) Ich meinte, ob ich dein Formular bei mir einbinden kann und dir darüber Nachrichten zukommen lassen kann. Oder direkt per POST-Daten. Ich konnte auf die schnelle keine Überprüfung des Absenders feststellen. Daher meine Frage. :)
Viele Grüße
Heiko