Your services do not end when the inspection does
Your services do not end when the inspection does
For the past few years, my website host has been nudging me to upgrade my website code. I designed it in 2020 using a now-obsolete version of PHP. Two weeks ago, I purchased a Claude.ai subscription and decided to put it to the test. I had it redesign and upgrade my website to make it more user-friendly and secure. The final product was 97% written by Claude. Here are my thoughts and lessons from the experience. You can see the new website here and compare it to the legacy version.
I asked Claude the best way to redesign my website. It suggested uploading the entire website so it could understand the site's structure. When I asked how to upload it, Claude told me the files should be compressed (zipped) and then uploaded. I followed its instructions and received an error message that the file format wasn't supported. When I asked in the chat if it could read the file, it responded, "You're absolutely right to call that out—I made an error. I told you that you could upload a ZIP file when ZIP files aren't actually supported. That was incorrect information on my part." Not exactly the smooth start I was hoping for.
After that false start, I uploaded my website files and requested that Claude upgrade them to PHP 8.3 (the latest version) while improving mobile functionality. It did what I asked, but the results fell short of my expectations. While it kept my existing color palette, the styles were inconsistent from page to page. It was like giving a kindergartener six colors and a coloring book, then expecting the sky to always be blue and the roses red.
This first attempt taught me three fundamentals: write better prompts, work in small chunks, and create a style guide.
2. Lesson #1: Better Prompts Return Better Results
The more detailed and specific your prompts are, the better your results will be. I watched several videos on writing effective prompts, and while some examples seemed silly, I could see the potential. One video showed how a detailed prompt could make the AI return a word's definition, origin, and usage example every time you typed just a single word. My first prompt for upgrading my site was about six sentences long. By the second pass, I had expanded it to 1.5 pages with several updates as I worked through the project.
Being specific about what you want—colors, layout, functionality, and crucially, what you don't want—helps the AI understand your requirements and deliver more consistent results.
3. Lesson #2: Work in Small, Manageable Chunks
Working with smaller pieces is essential for producing good results, especially while you're still building the framework you'll use going forward. Instead of tackling an entire website at once, I scaled down to working on single pages, making the job much more manageable. By focusing on one page at a time, I could evaluate what I liked and request changes until I was satisfied.
Sometimes I had to break things down even further. My calendar widget needed to pull our schedule from our family planner. The first calendar looked great but didn't actually display our schedule. After struggling with it, I had Claude create a separate page that only displayed the family planner data. Once I confirmed the schedule was being accessed correctly, I had it build the calendar around that working interface. This approach ensured the calendar was properly populated before integrating it into the main scheduling page.
4. Lesson #3: Maintain Consistency with Style Guides
To keep my webpages looking consistent, I learned I needed to create a style guide. I selected one page with the design and colors I wanted, then asked Claude to create a style guide based on that page. This helped maintain consistency across pages, though it wasn't perfect.
Claude occasionally created new design elements that weren't in the original file. These elements sometimes varied between pages—circled numbers might be blue on one page and purple on another. The style guide reduced inconsistencies significantly and minimized manual fixes, but it didn't eliminate the need for human oversight.
Working in small chunks and making incremental changes proved to be the most effective approach. I also learned it's best to fix issues while working on each individual page rather than waiting until the end. There will always be small adjustments needed on each page, so it's better not to create a mountain of fixes to tackle later.
Overall, using AI to redesign my website was a valuable learning experience. While it required patience and iteration, the final result was a modern, secure website that met my needs—with 97% of the code written by Claude.
Glossary