Was ist Framer?

Framer ist ein Tool, mit welchem man ohne grosse Kenntnisse von Design, HTML und CSS auf eine einfache und intuitive Weise in kurzer Zeit eine sehr ansprechende Webseite erstellen kann. Wir selber nutzen Framer für unsere Firmenwebseite. Denn alles was du gerade vor dir hast, ist mit Framer erstellt.

Einfacher Aufbau

Der Aufbau von Framer ist intuitiv und effizient strukturiert. Die Pages bietet eine klare Übersicht über alle Seiten deiner Website und ermöglicht deren einfache Verlinkung. Im Canvas, dem zentralen Arbeitsbereich, gestaltest du deine Inhalte mithilfe von Layers, die alle visuellen Elemente wie Texte, Bilder und Buttons darstellen.

Um dein Layout zu strukturieren, nutzt du Sections und Stacks. Sections unterteilen den Inhalt in logische Abschnitte wie Header, Hauptinhalt oder Footer. Stacks sorgen dafür, dass Elemente automatisch und responsive angeordnet werden.

Framer bietet zudem eine umfangreiche Academy, über welche du dich sehr schnell mit den verschiedenen Konzepten vertraut machen kannst und zu vielen Themen weitere Informationen findest.

Verschiedene Templates

Der Einstieg in Framer ist einfach, denn du kannst aus einer Vielzahl an Templates wählen. Diese Vorlagen bieten bereits fertige Layouts und Designs für verschiedene Anforderungen. Templates sind voll anpassbar, sodass du jedes Element ändern oder ergänzen kannst. Das Template für unsere Seite haben wir auf dem Framer Marketplace gefunden und danach nach unseren Wünschen angepasst. Bei der Auswahl des Templates empfiehlt es sich, bereits darauf zu achten, dass das Design responsive ist und am Ende auf allen Geräten etwas hermacht.

Responsive Design

In der Assets-Verwaltung lädst du Medien wie Bilder, Videos oder Fonts hoch und bindest sie direkt in dein Design ein. Mit Components kannst du wiederverwendbare Elemente erstellen, um Konsistenz zu gewährleisten. Die Styles-Verwaltung ermöglicht es dir, globale Einstellungen für Farben, Schriftarten und Effekte festzulegen.

Styles, Responsiveness und Effects gehören zu den Design-Basics in Framer. Farben, Abstände und Schriftarten lassen sich zentral verwalten, während Breakpoints dafür sorgen, dass dein Layout auf allen Geräten optimal dargestellt wird. Animationen und Hover-Effekte können hinzugefügt werden, um Interaktionen lebendiger zu gestalten.

Ganz praktisch hat sich für uns auch die Tatsache erwiesen, das der Arbeitsbereich in Framer von Anfang an drei verschiedene Displaygrössen abbildet: Desktop, Tablet und Phone. So können wir nicht nur das Design sehr bequem responsive umsetzen sondern auch den Content für bestimmte Gerätedimensionen zuschneiden.

CMS für Blogs

Ein besonderes Highlight von Framer ist sein Content Management System (CMS). Das CMS von Framer erlaubt es dir, dynamische Inhalte wie Blogposts, Produktseiten oder Teamprofile zu erstellen und zentral zu verwalten. Durch das CMS kannst du Inhalte jederzeit aktualisieren, ohne das Design zu verändern.

In unserem Fall haben wir den vorliegenden Blog mit den CMS Funktionalitäten von Framer realisiert. Für neue Post fügen wir in Zukunft einfach einen neuen Einträge im CMS hinzu und Framer kümmert sich um den Rest.

Was kostet uns das?

Framer bietet integriertes Hosting, wodurch du deine Website direkt aus dem Editor heraus veröffentlichen kannst. Framer hostet die Seiten auf schnellen, sicheren Servern und sorgt dafür, dass die Website jederzeit reibungslos läuft.

Es gibt eine kostenlose Basisversion, die für kleine Projekte ideal ist. Wir verwenden aber aktuell den Mini Plan für CHF 4.00 im Monat. Dieser Plan bietet ausser zwei Seiten und einer eigenen Domain nicht viel mehr, aktuell deckt er aber alle unsere Bedürfnisse ab.

Im Vergleich zu anderen Anbietern wie Webflow, Wix oder Squarespace reiht sicht Framer kostentechnisch mit seinem Angebot ungefähr im Mittelfeld ein.

Fazit

Framer ist ein vielseitiges und benutzerfreundliches Tool, das sich für uns bestens eignet, um schnell und professionell eine Websites zu erstellen. Durch den klaren Aufbau, die Flexibilität bei der Gestaltung und das integrierte Hosting nimmt uns Framer einiges an unnötiger Arbeit ab.

Aus unserer Sicht ist Framer gerade für kleine und mittelgrosse Webseiten sehr interessant. Zudem haben wir damit auch einen Weg gefunden, ohne viel Aufwand für Design und Styling eine ansprechende Seite für unsere Besucher zu bauen.