Document Preparation And Page Header (Photoshop)

In this first lesson we’ll get started on the Photoshop design and build our page header.

1.Welcome
1 lesson, 02:00

Free Preview
1.1
Introduction
02:00

2.The Photoshop Design
4 lessons, 49:44

Free Preview
2.1
Document Preparation And Page Header (Photoshop)
11:31

2.2
Sign-up Form (Photoshop)
13:49

2.3
Content Background And Progress Bar
11:56

2.4
Freebie Section And Footer (Photoshop)
12:28

3.The HTML
3 lessons, 24:35

3.1
Document Preparation And Page Header (HTML)
08:24

3.2
Sign-up Form And Progress Bar
07:21

3.3
Freebie Section And Footer (HTML)
08:50

4.The CSS
6 lessons, 1:09:31

4.1
Reset, LESS Variables And Mixins, Icon Fonts
15:17

4.2
Typography And General Styling
11:19

4.3
Photoshop Images And Header
08:43

4.4
Sign-up Form (CSS)
13:46

4.5
Freebie And Contact Area
11:35

4.6
Footer
08:51

5.The Javascript
4 lessons, 53:34

5.1
Progress Bar Implementation Using Jquery UI
14:12

5.2
Progress Bar Styling - Part 1
12:01

5.3
Progress Bar Styling - Part 2
13:22

5.4
Back To Top Button And Form Placeholder Compatibility For Non-webkit Browsers
13:59

6.Finishing Touches
2 lessons, 15:57

6.1
Adaptive fluid layout
10:55

6.2
IE8 Fixes And A Way To "prettify" The Generated CSS Code
05:02

7.Conclusion
1 lesson, 00:48

7.1
Conclusion
00:48

8.Bonus
1 lesson, 23:11

8.1
Timelapse Video Showing The Full Wireframing And Design Process
23:11


Photoshop, HTML, CSS? Yep, that's what I do best. Mix that with lots of head nodding from trance music and you've got me in a nutshell.
+ Expand Bio- Collapse Bio