Empfohlene Add-Ons, um Ihre statischen Websites aufzupeppen

Wenn Sie ein Front-End-Entwickler wie ich sind, bin ich mir sicher, dass Sie zuvor in diese Situation geraten sind. Sie haben entweder eine einfache statische Website erstellt, oder Sie haben eine nette statische Vorlage heruntergeladen, und dann haben Sie gedacht, "Oh, wenn ich nur ein Kontaktformular dazu hinzufügen könnte" oder "Ich möchte nur eine Zahlungsschaltfläche hinzufügen". Das sind Fragen, die aus einem kleinen Projekt ein viel größeres Tier machen.

Es muss aber nicht so sein. Es gibt viele Tools und Funktionen, die Sie einer statischen Site hinzufügen können, ohne PHP, Ruby oder eine andere Form der Backend-Entwicklung einführen zu müssen. In diesem Artikel habe ich einige Ressourcen aufgelistet, die Ihre Site etwas weniger statisch machen.

Hosting

Ja, mir ist klar, dass dies nicht wirklich eine Front-End-Ressource oder ein Tool ist, aber wenn Sie möchten, dass jemand Ihre Site sieht, müssen Sie sie ins Web stellen. 

GitHub-Seiten

Für die statische Seite, die einen meiner beiden Favoriten hostet, handelt es sich sicherlich um GitHub-Seiten. GitHub Pages ist so konzipiert, dass Benutzer Websites erstellen können, die mit ihren Webprojekten auf GitHub.com übereinstimmen. Es tut das auch sehr gut, so sehr, dass die Leute es benutzen, um sein Hauptportfolio oder persönliche Websites darauf zu hosten. Sehen Sie sich die folgenden Tutorials an, um mehr zu erfahren:

  • Erste Schritte mit GitHub Pages: Statische Projektseiten, schnell
  • Erstellen von GitHub-Seiten (Teil von "Einführung in Git und GitHub" von Dan Wellman)

Hinweis: Wenn Sie eine Vorlage von Envato Market heruntergeladen haben oder vertrauliches Material auf GitHub Pages hosten möchten, müssen Sie für ein privates Repo bezahlen. In diesen Situationen ist es wichtig, dass Benutzer den Code nicht direkt von GitHub.com herunterladen können

Surge

Surge ist ein weiterer Favorit von mir und eignet sich hervorragend für statisches Hosting, vor allem, wenn Sie Websites live über die Befehlszeile verschieben möchten. Der Installationsvorgang ist angenehm unkompliziert.

Surges Walroß

Surge Plus, das robustere Funktionen bietet, als der kostenlose Preisplan, wie Kennwortschutz und HTTPS, wird Sie (zum Zeitpunkt des Schreibens) für $ 13 pro Monat zurücksetzen.

Formulare und Feedback

Formen waren für mich der Wendepunkt, an dem ich eingeräumt hatte, dass "ich hier PHP brauchen werde". Nun, nicht mehr dank Tools wie Formspree, Disqus und sogar Google Forms. 

Formularfreigabe

Mit Formspree können Sie ein statisches HTML-Formular in ein voll funktionsfähiges Kontaktformular umwandeln. Wenn Sie es selbst ausprobieren möchten, habe ich einen Artikel darüber geschrieben, wie Sie Formspree-Formulare zu einer statischen Site hinzufügen. 

Disqus

Wenn ich einer Site ein Kommentarsystem hinzufügen müsste, gehe ich direkt zu Disqus. es sieht gut aus und funktioniert perfekt (Spam sehr gut verarbeiten). Darüber hinaus fügt es den Kommentaren soziale und Gamification-Dynamiken hinzu, empfiehlt Diskussionen, fasst Trends aus dem gesamten Web zusammen und lässt Benutzer durch Community-Voting Punkte sammeln.

Es bietet sogar eine Monetarisierung, indem es den Publishern ermöglicht wird, die eigene Anzeigenplattform von Disqus zu nutzen.

Google Forms

Auf der anderen Seite ist Google Forms zwar ein weniger bekanntes Tool, aber es ist ziemlich gut darin, Feedback zu verwalten und Umfragedaten zu sortieren. Ich empfehle Ihnen auch, die neuen Google Forms auszuprobieren, da sie die Benutzeroberfläche und die Formulare aktualisiert haben, um dem neuen Material Design-System zu folgen.

Mmmm… Marshmallows

Domänen- und Servermanagement

CloudFlare

Seit ich CloudFlare entdeckt habe, benutze ich es zum Einrichten alles meine domains Durch das Einrichten Ihrer Domäne mit CloudFlare werden zahlreiche Funktionen freigeschaltet, die Sie über die Administrationsoberfläche aktivieren können. Flexibles SSL, Site Search, HTML-Komprimierung und mehr. Wenn Sie Widgets und Plugins von Drittanbietern in Ihre statische Website integrieren möchten, stellen die Optimierungs-Tools von CloudFlare sicher, dass Ihre Website so gut wie möglich funktioniert. Hier ist eine vollständige Liste der verfügbaren Apps.

Zahlungen

Zahlungen auf einer statischen Website durchführen? Bist du böse!? Nun, eigentlich nein, solange Sie über das richtige SSL-Zertifikat verfügen und alles auf sichere Weise eingerichtet ist, können Sie Zahlungen auf einer statischen Site genauso einfach wie alle anderen Arten annehmen.

Envato Market verfügt über hunderte statische Vorlagen für den Einzelhandel, die sich ideal für den Online-Verkauf von Dingen eignen, ohne an eine dynamische Plattform gebunden zu sein.

Streifen

Wenn Sie für ein Produkt einmalige Zahlungen in Anspruch nehmen möchten, empfehle ich die Verwendung von Stripe Checkout. Das Design des Dialogfensters ist erstklassig und sorgt für ein sauberes Benutzererlebnis, anstatt den Benutzer auf eine völlig andere Website zu leiten. 

Da es an Ihr Stripe-Konto gebunden ist, können Sie auch deren offizielle App verwenden, um Zahlungen zu verfolgen. 

Gumroad

Auf der Suche nach etwas etwas Stärkerem? Etwas, das mehrere Produkte, einen Korb und einen vollständigen Checkout-Prozess ermöglichen kann? Kein Problem, Gumroad hat den Rücken mit dem Inline Purchases Widget. 

Wenn Sie dies zu jedem Produkt auf Ihrer statischen Site hinzufügen, können Benutzer mehrere Produkte in ihren Warenkorb legen und diese über das Gumroad-Zahlungssystem bezahlen, das Sie von Ihrem Gumroad-Konto aus verwalten können. Mehr erfahren:

  • Super einfacher E-Commerce mit Gumroad

Andere Werkzeuge

Es gibt einige andere Tools, von denen Sie profitieren könnten, wenn Sie eine Website mit statischen Seiten erstellen. 

MapBuildr

Wenn Sie eine Karte zu Ihrer Website hinzufügen möchten, würde ich MapBuildr empfehlen, die eine relativ einfache Benutzeroberfläche zum Erstellen einer eigenen Karteneinbettung mithilfe des Google Maps-API bietet.

Mittel

Eine weitere Funktion, die Sie hinzufügen möchten, ist ein Blog. Ohne einen Generator wie Jekyll können Sie ein Blog nicht einfach in eine statische Website implementieren. Sie können jedoch einen Dienst verwenden, der speziell für das Bloggen entwickelt wurde. Medium ist für Einzelpersonen und Unternehmen sehr beliebt, um mit ihnen zu bloggen. Es gibt sogar eine Möglichkeit, Medium-Artikel auf einer statischen Seite einzubetten. 

Die Präsentation der Einbettung ist elegant und sauber, sodass sie nicht mit Ihrem Website-Design übereinstimmen sollte.

Fazit

Wie Sie sehen, muss eine statische Site nicht wirklich statisch sein. Es gibt viele leistungsfähige Tools, mit denen Sie Ihre statischen Vorlagen zum Leben erwecken können, von denen die meisten völlig frei eingerichtet werden können. Alle oben genannten Tools wurden mit Sorgfalt und Sorgfalt erstellt und entwickelt. Wenn Sie die Möglichkeit haben, eines von ihnen zu verwenden, kann ich es sehr empfehlen.