Interested in this course? Find out if space is available

HTML & CSS (Beginner)

Upcoming Course DatesView full list of courses


Course Description

This course aims to teach you not only how to convert Photoshop web designs into HTML/CSS web pages, but to do so in the most efficient way possible. While the full process from PSD file preparation to website is examined, each part is valuable on it’s own containing design and programming methodologies which are intuitive and effective.

Who Should Attend

This course can benefit:

  • Web Designers
  • Web Developers
  • Web Integrators
  • Freelance workers

Note: A working knowledge of Photoshop CS5, Dreamweaver CS5, HTML and CSS is required. Some Javascript and PHP may be used.

Some brands we’ve taught:


This course provides attendees with a lot of useful information. This course will help you:

  • Prepare a PSD for sale or use by another designer/integrator
  • Prepare a PSD for HTML/CSS conversion efficently
  • Convert a PSD into an HTML/CSS format (without using built in Photoshop conversion functions)



Part 1: What to Keep in Mind

  • Where design and programming meet
  • Conversion retrocausality
  • Images vs. CSS
  • Anticipating growth
  • Fluid vs. fixed

Part 2: Preparation, Optimization and Export

  • Layer selection, naming and grouping
  • Pixel perfect spacing
  • Guides and slices
  • Naming your slices
  • Saving multiple versions
  • Saving for web
  • GIF, JPG or PNG?

Part 3: HTML – Theme Skeleton

  • Preparing your HTML document
  • Planning IDs and classes
  • Good and bad HTML structure and formatting
  • Code validation
  • Entering dummy content

Part 4: CSS – Theme Styles

  • Setting up your canvas
  • Reset stylesheets
  • Using @font-face
  • Converting images to CSS
  • Checking cross-browser compatibility

Part 5: Q&A

  • Questions and Answers

People on this page also looked at these

WordPress for Beginners

Your journey to a blog or basic business website starts here.

Learn more
HTML & CSS (Beginner)

Get up-to-date guidance on how to use these programming languages.

Learn more
WordPress Training (Intermediate)

Get more in-depth with themes, plugins, and other WordPress features.

Learn more
Contact Us

We’d love to hear from you! Get in touch with our friendly team.

Learn more