FREELessons: 22Length: 3.1 hours
In this course we'll take the PSD design from Craig Campbell's Mastering Flat Design course, and convert it into a fully functional HTML/CSS web page. If you want to learn about the design process then check out Craig's course, but if you're more interested in how to turn a flat design into HTML, let's get started!
1.Welcome
1.1Introduction01:37
1.1
Introduction
01:37
1.2The Starting Files04:40
1.2
The Starting Files
04:40
1.3Exporting Images11:27
1.3
Exporting Images
11:27
2.Building the HTML
2.1Building the Header10:55
2.1
Building the Header
10:55
2.2Building the Content Slider14:15
2.2
Building the Content Slider
14:15
2.3Building the Feature Services07:49
2.3
Building the Feature Services
07:49
2.4Building the Footer08:29
2.4
Building the Footer
08:29
3.Styling the Header
3.1Normalizing Your Styles03:44
3.1
Normalizing Your Styles
03:44
3.2Font Selection05:20
3.2
Font Selection
05:20
3.3Styling the Title Text05:37
3.3
Styling the Title Text
05:37
3.4Styling the Main Menu14:49
3.4
Styling the Main Menu
14:49
3.5Coloring the Menu Items05:14
3.5
Coloring the Menu Items
05:14
3.6Styling the Menu Text07:54
3.6
Styling the Menu Text
07:54
3.7Animated Hover Effects06:36
3.7
Animated Hover Effects
06:36
3.8Styling the Dividers11:07
3.8
Styling the Dividers
11:07
4.Styling the Main Content
4.1Slider Navigation16:06
4.1
Slider Navigation
16:06
4.2Slider Content15:01
4.2
Slider Content
15:01
4.3Feature Services13:18
4.3
Feature Services
13:18
4.4Three-Column Setup07:14
4.4
Three-Column Setup
07:14
4.5Lists and Icons06:38
4.5
Lists and Icons
06:38
4.6Styling the Subscribe Form08:21
4.6
Styling the Subscribe Form
08:21
5.Finishing Up
5.1Final Thoughts01:59
5.1
Final Thoughts
01:59
