I updated Burlington Footwear‘s website. It was a static website built using HTML and CSS. I created this site when tables were the way to build sites. Over time, I changed the pages to use CSS for more of the layout. The site was becoming a chore to maintain. It was showing its age and needed to be changed. The goals for the web site redesign are update to HTML5, use CSS for layout (no tables) and move to PHP. I found a basic tutorial on how to make a PHP Website From Scratch.

Website Redesign from scratch

I started from scratch with an HTML5 template. I rebuilt the page using CSS and HTML5. The home page is a simple two column design. I reused some of the CSS from the old site with slight modifications. It looks similar to the old site but better. I replaced the images used in the navigation with a CSS Navigation List. The site has less images to download which should help make it load a bit faster on all devices. As mentioned in Front End Performance for Web Designers and Front-End Developers, if you can do it in CSS you should.

Moving to PHP

The next step was changing the HTML page to PHP. The site has several elements that are use on every page. To make maintenance easier, I separated the common elements: Header and Footer into separate include files. I copied my original HTML file and changed it to PHP. I added the include files in the appropriate spots. I tested it on my web server. The page looks exactly like the HTML page.

For the rest of the site, I used the PHP file as my starting point. By using the tutorial as a guide, I was able to achieve the structural and programming goals for the redesign.