New or seasoned users…Watch the Webflow Tutorial Videos!

Hey everyone,

I just wanted to point any new or seasoned users to the Webflow University Video Tutorials. I bet you are all thinking, I don’t need that, I already built 10000 sites in webflow. Thats what I thought as well after using Webflow for over 4 months now but there is a ton of useful information in those videos. Some will make your life so much easier and are almost DUH moments.

So for anyone who find themselves asking a lot of questions on here about layout things within webflow or want to learn more about the interface, check out the videos and I bet your answer is in there. I just finished them and I feel like I can create sites in half the time since now I know the tricks along with learning more about CSS and how it is implemented into webflow.

Check it out!

17 Likes

Absolutely agree… Loved the one Sergie did (whole site in 54 minutes). Would be cool if they would roll out more of those one-hour web builds on the basis of introducing new techniques, maybe using more unique or uncommon layouts, & utilizing new widgets that become available as time goes by.

Another tip for newbies to web development such as myself that want to actually peak at the code to understand the html/css below.

  1. It’s built on a responsive framework based off Bootstrap 3.0… There are some good tutorials out there on html/css that also teach by integrating a responsive framework (such as Bootstrap 3.0 or Foundation 5). Use these as a good primer to learning html/css. You might as well jump right into learning responsive frameworks/principles along with your html/css because the need to design for multiple screens is pretty much a necessity & will be for the foreseeable future…

  2. Download Brackets… then install the “Beautify” Extension from within the “Extension Manager” under the file tab. Run that extension (from within the Brackets interface once you open your site in the text editor) on the exported css files to expand the minified code (otherwise you’ll be wondering what kind of gibberish you are looking at…)

You can activate Live Preview to view the site, any changes, etc in real time via chrome. Make sure you have “live preview highlight” switched on within the interface as you click around in the html/css files - this will - you guessed it… highlight the individual html elements as you navigate through the code… helping you better understand how it all is actually working. Simply right click on a selected html element within the code to view/edit the css rules that pertain to a given element. Cool stuff…

5 Likes

Glad you guys are liking the videos. We’ll be rolling out new videos soon, especially full length ones where I build an entire site in Webflow as @Mogeek has suggested. Hold tight for that. A lot of cool things coming to you guys. :slight_smile:

3 Likes

This topic is now pinned. It will appear at the top of its category until it is either unpinned by a moderator, or the Clear Pin button is pressed.

1 Like

Usability request - Lynda.com & YouTube both provide the user with the option to (a) adjust video playback speed - which is super nice way to ‘skim-view’ and (b) Provide video transcript. Can this be done on Vimeo, if not, would it be possible to upload Webflow’s video tutorials to Youtube?
Webflow rocks!

Thanks for the feedback @FutureCompost. We will be improving our tutorials site so that it’s easier to find the content you need.

Update: I’ve since found your superb Gif/text Support Center docs. I thought it’d be your typical soporific software manual. Wrong !! the Gif’s for each and every step, the crisp, clear copy & numerous examples … Even better than watching Lynda.com !!! Kudos to Webflow’s commitment to it’s users & the team that put worked on this.

2 Likes

Thanks @FutureCompost! And guess what, the entire help site is built/hosted in Webflow, so it gives us a lot of flexibility that other cookie-cutter “knowledge base” products just can’t offer. For example, the Styling Sliders page actually has working sliders :smile:

Props to @Mat for putting it all together!

Thanks @FutureCompost! Appreciate the feedback. We understand that Webflow isn’t the easiest tool right out of the box, which is why we really want to give high quality content to help you along the way. Because we know once you really understand Webflow, the possibilities are endless :smile:

And as @callmevlad mentioned, it’s 100% built and maintained in Webflow, making it really easy for me to continue to update/add/edit content based on user feedback and suggestions. It can only get better from here!

Thanks again,

Mat

Great videos. Just finished all of them. Seriously enjoyed it.
Just two small remarks:

  • the video “link settings” seems to be in the wrong position. This video, to me, would make more sense if it was added after the video “Adding Pages”.
  • the sound of the video “Adding a Video” seems mono. At least for this video the sounds only comes out one side, different from all of the other videos.