November 25, 2014

Google “Mobile-friendly” label in Search Results

In this lesson we learn how to have Google’s new “Mobile-friendly” label appear next to our websites in search results. We perform a complete “mobile makeover” on an outdated desktop website in order to practice key concepts. Demo site from video Zip Download of demo files

November 25, 2014

Photo Gallery with Modal Window Tutorial

In this lesson we learn how to create a photo gallery with a neatly aligned grid for thumbnails. When a thumbnail is clicked / tapped a modal windows (lightbox) will be opened with a higher resolution version of the photo. This lesson is a snippet from my 8 hour web design course. Learn more about […]

October 21, 2014

Sass Tutorial for Beginners

This Sass tutorial is for absolute beginners or anyone who has been intimidated by preprocessors in the past. We cover the basic features of Sass and even write two mixins by hand (gradients and media queries). This lesson is a snippet from my 8 hour web design course. Learn more about the course and how […]

October 21, 2014

WordPress Custom Loop WP_Query Tutorial

Learn about WP_Query and create custom loops in any WordPress theme file. To learn about everything that WP_Query is capable of check out the official WordPress documentation. Link to download .zip of theme files as shown in this video (note: this is not a “complete” WordPress theme yet and this download is only intended for […]

October 21, 2014

CSS Background Image Tutorial

Learn how to add background images with CSS (repeat or tile, position, size, and multiple images assigned to a single element). This lesson is a snippet from my 8 hour web design course. Learn more about the course and how to save 50% off the list price.

October 4, 2014

WordPress Setup Custom (Static) Homepage

Learn how to setup a custom (or static) homepage in WordPress. This involves creating WP pages, adjusting a few simple settings, and using a special page template. Link to download .zip of theme files as shown in this video (note: this is not a “complete” WordPress theme yet and this download is only intended for […]

October 4, 2014

WordPress Widgets Tutorial

Learn how to manage widgets in the WordPress admin area, and also how to add widget locations to any theme. Link to download .zip of theme files as shown in this video (note: this is not a “complete” WordPress theme yet and this download is only intended for educational purposes to dissect and review). View […]

October 4, 2014

WordPress Post Formats Tutorial

Learn what Post Formats are, what they are used for, and how to enable them within a theme. In this lesson we create unique presentations for an aside, a link, and a photo gallery. Link to download .zip of theme files as shown in this video (note: this is not a “complete” WordPress theme yet […]

June 23, 2014

Redesign

This website has been redesigned as an effort to organize and showcase content so that it’s easier for students to find and follow a particular topic. This primarily involved redesigning the homepage. For quick reference here are the topic landing pages: Learn HTML Learn CSS Learn JavaScript Learn WordPress This redesign also marks a new […]

June 19, 2014

Bootstrap Responsive Layout Tutorial

In this lesson we learn how the Bootstrap column grid system makes creating responsive layouts incredibly simple. We also put together a responsive navigation menu, and finally, learn about Bootstrap’s “responsive utility classes” which we can use to hide and display certain content for certain viewport sizes. Responsive Web Design principles are easy to implement […]