Your services do not end when the inspection does

Reflections on Using AI to Redesign My Website, Part 2

This article continues my reflections on using Claude.ai to redesign and upgrade my website. The first article covered three main lessons. This installment may be more technical and offers possible practical tactics that could improve efficiency and results—tactics I'm hoping to test and refine in future projects.

AI website redesign comparison
Website Before and After AI Redesign

1. Improving Your Prompts

One of the most useful techniques I discovered is having the AI review and critique your instructions before you begin. It will identify vague wording, undefined parameters, and issues you might not have considered. A well-crafted prompt produces better results and reduces the need for extensive revisions later. I've found that having Claude critique my prompts has helped me think more clearly about my desired outcome, which is especially valuable when creating instructions I'll use repeatedly.

2. Reducing Chat Length

While creating the website, I worked in phases, typically having Claude fix one or two items per page with each iteration. As I progressed through my changes, I occasionally hit the maximum chat length limit. Poor prompting contributed to this problem, but another culprit was Claude's tendency to provide verbose summaries of all changes. By instructing it to skip the summaries, I managed to extend my chat sessions slightly.

3. Controlling Content Generation

When creating new sections on pages, Claude naturally wanted to fill them with content. While this content wasn't hallucinated, it often exaggerated phrasing likely found on other home inspection websites. For example, statements like "in my 500 inspections this year, the most common issues I have seen are…" might apply to some inspectors, especially those working with cookie-cutter homes, but they didn't reflect my actual experience.

To address this, I restricted all new content to placeholders. If Claude couldn't find appropriate content on my existing site, I had it insert "XXXXXXXX" instead. This made my final editing much easier—I still reviewed every line, but I could quickly locate areas needing new original content.

4. Ensuring Changes Take Place

Several times Claude indicated it was making changes that I couldn't actually see in the output. I suspect there may be internal version control inconsistencies at times. After several revisions on some pages, it would report that fixes were complete, but when I uploaded the new files, the changes weren't there. Sometimes I couldn't even find the modifications when reviewing the code.

I discovered that asking Claude to verify it was working on the same file displayed on screen often resolved the issue—suddenly the displayed file would update with the actual fixes. Requesting that it re-render or repost the file produced similar results.

5. Working With AI Behavior

Claude consistently wanted to create a separate style sheet for each webpage, which isn't the most efficient practice or industry standard. Initially, I tried to enforce the use of one master style sheet, but this resulted in long, messy code that caused issues later. Eventually, I let it work its own way, though I suspect this behavior might be remedied by adding new files and replacing updated files into the Project Knowledge after each page is completed. This is something I'll need to test on future projects.

6. Expect To Make Your Own Changes

Don't expect everything to work perfectly every time. An AI's ability to predict and create word patterns doesn't mean it actually understands the underlying logic. There will always be a need to review the work and make adjustments.

For example, my banner logo uses text created by adjusting the leading (line spacing) between lines with an overline. The leading (line spacing) is reduced so the word 'Tarkington' appears to rest on the decorative overline below it. While Claude could copy the fonts and lines, it didn't grasp the spacing component. Once the navigation menu was designed, I had to manually adjust the leading to restore the banner's proper appearance.

Another time, I asked Claude to prevent Sunday scheduling, but it encountered logic issues. It tried to block out Sundays by referencing the abbreviation 'Sun,' but the existing code used numbers (0-6) to reference the day of the week. This mismatch prevented it from preventing Sunday scheduling. I had to figure out the problem, then I could update the code and have Claude properly implement the calendar.

In another instance, my home page content was covered by the navigation bar. Despite multiple attempts, Claude couldn't fix the issue. After spending considerable time troubleshooting, I moved the promotion box from the middle of the page to the top, and everything worked.

7. Anticipate Some Troubleshooting

These issues weren't difficult to troubleshoot and fix—they just took longer than if I had designed the page myself and understood how it functioned. The multiple style sheets often created conflicts in displayed boxes or text styles and colors. Fortunately, modern browsers have built-in tools that show how and where page styles are applied, which proved invaluable for debugging.

I believe replacing updated files and adding new files into the Project Knowledge after each page is finalized might speed up the process and reduce final edits. This is a strategy worth exploring in future projects.

8. Improving Time Efficiency

Despite these occasional challenges, I've found ways to make AI work more efficiently for routine tasks. After publishing each new blog post, there's a sitemap file that should be updated to inform Google and other webcrawlers about the page for indexing purposes. Rather than using a third-party tool each time, I asked Claude to create a special page with a button to handle this automatically—a simple change that made my life easier.

Another discovery was that I could use my first blog page as a template. I simply told Claude to replace the text with content from a Word file, effectively turning one page into a template for all future posts without additional work.

9. Conclusion

Using AI for website development is similar to working with an assistant—sometimes they're competent at a task, sometimes they need guidance and correction. The time saved creating content, pages, and functionality outweighs the time spent reviewing and fixing issues. The relationship improves as you develop better prompts and build a shared working history.

For my business, the efficiency gains are tangible. Tasks that would have required significant time or outside help—from drafting content to automating sitemap updates—are now manageable in-house. The process isn't without friction, but it's improving with each project. I'll continue incorporating AI into my workflow while remaining realistic about its capabilities and limitations.




Glossary

Leading:
The distance between two baselines of lines of type. The word 'leading' originates from the strips of lead hand-typesetters used to use to space out lines of text evenly.
Overline:
Also called overscore, or overbar, is a typographical feature of a horizontal line drawn immediately above the text.
Project Knowledge:
Files uploaded to a Claude project that the AI can reference and use throughout all conversations within that project. This allows Claude to maintain context about your website's structure, code, and content across multiple chat sessions.
Style Sheet:
A type of template file consisting of font and layout settings to give a standardized look to certain documents.

Leave a Comment



About Us Privacy Policy Cookies