15 Helpful Web Design Lessons You Can Learn from YouTube

By . Filed in Web Design

Whether you’re a professional or a newbie designer, continuously learning and perfecting your skills will help you become an even better one. Being a designer is more than just about designing business cards and website templates, because you need to stay up-to-date with the rapidly growing market and work on mastering your technique.

Perfection is not a destination; it is a continuous journey.” – Brian Tracy

Video is one of the greatest ways to learn something, as it’s a great visual method to see the accomplished results right away. A well-done video tutorial can give you some new ideas on how to do something you don’t know or learn great first-hand tips from professionals, most of the time for free!

Today I’d like to bring to your attention to 15 really helpful web design lessons you can find on YouTube, created by other design enthusiasts.

How to Create a Website in Flat Design Style by DesignModo

In this DesignModo tutorial, you’ll get to learn how to create a website in Photoshop using flat UI elements. The video is highly detailed, so even newbies can easily create a website with this guide.

Create Flat UI Design Style Website Now With This Step By Step Tutorial! by 1stwebdesigner

Create a cool flat portfolio website design with this video manual. It shows the viewer how to create a site according to the sections, such as header, services and footer, among others. Also, you’ll be able to create a grid-shaped portfolio block with horizontal scrolling.

Shazam Website Re-Design · Flat UI Design by Aaron Linley

This video tutorial is a sped-up version of a Shazam website redesign that incorporates flat UI design. Great for those who would like to see the process in action.

Photoshop Tutorials for Beginners – Step By Step Create Flat Login Form by Dropcolors Studio

If you do choose to go the flat design route, you’ll need to streamline your whole website to complement each other. This step-by-step YouTube guide gives you the foundation needed for creating a simple flat login form.

CSS3 Full Screen Background Image – Dreamweaver CS6 Tutorial by tutvid

This video is a tutorial on how to create a fullscreen background image for your website using CSS and CSS3. A handy guide that gives you the option of two techniques.

HTML5 Basics – HTML/CSS Part 1 of 2 by Ralph Phillips

This is the first part of two videos about the basics of HTML. It acts as a great starting point as it leads you through the essentials of the HTML5 language and the programs you should use.

Responsive Web Design Tutorial and Explanation by LearnWebCode

Not quite sure about responsive web design but itching to learn more? This is one of the best explanations on the topic and is also a quick tutorial on creating your own responsive website.

Converting a PSD to HTML & CSS – Part 1/3 by JE Tuts

If you want to learn how to convert a Photoshop file into a HTML and CSS format then this is the video for you! The first in a series of three videos, this provides details on image compression types.

Graphic Design Tutorial: Web design, creative side by Shawn Barry

The web is filled with all sorts of different tutorials on how to create a webpage layout. This is a great guide for anyone as it contains handy tips and tricks framed into a helpful and informative video.

How to Build a HTML5 Single Page Application by Infragistics

This is a perfect video showing the ins and outs of Single Page Applications. It covers Web app, Model-View-Controller, MVVM and Knockout.js.

How To Make a WordPress Website- AMAZING! by Tyler Moore

This is an entertaining and useful guide on how to create a simple blog style WordPress site that’s also “super mobile friendly”. The main principles and tricks of WordPress are highlighted here.

Create a Responsive Website Using HTML5 and CSS3 by 1stwebdesigner

With this guide, you can create a responsive website from scratch using HTML5/CSS3. It’s a bit long as it lasts for more than an hour but it is extremely comprehensive.

Web Design (#Photoshop CS5) by CreativeStation

This expedited video lesson lasts for just 3 minutes. It is great for those who want a quick tutorial on how to create an awesome modern website design with flat style and an image slider in the header.

Parallax Scrolling in an Easy Way by Kenneth von Rauch

Whatever your feelings about it, parallax scrolling is a unique tool to have when browsing through a website. Watch this video tutorial to understand how you can enable this on your own website with ease.

HTML Website Design Tutorials For Beginners by EdzJohnson

Even though these videos were made back in 2009, they’re still useful for learning the basics of HTML and designing your very first website. The set contains 6 video lessons about colors, fonts, backgrounds, images and layouts, links and menu bars, and also how to get your website up and running online.

Author:

Nancy is a passionate freelance writer and blogger. She writes tons of inspirational articles on photography and web design, despite the fact that she is an economist by education. She enjoys reading, learning SEO and also losing her mind to French movies.

Advertisement