Besseren Webcode schreiben

Hier finde ich etwas ironisch. Viele Webdesigner schätzen die Einfachheit, die Web Builder mit sich bringen. Interessanterweise wurde der Großteil der Web-Builder erstellt, um die Rolle von Web-Designern und -Entwicklern durch Automatisierung des zugrunde liegenden Codes zu eliminieren.

Lustig, richtig?

Andererseits gibt es Web-Builder, die scheinbar das Gegenteil tun. Anstatt die Rolle von Designern und Entwicklern zu reduzieren, werden Tools zur Verfügung gestellt, die speziell für solche Teams optimiert wurden. Ihr Hauptziel ist es, Designagenturen mit fortschrittlichen Tools zu unterstützen.

Wie, fragst du?

Nun, Webfluss ist eines der prominentesten Beispiele. Und seine Rolle in der gesamten Webdesign-Umgebung werden wir in Kürze untersuchen. In diesem Webflow-Überblick werden alle wichtigen Features beschrieben, die Sie kennen müssen, die entsprechenden Schwächen sowie die Kosten für die Nutzung der Plattform für das Design.

Aber was genau ist Webflow?

Webflow Review: Überblick

Wie Sie wahrscheinlich bereits herausgefunden haben, ist Webflow kein typischer Web Builder.

Dieses in 2013 eingeführte Tool verkauft sich selbst als Webdesign-Lösung, die professionelle, kodierungsfreie Entwurfstools mit einem leistungsstarken visuellen CMS und der Benutzerfreundlichkeit von Standard-Buildern kombiniert. Stellen Sie sich also eine Fusion zwischen einer Web-Building-Lösung vor Wix und eine CMS-Engine gefällt WordPress.

Webfluss

Aber mach keinen Fehler. Webflow konkurriert nicht mit Leuten von Wix und Weebly. Es bietet verschiedene Funktionen für unterschiedliche Benutzergruppen.

Alles in allem ist das Faszinierende dabei der intelligente Ansatz von Webflow für das gesamte Coding. Es handelt sich um eine codefreie Plattform, die die Code-Bearbeitung für mehr Flexibilität unterstützt.

Verwirrend? Ja, ich weiß. Aus diesem Grund habe ich mir die Zeit genommen, genau zu prüfen, was Webflow zu bieten hat - vom Website-Design bis zum Content-Management-System.

Und hier sind die Details…

Webflow Review: Funktionen

Website Design

Webflow ist zweifellos ein paar Dinge. Sein code-loses Webdesign-Tool war hier jedoch immer das wichtigste Angebot.

Nun, es wäre verständlich, wenn Sie es mit dem Bearbeitungsfenster von Adobe Photoshop verwechseln, bevor Sie beginnen. Diese beiden könnten von weitem wie Zwillingsgeschwister aussehen, werden sich jedoch bei näherer Annäherung als sehr unterschiedlich erweisen. Genauer gesagt stellen Sie fest, dass es sich bei Webflow um eine Automatisierungsmaschine handelt, die weitgehend mit CSS und HTML arbeitet.

Webflow-Designer

Darauf können Sie Site-Elemente bequem einführen und sie ohne Code entsprechend verschieben. Das Programmierbit wird vom zugrunde liegenden Framework von Webflow gehandhabt, das systematisch den Code Ihrer Site erstellt und bearbeitet, während Sie mit dem Entwurfsprozess fortfahren.

Wenn Sie andere ohne Code ausgeführte Webdesigner ausprobiert haben, wissen Sie, dass die Beseitigung des Programmier-Bits mit eingeschränkter Flexibilität verbunden ist. Interessanterweise folgt das Design-Tool von Webflow diesem Trend nicht. Um ehrlich zu sein, gebe ich zu, dass dies sicherlich einer der fortschrittlichsten und vielseitigsten Website-Builder auf dem Markt ist.

Jetzt stellen wir uns der Sache. Fortschrittlichkeit und Einfachheit sind zwei Dinge, die bekanntermaßen wie Feuer und Eis sind, wenn es um Website-Management-Tools geht.

Formuliert ist Webflow nicht einer der einfachsten Builder, die Sie dort finden werden. Obwohl die Benutzeroberfläche äußerst leistungsfähig ist, scheint sie kompliziert zu sein und kann einige Anstrengungen erfordern, um die Seile entsprechend zu erlernen.

Für den Anfang erzeugt Webflow nicht die Illusion eines vollständig codlosen Designprozesses. Erwarten Sie also nicht, direkt hineinzuspringen und Formen auf der Leinwand zu zeichnen. Ein solcher Ansatz würde Ihre Anpassungsfähigkeit erheblich einschränken.

Daher integriert das System hier beim Erstellen einer Website einige Aspekte des Codierens. Wenn Sie beispielsweise eine quadratische Mitte einführen möchten, müssen Sie ein neues <hinzufügendiv> Element, dann bearbeiten Sie den unteren linken und den rechten oberen Punkt zusammen mit der festen Positionierung als Null.

Was bedeutet das?

Während Sie Webflow ohne Programmierkenntnisse nutzen können, ist ein grundlegendes Verständnis der HTML- und CSS-Eigenschaften erforderlich, um die reinen Möglichkeiten voll auszuschöpfen.

Wenn Sie jedoch etwas anderes bevorzugen, kreuzen Sie einfach dasIch schreibe keinen Code “ Wahl wie Sie sich registrieren. Das System erweitert anschließend seine Automatisierungsfunktionen, um einen großen Teil des Designs für Sie abzuwickeln.

Das heißt, Sie können mit einer vollständig leeren Leinwand beginnen. Das ist der Ansatz, den ich bevorzuge, weil ich alles von der Basis aus anpassen kann.

Ein Wort der Vorsicht. Überlassen Sie diese Option Designern, die mit CSS und HTML vertraut sind. Andernfalls riskieren Sie, die Dinge durcheinander zu bringen oder sich irgendwo im Prozess festzusetzen.

Der beste Ansatz für das Codieren von Neulingen ist die Nutzung der vorgefertigten Vorlagen von Webflow. Es stellt sich heraus, dass das System mehr als attraktive 200-Vorlagen bietet, von denen 30 völlig kostenlos ist. Bezahlte kosten dagegen zwischen $ 24 und $ 79.

Nach einer gründlichen Analyse verschiedener Themen fiel mir auf, dass sie sich deutlich unterscheiden - mit unterschiedlichen Strukturen und Merkmalen. Im anschließenden Bearbeitungsprozess können Sie dann den Hintergrund, die Farbe, die Ebenen, die Deckkraft, die Drehung, die Effekte, die Position, die Größe usw. der Elemente ändern.

Hosting

Das ist selbstverständlich. Dieser Webflow bietet, wie die meisten Web-Builder heute, neben seinen Design-Paketen auch Site-Hosting sowie benutzerdefinierte Domänen.

Webflow-Hosting

Erwarten Sie hier jedoch nicht den typischen gemeinsamen Planansatz. Webflow entscheidet sich stattdessen dafür, die Websites intern zu verwalten, was als "unendlich skalierbare Serverflotte" bezeichnet wird.

Was beinhaltet das?

Nun, Webflow besitzt und kontrolliert mehr als 100-Rechenzentren auf der ganzen Welt. Kombinieren Sie das mit vorbeigeführten CDNs Amazon CloudFront Plus Schnell Das Ergebnis ist ein solides System für das Hosting aller Arten von Websites.

Webflow gewährleistet nicht nur die Größe des Datenverkehrs, sondern gewährleistet auch eine optimale Leistung mit Ladezeiten von Seiten in Millisekunden plus 99.99% Website-Verfügbarkeit. Das AWS-basierte Framework ist besonders wichtig, um eine solide Grundlage für die Unterstützung vergleichsweise großer Verkehrslasten von Unternehmensstandorten zu schaffen.

Da Web-Sicherheit unerlässlich ist, ist die Hosting-Infrastruktur von Webflow HTTP / 2-konform und Benutzer erhalten relevante SSL-Zertifikate für ihre Websites.

Content Management System

Hier trifft Inhalt auf visuelles Design. Mit dem CMS von Webflow können Sie im Wesentlichen den Inhalt Ihrer Website eingeben und verwalten. Mit anderen Worten, Sie können beliebigen Text oder Medien auf der Seite, die Sie gerade erstellen, hinzufügen und bearbeiten.

Wenn Sie ein umfangreiches Webprojekt mit komplizierten Strukturen verwalten, werden Sie insbesondere die Fähigkeit des Systems schätzen, manuelle Anpassungen von Inhaltsaspekten - einschließlich Inhaltstypen, Teammitgliedern, Projekten usw. - mit anpassbaren Feldern zu unterstützen.

Nun, all dies wird durch erleichtert CMS-Sammlungen- eine Funktion, auf die direkt vom Haupteditorfenster aus zugegriffen werden kann. Sobald Sie eine neue Sammlung generieren, können Sie über den Inhaltstyp hinausgehen, um Felder zu definieren und Elemente einzuführen. Sie werden anschließend als separate Webseiten oder Listen übernommen, die in von Ihnen erstellte Seiten integriert sind.

Webflow-CMS

Verwirrend? Beachten Sie dieses Beispiel: Um eine Seite mit der Belegschaft Ihrer Organisation einzurichten, können Sie eine Sammlung "Teammitglieder" mit Elementen wie sozialen Links, Beschreibungen, Namen, Fotos und Mitarbeiternamen einführen.

Das deckt im Wesentlichen das CMS-Backend ab. Aber weißt du was? Das ist nicht alles. Webflow bietet WordPress mit dem Webflow-Editor einen guten Lauf für ihr Geld. Hier können Sie eine veröffentlichte Seite mit neuen Inhalten auf der Grundlage des zuvor ausgewählten Typs aufpeppen.

Kurz gesagt, Sie erhalten eine umfassende Website, die dynamische Inhalte wie Portfolios, Artikel und Blogposts unterstützt, ohne zusätzliche Plugins installieren zu müssen.

Zusammenarbeit

Gib es zu. Große Webdesign-Projekte sind spannend. Sie können jedoch zunehmend unhandlicher werden, insbesondere wenn Sie es versäumen, alle beteiligten Parteien entsprechend zu rationalisieren.

Webflow scheint dies durchdacht zu haben und ist ein guter Versuch, Web-Design-Agenturen mit mehreren Teammitgliedern die Zusammenarbeit zu erleichtern. Darüber hinaus können Sie auch andere Parteien wie Kunden, Designer von Drittanbietern, Auftragnehmer usw. einladen. Ihre Rollen und Benutzerfunktionen hängen von den entsprechenden Berechtigungen ab, die Sie festlegen.

Webflow-Zusammenarbeit

Wenn Sie beispielsweise mit Kunden zu tun haben, können Sie sie einladen, ihre Projekte in Echtzeit zu überprüfen - mit stark eingeschränkten Nutzungsrechten.

Ich habe jedoch festgestellt, dass alle Standortanpassungen in Echtzeit flächendeckend reflektiert werden. Dies hilft den Teammitgliedern, wiederholte Aufgaben zu vermeiden, die bereits erledigt wurden.

Gesamteigenschaften

  • XML-Sitemap
  • SEO-Meta-Titel, Beschreibungen
  • Alt-Tags für Bilder
  • Hilfezentrum
  • Gemeinschaftsforum
  • Prioritätsunterstützung
  • E-Mail-Unterstützung
  • Benutzerdefinierter Domainname
  • Staging-Sites
  • Sofortige Updates
  • Benutzerdefinierte URL-Weiterleitungen
  • 24 / 7 Website-Überwachung
  • Schnelle Ladezeiten
  • Google Domains Einkauf
  • Zapier-Integration
  • MailChimp Integration
  • Google Analytics-Integration
  • SEO-Optimierung
  • Weiße Etikettenformulare
  • Weiße CMS-Kennzeichnung
  • Standortkennwortschutz
  • Projektorganisation
  • Website-Backups
  • Benutzerdefinierte Fehlerseiten
  • Benutzerdefinierte Favicon
  • Direkte Kundenabrechnung
  • SNS-Komponenten
  • Rich Text
  • Lightbox
  • Hintergrundvideos
  • HTML-Einbettungscodes
  • Dropdown-Menü
  • Google Maps
  • Schieber und Karussells
  • Tab-Navigation
  • Anpassbare Webformulare
  • Website-Editor
  • Formulareinreichungsprüfung
  • Diagramminhalt öffnen
  • SEO-Tags-Vorlage
  • CMS-Import über Zapier
  • RSS-Feeds
  • CMS-API
  • 3D-Animationen
  • CSS-Styling-Eigenschaften
  • Website-Vorlagen
  • Optimierte Bilder
  • Web-Schriftfamilien
  • Globale Farbfelder
  • Flexible Boxen CSS3
  • Benutzerdefinierter Code hinzugefügt
  • Exportierbarer Code
  • CSS-Filter

Webflow-Überprüfung: Preisgestaltung

Die Preisstruktur von Webflow scheint für einige Benutzer komplex zu sein, während andere den All-Inclusive-Ansatz loben.

Wenn Sie der Typ sind, der zahlreiche Pakete auf einer einzigen Plattform hasst, weil der komplexe Vergleichsprozess damit einhergeht, werden die Preispläne von Webflow möglicherweise etwas umständlich. Andererseits, wenn Sie mehrere Preisgestaltungsoptionen bevorzugen, die sich auf verschiedene Nutzerkategorien beziehen, werden Sie feststellen, wie die Dinge hier organisiert wurden.

Zunächst versucht Webflow, drei Arten von Benutzern zu unterstützen: Freiberufler, Solo-Designer und Designteams. Jede Kategorie verfügt über eigene Pakete mit unterschiedlichen Funktionen.

Webflow-Pakete

Hier sind kurze Beschreibungen der einzelnen Pläne:

Für Freelancer:

Kostenlose Inszenierung Komplett frei.

  • 10-Formulareinreichungen pro Monat
  • 50 CMS-Elemente
  • 500 monatliche Besuche
  • Statische 2-Seiten
  • Kostenlose webflow.io-Subdomain

Grundhosting- $ 15 monatlich abgerechnet oder monatlich $ 12 abgerechnet.

  • 500-Formulareinreichungen pro Monat
  • 25,000 monatliche Besuche
  • Statische 100-Seiten
  • CDN
  • Kostenlose SSL-Option
  • Domain-Erstellung

CMS-Hosting- $ 20 monatlich abgerechnet oder monatlich $ 16 abgerechnet.

  • 3-Inhaltseditoren
  • CMS-API-Zugriff
  • 2,000 CMS-Artikel verfügbar
  • 1,000-Formulareinreichungen pro Monat
  • 100,000 monatliche Besuche
  • Statische 100-Seiten
  • CDN
  • Kostenlose SSL-Option
  • Domain-Erstellung

Business Hosting- $ 45 monatlich abgerechnet oder monatlich $ 36 abgerechnet.

  • 10-Inhaltseditoren
  • CMS-API-Zugriff
  • 10,000 CMS-Artikel verfügbar
  • Unbegrenzte Einreichung von Formularen
  • 1,000,000 monatliche Besuche
  • Statische 100-Seiten
  • CDN
  • Kostenlose SSL-Option
  • Domain-Erstellung

Webflow für Freiberufler

Für Designer:

Anlasser- Frei.

  • Kostenlose Inszenierung
  • Kundenabrechnung
  • Bis zu 2 gleichzeitige Projekte
  • Kostenloser Standortbau

Lite- $ 24 monatlich abgerechnet oder monatlich $ 16 abgerechnet.

  • Code-Export
  • Verbesserte Inszenierung
  • Kundenabrechnung
  • Bis zu 10 gleichzeitige Projekte

Profi- $ 42 monatlich abgerechnet oder monatlich $ 35 abgerechnet.

  • Standortkennwortschutz
  • Weiße Beschriftung
  • Übertragung des Projektbesitzes
  • Code-Export
  • Verbesserte Inszenierung
  • Kundenabrechnung
  • Unbegrenzte Anzahl gleichzeitiger Projekte

Webflow für Designer

Für Kreativteams

Mannschaft- $ 42 monatlich abgerechnet oder monatlich $ 35 abgerechnet.

  • Team-Dashboard
  • Standortkennwortschutz
  • Weiße Beschriftung
  • Code-Export
  • Verbesserte Inszenierung
  • Kundenabrechnung
  • Unbegrenzte Anzahl gleichzeitiger Projekte

Großes Team- Benutzerdefiniertes Zitat.

  • Preise für Massenmitgliedsmitglieder
  • Team-Dashboard
  • Standortkennwortschutz
  • Weiße Beschriftung
  • Code-Export
  • Verbesserte Inszenierung
  • Kundenabrechnung
  • Unbegrenzte Anzahl gleichzeitiger Projekte

Webflow für Teams

Wer sollte über den Einsatz von Webflow nachdenken?

Alles in allem applaudieren wir Webfluss für die Bereitstellung von:

  • Kostenloses SSL-Zertifikat zur Einhaltung der Sicherheitsbestimmungen.
  • Kostenlose integrierte Content Delivery Networks für verkürzte Seitenladezeiten.
  • Erweitertes globales Website-Hosting in Zusammenarbeit mit effektiven Systemen wie Amazon CloudFront und Schnell für schnelle Seitenladegeschwindigkeiten.
  • Ein vielseitiges integriertes CMS zur dynamischen Erstellung von Inhalten.
  • Eine Inszenierungsumgebung zum Testen und Überprüfen verschiedener Website-Elemente.
  • Optimierte CSS- und JS-Manager für erweitertes Site-Management sowie eine ganzheitliche Steuerung von Animationen und Stilen.
  • Ein flexibler Webbuilding-Prozess, der entweder mit einer leeren Leinwand oder mit vorgefertigten Vorlagen beginnt.
  • Ein mobilfreundliches Webdesign-Tool, das beim Erstellen einer Website in Echtzeit exportierbaren Code erzeugt.

Abgesehen davon sind die Nachteile, die mir auf dem Weg begegnet sind:

  • Begrenzte Funktionen zur Unterstützung von E-Commerce-Websites
  • Ein Design-Prozess, der Programmierer stark begünstigt
  • Eine begrenzte Anzahl von Website-Vorlagen
  • Eine steile Lernkurve für Anfänger

Lassen Sie uns nun alles zusammenfassen. Ich wette, Sie stimmen zu, dass Webflow ein fortschrittliches Webbuilding-System ist, das für Entwickler, Designer und Agenturen entwickelt wurde, die mehr Flexibilität und Kontrolle suchen.

Was sind deine Gedanken?

Profilbild

Bogdan Rancea

Bogdan ist Gründungsmitglied von Inspired Mag und hat in diesem Zeitraum fast 6-Jahre Erfahrung gesammelt. In seiner Freizeit studiert er gern klassische Musik und erforscht die bildende Kunst. Er ist auch ziemlich besessen von Fixies. Er besitzt bereits 5.