skip main menu

CSS Conversions

Gardner Information Design, Inc. offers services for conversion to standards-based XHTML and Cascading Style Sheets (CSS).

> Next Project Sample

Case Study: CSS Conversion

During Fall 2007, GIDI Principal P.J. Gardner performed a website conversion for Broadleaf Services, Inc.. The client's goals were to improve their ability to maintain their own web site and to improve their search rankings.

P.J. Gardner converted the site from a fixed, table-based layout to flexible fonts and a fluid page design, ensuring strict adherence to web standards and retaining the existing visual design.

Broadleaf Services

The goal for this project was to give the customer the ability to control and maintain their website content without being dependent on their previous offshore web development company.

On this project, P.J. Gardner converted the Broadleaf Services web site from an unnecessarily complex design written in PHP and a proprietary content management system to clean, standards-based XHTML, controlled entirely by the cascading style sheet.

The result was obtained without significantly altering the visual design, other than to update content and add new CSS menus.

Broadleaf Services AFTER (large image in a new window). Broadleaf Services BEFORE (large image in a new window)

Compare the revision (on the left) with the original (on the right):

Note: The Broadleaf Services web site has since been redesigned using WordPress. The examples on this page no longer match the current version of the Broadleaf web site.

Required Skills

Skills employed on the Broadleaf Services CSS conversion project included:

  • Extracting the code from the database of the content management system.
  • Deconstructing the PHP code of the original site.
  • Rebuilding the entire site as a fluid page design without layout tables.
  • Reconstructing the look and feel of the site with cascading style sheets.
  • Defining text sizes that can be controlled by the user.
  • Creating new CSS drop-down menus.
  • Revising content through collaborative communication.
  • Testing the site across the browsers defined by the customer (Internet Explorer and Firefox).

^ Top

> Next Project Sample