Webflow Essentials Course from Udemy

Hi, my name is Dan Scott and together, you and I are going to learn Webflow.

Webflow will enable you to create responsive, accessible websites using intuitive design techniques without the need for complex coding.

This course is aimed at people who are new to Webflow and to web design in general.

We will start by creating a simple single page site, learning basic layout techniques and using simple animations.

Webflow software is visual and does not require you to learn coding. You will learn how to ensure your website is consistent across desktop, laptop and mobile devices. We learn about CSS Classes for layout and font styling and also the importance of Class naming conventions.

If you have already tried using Webflow and are now wondering whether you should be using grids, flex, columns or divs and why…do not fear. By the end of this course you will know which to use and why.

We will learn how to build your own portfolio website and we will incorporate some exciting animations too.

Together we will learn to create and style forms and incorporate those into your website.

Some of you may have already started to use Figma or Adobe XD. I will show you how you can convert the files you have created and incorporate them into a Webflow site.

Previous experience using Figma or Adobe XD is not essential when using Webflow.

We will learn about Sticky Navs, SEO’s, Symbols, REM’s, Floats, Gradients and Fonts.

We will create a CMS website and a blog and will learn how to hand over responsibility for these to clients or colleagues, hand over the site so that someone other than you can then login and manage all of the content themselves.

We will look at , create and style an E-Commerce Site, creating and styling Shopping Carts, Order Forms and Shopping Gateways. We will learn how to sell both digital and physical products and services.

If some of the terminology such as Global, Flex, Grid, Nav all sounds too hard - remember we will start from scratch and work through techniques step by step. This course is aimed at anybody who wants to build websites using Webflow.

You may only need to design a single website for yourself, you may want to become a fulltime web designer, you might be a freelancer already and wanting to expand the type of work you are able to offer your clients. This course is for you.

I set assignments throughout this course which will enable you to practice your skills and to use what you create within your very own portfolio.

You are about to go from Website Zero to Webflow Hero.

What's inside

Syllabus

Getting Started

Intro to Webflow Tutorial training course

Getting started with Webflow tutorial

What is Webflow

Traffic lights

Read about what's good

what should give you pause

and possible dealbreakers

Covers CSS classes, naming conventions, and responsive design, which are essential for creating consistent and user-friendly websites across various devices

Explores interactions and animations, enabling designers to add engaging visual elements to their websites and enhance user experience

Teaches how to convert Figma and Adobe XD files into Webflow, streamlining the design-to-development process for designers familiar with these tools

Includes class projects that allow learners to practice their skills and build a portfolio, which is crucial for showcasing their abilities to potential clients

Focuses on an older version of Webflow, so learners should be aware of potential differences in the user interface and features compared to the latest version

Explores e-commerce site creation, including shopping carts and order forms, which is useful for designers looking to build online stores for clients

Reviews summary

Foundational webflow skills for beginners

According to students, this course is an excellent introduction to Webflow, widely praised for its clear, step-by-step teaching method which makes it highly accessible for complete beginners. Learners specifically highlight the value of the practical projects, which effectively reinforce the concepts taught and help build a portfolio. While the course provides a strong foundational understanding, some reviewers note that keeping pace with Webflow's frequent updates can occasionally lead to minor discrepancies in the lessons, and those looking for more advanced techniques may need further study. Overall, it's seen as a highly effective starting point for anyone wanting to learn Webflow.

Strong foundation, less focus on advanced topics.

"Provides an excellent starting point but doesn't dive deep into custom code or advanced integrations."

"This course delivers on its promise of essentials; it's not for intermediate or advanced users."

"If you already know Webflow basics, this might be too repetitive."

"Learned the core workflow, but will need more resources for complex builds."

Hands-on projects reinforce learning effectively.

"The projects were the most valuable part, applying what I learned immediately."

"Building the portfolio site was a great way to solidify my understanding."

"I really appreciated the hands-on exercises and assignments."

"The course provides practical exercises to build real projects."

Instructor explains concepts clearly and patiently.

"Dan is a fantastic instructor, very clear and easy to follow."

"His explanations are concise and break down complex topics well."

"I found the instructor's teaching style engaging and encouraging."

"The lessons are well-structured and the delivery is excellent."

Software updates can cause minor discrepancies.

"Some of the UI elements shown in older videos slightly differed from the current Webflow interface."

"Had to search for minor updates myself because Webflow Studio changed slightly."

"While the principles are timeless, specific menu locations can shift with Webflow updates."

"Keeping the course perfectly in sync with every Webflow change seems challenging."

Activities

Be better prepared before your course. Deepen your understanding during and after it. Supplement your coursework and achieve mastery of the topics covered in Webflow Essentials Course with these activities:

Review Basic HTML and CSS Concepts

Show steps

Strengthen your understanding of HTML and CSS fundamentals to better grasp Webflow's visual interface and underlying code generation.

Browse courses on HTML

Show steps

Review HTML structure and common tags.
Practice CSS selectors, properties, and values.
Build a simple webpage using HTML and CSS.

Reading: Don't Make Me Think, Revisited

Show steps

Learn about web usability principles to create more effective and user-friendly websites with Webflow.

View Don't Make Me Think, Revisited: A Common Sense... on Amazon

Show steps

Read the book, focusing on key usability concepts.
Identify examples of good and bad usability in websites.
Apply usability principles to your Webflow projects.

Recreate a Website Section in Webflow

Show steps

Solidify your Webflow skills by replicating a section from an existing website, focusing on layout, styling, and responsiveness.

Show steps

Choose a section from a website you admire.
Analyze the layout, styles, and responsiveness.
Rebuild the section in Webflow, paying attention to detail.
Compare your version to the original and refine.

Four other activities

Expand to see all activities and additional details

Show all seven activities

Write a Blog Post on Webflow Best Practices

Show steps

Deepen your understanding of Webflow by researching and writing a blog post on best practices for using the platform.

Show steps

Research Webflow best practices and tips.
Outline your blog post with clear headings and subheadings.
Write the blog post, providing examples and explanations.
Edit and proofread your post for clarity and accuracy.

Build a Portfolio Website

Show steps

Showcase your Webflow skills by building a professional portfolio website to display your projects and experience.

Show steps

Plan the structure and content of your portfolio.
Design the layout and visual style in Webflow.
Add your projects and descriptions.
Optimize for different devices and publish your site.

Reading: Refactoring UI

Show steps

Learn about UI design principles to create more visually appealing and professional-looking websites with Webflow.

View Melania on Amazon

Show steps

Read the book, focusing on key UI design concepts.
Identify examples of good and bad UI design in websites.
Apply UI design principles to your Webflow projects.

Follow Advanced Webflow Tutorials

Show steps

Expand your Webflow knowledge by following advanced tutorials on topics like interactions, animations, and CMS integration.

Show steps

Find tutorials on advanced Webflow topics.
Follow the tutorials step-by-step, building the projects.
Experiment with the techniques and adapt them to your own projects.

Career center

Learners who complete Webflow Essentials Course will develop knowledge and skills that may be useful to these careers:

Web Designer

A web designer plans, creates, and codes internet sites and webpages, many of which combine text with sounds, pictures, graphics and video clips. This course helps build a foundation for a career as a web designer by teaching the essentials of Webflow. It is an intuitive design platform that can be used to build responsive and accessible websites without coding. The course is aimed at people who are new to Webflow and to web design in general. Beginning with creating a simple single page site, learning basic layout techniques, and using simple animations, this course prepares a web designer to use Webflow effectively. Learning how to convert files from Figma or Adobe XD is another way that the course helps. The Webflow Essentials course is for anyone who wants to learn how to build websites, and might be particularly helpful for those who want to design a single website for themselves.

See salaries and explore the career path for Web Designer

E-commerce Specialist

An e-commerce specialist manages the online sales and marketing efforts for a business. This course helps build a foundation as an e-commerce specialist by teaching the essentials of Webflow. It is an intuitive design platform that can be used to build responsive and accessible websites without coding. This course teaches how to create and style an E-Commerce Site, creating and styling Shopping Carts, Order Forms and Shopping Gateways. The e-commerce specialist will also learn how to sell both digital and physical products and services. Because they may already use Figma or Adobe XD, they may find it useful to learn how to convert the files they have created and incorporate them into a Webflow site.

See salaries and explore the career path for E-commerce Specialist

Webmaster

A webmaster is responsible for maintaining and managing websites. This course helps build a foundation as a webmaster by teaching the essentials of Webflow. It is an intuitive design platform that can be used to build responsive and accessible websites without coding. The webmaster will learn how to ensure a website is consistent across desktop, laptop and mobile devices, and will learn about CSS Classes for layout and font styling and also the importance of Class naming conventions. Because the webmaster may already use Figma or Adobe XD, they may find it useful to learn how to convert the files they have created and incorporate them into a Webflow site.

See salaries and explore the career path for Webmaster

User Interface Developer

A user interface developer designs and builds the user-facing parts of websites and applications. This course helps build a foundation for a career as a user interface developer by teaching the essentials of Webflow. It is an intuitive design platform that can be used to build responsive and accessible websites without coding. The course is aimed at people who are new to Webflow and to web design in general, who may be interested in being user interface designers. Beginning with creating a simple single page site, learning basic layout techniques, and using simple animations, this course prepares a user interface designer to use Webflow effectively. The course also teaches about Sticky Navs, search engine optimizations, Symbols, relative em size, Floats, Gradients and Fonts.

See salaries and explore the career path for User Interface Developer

UX Designer

A UX designer focuses on the user's experience with a website or application, ensuring it is intuitive and satisfying. This course helps build a foundation for a career as a UX designer by teaching the essentials of Webflow. It is an intuitive design platform that can be used to build responsive and accessible websites without coding. The course is aimed at people who are new to Webflow and to web design in general. Learning how to convert files from Figma or Adobe XD is another way that the course helps a UX designer. The course may be especially helpful for someone who wishes to build websites using Webflow, and who may only need to design a single website for themselves.

See salaries and explore the career path for UX Designer

Web Project Manager

A web project manager oversees the planning, implementation, and tracking of web projects. This course helps build a foundation as a web project manager by teaching the essentials of Webflow. It is an intuitive design platform that can be used to build responsive and accessible websites without coding. The web project manager will learn how to ensure a website is consistent across desktop, laptop and mobile devices, and will learn about CSS Classes for layout and font styling and also the importance of Class naming conventions. The course teaches how to create a CMS website and a blog and will learn how to hand over responsibility for these to clients or colleagues.

See salaries and explore the career path for Web Project Manager

Front-End Engineer

A front end engineer implements visual elements that users see and interact with in a web application. This course may be useful to a front end engineer because it teaches the essentials of Webflow. It may be especially useful because it emphasizes creating responsive, accessible websites using intuitive design techniques without coding. Specifically, the course may help a front end engineer learn CSS Classes for layout and font styling and also the importance of Class naming conventions. Front end engineers who have already started to use Figma or Adobe XD may find the information on how to convert the files useful. A front end engineer may find the course helpful because it teaches how to style forms and incorporate those into a website, as well as how to create an e-commerce site.

See salaries and explore the career path for Front-End Engineer

Web Content Manager

A web content manager is responsible for managing and updating content on websites. This course may be useful to a web content manager because it teaches the essentials of Webflow. It may be especially useful because it emphasizes creating responsive, accessible websites using intuitive design techniques without coding. A web content manager may find it helps them to create a CMS website and a blog. As a web content manager, a person will learn how to hand over responsibility for these to clients or colleagues, so they can then login and manage all of the content themselves. This course may be helpful for a person who wants to design a website.

See salaries and explore the career path for Web Content Manager

Freelance Web Developer

A freelance web developer designs, codes, and improves websites for clients. This course may be useful to a freelance web developer because it teaches the essentials of Webflow. It may be especially useful because it emphasizes creating responsive, accessible websites using intuitive design techniques without coding. Through taking this course, a freelance web developer will learn CSS Classes for layout and font styling and also the importance of Class naming conventions. This course may be helpful for a freelancer who wants to expand the type of work they are able to offer their clients. In particular, the e-commerce styling will be quite useful. A freelance web developer may find the course helpful because it teaches how to hand over responsibility for a site to the client after development.

See salaries and explore the career path for Freelance Web Developer

Web Application Developer

A web application developer designs, builds, and maintains web applications, focusing on functionality and performance. This course may be useful to a web application developer because it teaches the essentials of Webflow. It may be especially useful because it emphasizes creating responsive, accessible websites using intuitive design techniques without coding. A web application developer may find the course helpful because it teaches how to style forms and incorporate those into a website, as well as how to create an e-commerce site, creating and styling Shopping Carts, Order Forms and Shopping Gateways. This course may be particularly useful for web application developers who may want to design a single website for themselves.

See salaries and explore the career path for Web Application Developer

Digital Marketing Specialist

A digital marketing specialist develops and implements marketing campaigns across digital channels. This course helps build a foundation as a digital marketing specialist by teaching the essentials of Webflow. It is an intuitive design platform that can be used to build responsive and accessible websites without coding, which may be helpful when creating marketing campaigns. A digital marketing specialist can learn how to hand over responsibility for a CMS website and a blog to clients or colleagues, so that someone other than them can login and manage all of the content themselves. Because the digital marketing specialist may already use Figma or Adobe XD, they may find it useful to learn how to convert the files they have created and incorporate them into a Webflow site.

See salaries and explore the career path for Digital Marketing Specialist

SEO Specialist

A search engine optimization specialist improves website visibility in search engine results. This course may be useful to an search engine optimization specialist because it teaches the essentials of Webflow. It may be especially useful because it emphasizes creating responsive, accessible websites, and teaches about search engine optimizations. The SEO specialist will learn how to create a CMS website and a blog and will learn how to hand over responsibility for these to clients or colleagues, so that someone other than you can then login and manage all of the content themselves. Learning how to convert files from Figma or Adobe XD is another way that this course may be useful.

See salaries and explore the career path for SEO Specialist

Digital Content Producer

A digital content producer creates and manages digital content for various platforms. This course may be useful to a digital content producer because it teaches the essentials of Webflow. It may be especially useful because it emphasizes creating responsive, accessible websites using intuitive design techniques without coding. Because a digital content producer may already use Figma or Adobe XD, they may find it useful to learn how to convert the files they have created and incorporate them into a Webflow site. The course teaches how to create a CMS website and a blog and will learn how to hand over responsibility for these to clients or colleagues, so that someone other than you can then login and manage all of the content themselves.

See salaries and explore the career path for Digital Content Producer

Content Strategist

A content strategist plans and oversees the creation, publication, and governance of useful, usable content. This course may be useful to a content strategist because it teaches the essentials of Webflow. It may be especially useful because it emphasizes creating responsive, accessible websites using intuitive design techniques without coding. Because a content strategist may already use Figma or Adobe XD, they may find it useful to learn how to convert the files they have created and incorporate them into a Webflow site. The course teaches how to create a CMS website and a blog and will learn how to hand over responsibility for these to clients or colleagues. The content strategist will then be able to manage all of the content themselves.

See salaries and explore the career path for Content Strategist

Online Marketing Manager

An online marketing manager plans and executes online marketing campaigns to promote products or services. This course may be useful to a online marketing manager because it teaches the essentials of Webflow. It may be especially useful because it emphasizes creating responsive, accessible websites using intuitive design techniques without coding. Understanding webflow can help one build landing pages, marketing sites, and e-commerce components for an organization. The online marketing manager will learn how to sell both digital and physical products and services. This course may be especially helpful for someone who wants to design a single website for themselves, such as a landing page for a campaign.

See salaries and explore the career path for Online Marketing Manager

Webflow Essentials Course

What's inside

Syllabus

Traffic lights

Save this course

Reviews summary

Foundational webflow skills for beginners

Activities

Career center

Reading list

Share

Similar courses