Design to Code Conversion Workflow

After doing so many design conversion to XHTML / CSS, the workflow has gotten pretty systematic. Here you’ll find the overall structure on how this workflow goes for me and the guys.

  1. Setup
    - Setup folder structure (as according to the standard structure for all sites we do. See the XiD CSS Framework article for more info)
    - Slice the layout comp and store in the images folder
    - Re-save the sliced PSD as a new version in VersionCue
  2. Conversion
    - Setup HTML structure
    - Create the CSS structure and styles
  3. Test in Browsers
  4. Miscellaneous, site wide features
    - Necessary javascript if needed
    - Additional Features of project
  5. IF JOOMLA
    - Convert template
    - Install in system (testing server usually)
    - Style core Joomla output
  6. Final Review
    - Analyze final output
    - Check for validity (w3c HTML and CSS check)
    - Test in Browsers

Comments: 1

  1. Kelly Smith says:

    Thanks. This is helpful.

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>