Webflow: Create A Website Landing Page To Collect Emails
4.6 (10 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
1,840 students enrolled
Wishlisted Wishlist

Please confirm that you want to add Webflow: Create A Website Landing Page To Collect Emails to your Wishlist.

Add to Wishlist

Webflow: Create A Website Landing Page To Collect Emails

Learn how to create a responsive landing page from scratch, without any code, and start collecting emails with Mailchimp
4.6 (10 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
1,840 students enrolled
Created by Edvin Lynch
Last updated 12/2014
English
Learn Fest Sale
Current price: $10 Original price: $20 Discount: 50% off
2 days left at this price!
30-Day Money-Back Guarantee
Includes:
  • 1.5 hours on-demand video
  • 2 Articles
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
  • Create your own landing page that converts visitors into email signups
  • Create a email signup and private messaging form to collect visitors emails
View Curriculum
Requirements
  • Create a Free 14 Days Webflow Account
  • Internet Connection
Description

Join Over 1,500+ Students Who Are Creating Their Own Website Landing Pages!


In this course you will learn how to create a Website Landing Page that you can use to convert visitors into emails and get newsletter signups.

  • Showcase a Featured Video or Course with a Slideshow
  • Social Networks Buttons for your visitors to easily connect with you
  • Testimonials to give Social Proof for your content
  • 4 Key Features that encapsulates your website
  • Mailchimp Newsletter Signup Integration
  • Customized Contact Form to receive messages via email
  • In-Page Linking & Animations that bring life to your website

At the end of this course you will be able to build all of this without writing a single bit of code!


Raving Reviews From Udemy Students:

"If you are looking to create a landing page, webflow is the best place to do it and this course will show you exactly how to do it!" – Strife Lim

"Edvin Lynch is a master teacher. He knows how to really show you how to arm a website in a snap, using the right tool." – Francisco Urosa

You should take this course if you're doing web design work for a client, family member, friend, or if you're starting your own business, perhaps an online teaching career and you want students to subscribe your own email list!

This course is Learn-By-Doing so you'll follow along with me throughout the course as I show you how to build the website and I'll explain all the tools, functions and design concepts as I go.

The process will be broken down into baby-steps, so each lecture will be really focused on one specific part, and I shall explain how that part fits in with the rest of the site so that you not only learn how to exactly replicate what I'm showing you, but you will be able to use your own creativity to create something unique, and I encourage it.

When you enroll to this course you will receive announcements whenever I add new lectures and content, so there will always be something new for you to learn!

Who is the target audience?
  • Perfect for anyone who wants to start their own business
  • Perfect for Freelancing Designers
Students Who Viewed This Course Also Viewed
Curriculum For This Course
Expand All 22 Lectures Collapse All 22 Lectures 01:40:12
+
Getting Started
2 Lectures 10:13

TOP PANEL (LEFT TO RIGHT)

  • Webflow Dashboard Button
    • Brings you back to the backend settings for your site.
  • Page Indicator
    • Tells you which page you're currently on.
  • Preview Mode (⇧⌘P)
    • Toggle preview On/Off
  • Viewport Mode
    • Desktop (1), Tablet - Portrait (2), Phone - Landscape (3), Phone - Portrait (4)
  • Undo (

    ⌘Z)

    / Redo (</b>

    ⇧⌘Z)

  • Export Code
    • Once your site is ready you can export your code as finalized HTML/CSS
  • Publish Site
    • This will publish your site onto the web with the designated URL or Custom URL

TOOLS (RIGHT) PANEL

  • Styling Panel (S)
    • Classes, States, Position, Typography, Background, Border, Shadows, Effects
  • Settings (D)
    • ID for in-page linking, Visibility, Element & Custom Attributes
  • Navigator (F)
    • Expand/Collapse All Elements, Layers, Items
  • Style Manager (G)
    • All Styles (classes) used, Clean Up Styles
  • Assets (H)
    • Symbols, Interactions

LEFT PANEL

  • Add Elements (A)
    • Layout, Basic, Typography, Media, Forms, Widgets
  • Pages (P)
    • Add/Edit/Copy/Delete Pages, In-page SEO (Title, Description, Keywords)
  • View Modes
    • Hide Element Edges (⇧⌘E)
    • Hide Empty Elements
    • Show Grid Overlay (⇧⌘G)
    • Enable X-Ray Mode (⇧⌘X)
  • Help
    • Help Center
    • Video Tutorials
    • Forums
    • FAQs
    • Keyboard Shortcuts
    • Contact Us

BOTTOM PANEL

  • Cascading Layers
    • See Nested Elements/Layers
  • Duplicate Element
  • Delete Element
Preview 09:14
+
Hero Section
6 Lectures 22:26

Create Blue–Purple Background

We'll be using the Navbar Widget to create our mobile ready navbar

And adding a tagline next to our logo

and nav buttons for

  • About
  • Courses
  • Contact

Making the buttons interactive with Opacity change

Completed with a sexy white border on the bottom

Create the Navbar
02:37

Navbar Continued
04:41

A slider of the featured courses

H1 main course title

Nav button below

Embedded youtube/vimeo video

Hero Section
02:52

A 4 column strip with the links to your top Social Networks

Hover state's with the Brand HEX colors

  • Facebook #3B5998
  • Google #d34836
  • Twitter #4099FF
  • YouTube #e52d27
Hero part 2
03:52

White Multi-column strip with Gray logo'

Call-to-Action & Hero Slider
03:36

2 Columns

Blocks 470px

Image

Text flushed left

Price tag + Enroll Link

H1 Title

Paragraph

Finalizing Hero Section
04:48
+
Social Network Section
2 Lectures 08:13

Icon at the top of the section

You Can Teach Others! H1 Title

Subtitle

Line Break

Large Image

Section Body Title

Body Paragraph

6 Service Features

Let's Get Started CTA Button

Social Section
01:48

Blue–Purple Gradient

Icon

Our Favorite Courses H1 Title

Subtitle

Line Break

Social Buttons
06:25
+
Testimonials Section
3 Lectures 11:42

Slider section

Our Students Say H1 Title

Line Break

Photo

Paragraph

Credit

Testimonials Section
02:10

Follow our newsletter H1 Title

3 Column

Facebook Like-box

Twitter Widget

RSS Feed

Adding Testimonial Slider
06:58

Line Break Graphic Element
02:34
+
Key Features Section
2 Lectures 12:47

Icon and the top of the section

We Can Teach You! H1 Title

Subtitle

Line Break

4 Column Features

Text title

Text paragraph

View All Courses Button

About Us Section
04:39

Key features content
08:08
+
Newsletter Signup / Contact Form
5 Lectures 33:20

Section Icon

Let's Stay In Touch H1 Title

Mailchimp Newsletter Title

Line Break

Form

Message Us Title

Line Break

Message Form

Download Flyer CTA

Social Sharing Buttons

Creating The Contact Section
03:21

Contact Form Section
07:26

Message Us Form
08:01

Button Interactions
06:00

Adding In-page linking
08:32
+
Conclusion
2 Lectures 00:59
Wrap Up
00:47

Make the knowledge stick!

Pop Quiz
2 questions

Upcoming Lectures!
00:12
About the Instructor
Edvin Lynch
4.2 Average rating
580 Reviews
28,807 Students
6 Courses
UX Design Mentor

I've been doing UI/UX design, business development, digital marketing, and instructional videos for entrepreneurs, startups, and Fortune 500 companies in Silicon Valley and Silicon Beach, and I've been featured in .NET Magazine & MIX Magazine. I'm also an entrepreneur and started my own design agency (LLC Agency) in 2012, based in Los Angeles and Hollywood.

Some of the companies I've worked with include Google, Facebook, Red Bull, and I've taught large design agencies how to design more efficiently as teams.

Here on Udemy, I share all my expertise and insights in Design, Development, and Marketing, that took me years to gain during my career.

I'm also a DJ/Producer since 2007, working with Ableton and producing Electronic Dance Music. Checkout my SoundCloud link below! Let me know if you want to learn about Ableton or music production.