“How to slice your designs like a pro”
From Photoshop to HTML is an amazing E-book that will guide you through the process of converting Photoshop design into HTML and CSS files for a website. in this review you will learn more about the book, what it covers and extras that are included in it.
Overview
Who's this book for:
This E-book is for anyone who has an elementary understanding of HTML and CSS. You should be familiar with HTML tags and the most common CSS properties.
What you'll learn:
- Different methods for slicing a PSD.
- Create semantic mark-up, and learn how this HTML relates to the original PSD.
- How to utilize techniques, such as background replacement and sprite generation.
- Use custom fonts with Cufon font replacement.
- The differences between absolute and relative positioning.
- How to compensate for the dreaded Internet Explorer 6.
- Take advantage of advanced CSS3 features.
- How to take advantage of a variety of helpful browser extensions to expedite your coding.
- Utilize the jQuery library to add a touch of interactivity.
Example Themes, Files and Screencasts in the Book:
- Photoshop files for the Light Box Design and HTML/CSS files for the Light Box theme.
- A series of six screencasts covering the whole project from beginning to end.
Competition:
Our friends from Rockable Press
are giving away 5 free e-books. All you need to do, to enter the
competition is download the sample to continue the following line: "When converting a PSD to HTML and CSS, you'll be most efficient if you have the right..."
Table Of Contents
Coding The HTML
- Coding the HTML
- Creating the Basic Shell
- The Markup
- Markup Complete!
Slicing the PSD
- The Plan
- Photoshop
- The "Save for Web" Pattern
- Best Practices for Image Types
- CSS Sprites
- Revising our HTML
Coding the CSS
- CSS Resets
- What's the Solution?
- DEFAULT.CSS
- General Styles
- Container
- Header
- Styling the Main Banner
- Fahrner's Image Replacement Technique
- What's the Difference Between Absolute and Relative Positioning?
- Main content
- Working Example: Columns
- Here's the Thing about Floats
- The Three Heading
- Blockquote
- CSS Shapes
- Recent Portfolio
- Before
- After
- About Page Header (subpage)
- Home Page Header
- The Body ID Trick
- Work Page
- Contact Page
- Cufon Font Replacement
Compensating for Older Browsers
- Cringe Time
- Tools
- Why is "Having Layout" Necessary?
- Targeting Specific Versions of Internet Explorer
Bonus Chapter: A Splash or jQuery
- The Script
- Decoding the Script
Lubov has been with DMXzone for almost 5 years now, contributing to both Marketing and Content departments. She is bringing high quality content in the form of daily blog updates, reviews, tutorials, news, newsletters,update emails and extensions' manuals. 
