Learning Webflow (2021)

Course details

If you are a web designer, a UX designer, or a content publisher working on websites or intranet sites, Webflow can be a great tool to know. It empowers you to build professional, responsive, customized sites using a completely visual canvas—no coding required! In this course, web design and development instructor Jen Kramer introduces you to Webflow and all the basics of what you can do with it. Jen steps through creating the initial homepage for a Webflow website and populating it with images and content. She shows you how to style the site’s content, as well as the navbar and footer, then covers how to build an About page and link the navbar to existing pages. Once you have your pages ready, Jen walks you through launching your site and taking the necessary steps to maintain it.

Concepts

0. Introduction

01 - A new kind of content management system

1. Setting Up the Webflow Project

02 - Creating a project and choosing a template
03 - Tour of the Webflow interface
04 - Outlining the home page with elements and layouts
05 - Dropping in the content

2. Styling the Site's Content

06 - Configuring global colors and fonts
07 - Styling the opening hero section and button
08 - Styling the newsletter section with a background image
09 - Challenge - Styling the recent work section
10 - Solution - Styling the recent work section

3. Styling the Navbar and Footer

11 - Adding the logo and modifying the navbar layout
12 - Creating a button in the navbar
13 - Styling the mobile navbar
14 - Configuring the footer layout
15 - Integrating Font Awesome into Webflow
16 - Adding Font Awesome social media icons to the footer
17 - Creating symbols from the header and footer

4. Building the About Page

18 - Adding a new page and adding symbols
19 - Challenge - Finishing the About page
20 - Solution - Finishing the About page
21 - Linking the navbar to existing pages

5. Launching and Maintaining Your Site

22 - Exploring the dashboard and adding a favicon
23 - Publish your Webflow site
24 - Collaborating on page design and editing
25 - Controlling collaborator access to editing

Conclusion

26 - Learn more about no-code

Learning Webflow (2021)

Authors

Jen Kramer