Pluralsight – Generating HTML5 Layouts Using Photoshop
Authored by: Peter Shaw | Duration: 53m | Level: Intermediate | 4/10/2013 | ISO | 149 MB
A short introduction that takes the viewer from a graphic asset created using Photoshop, and shows them how to slice it up and produce an HTML5 ready, reusable asset that can be included in any web project.
Contents:
Using the Photoshop Slice Tool 00:22:38
Introduction 01:02
Assumptions 01:13
Software 01:04
A first look at the slice tool 03:26
A better way of dividing slices 02:11
Re-joining unwanted slices 02:46
Setting slice options 04:23
Creating the output 04:29
A quick look at the output produced 00:51
Summary 01:13
Working with HTML5 Layout 00:30:35
Introduction 01:18
Remembering what got produced 02:25
What is HTML5 01:00
Intro to semantics 01:16
The new HTML5 tags 02:48
HTML5 Document Structure 00:52
CSS3 Changes 01:41
Analizing the document produced by Photoshop 02:02
Tidying the HTML (round 1) 01:55
Tidying the HTML (round 2) 03:13
Refactoring the CSS 01:18
Nth Child Selectors 03:28
Continuing with the CSS tidying 02:29
Fixing up the parent container and text area 02:11
Reviewing what we just did 01:15
Summary 01:24
.
Download
Mirror