Using AI tools to improve my website – A digital journey up a steep curve
Following on from my recent artistic AI experiments, I decided to try and find a more practical use for AI related experimentation. So I jumped head first into an ocean of well-known AI tools to see if I could use them to spruce up this website. Great idea in theory, but how would it play out in reality? I have zero coding ability and I’m self-taught when it comes to design & visual creative work, so these tools were always going to have a relatively steep learning curve for me, but I was determined to figure out some simple things I could do with them that would make a real difference to the look and feel of my website. The results were fascinating and, ultimately, pretty satisfying. But I’m biased I suppose. I’ll let you be the judge of that. In the meantime, here is a whistle stop tour of my experience.
Phase 1: Code-breaker
My first port of call was to understand some of the basics like the WordPress backend and the website theme I am using. So I opened up the digital bonnet and took a look inside. My first problem was that my PHP apparently needed updating. If you don’t know what that is, don’t worry, neither did I (In essence it is an open-source programming language) So, when I clicked the link to update it, it broke the theme and the website threw back an error message when you visited it. Not a great start. I had broken my website at the very first step.
Surely there’s a manual or this, I thought. But the documentation for my WordPress theme was pretty minimal, but I did pay real money for it, so I thought it might be useful to contact the creator of the theme to see if it was a known problem (and if there was an existing workaround to fix it). Alas, to no avail. The creator was totally unresponsive (and still hasn’t answered me at the time of writing this several weeks later) so I started down the AI path and turned to ChatGPT to help me diagnose the problem.
If you have ever used ChatGPT you will likely know that the more specific your question is, the better the quality of answer. Initially my PHP related questions were way too broad and it gave me a myriad of generic answers that really didn’t help. I decided to try and make it more of a conversation and asked ChatGPT to pose questions that would draw out relevant info or details, in order to get more specific in its diagnosis of my PHP problem. Now, it would take too long and be far too boring to recount the back ‘n’ forth I had with ChatGPT to get at the root cause (I was cutting and pasting error messages and lines of rogue code for a while), but in fairness, it did end up zeroing in on something in the code and kindly spat out some lines of fresh code to help me solve it.
This led to my next conundrum. I didn’t have a clue how (or where) to implement the code. Of course, it slowly dawned on me after some fruitless searching on the WordPress backend that I could ask my old pal ChatGPT for a step by step process to implement it. And sure enough, it led me down a rabbit hole of FTP clients, identifying sections of code, modifying them, executing the new code – and then, hey presto, I was able to update the PHP without breaking my website! I felt like a hacker.
Phase 2: Path-shaper
Now that the code was working, the real work could begin. It was time to make the front end look more slick and inviting to a visitor. Some of the basic built in pages and templates for the theme were nifty enough, but there were a few things bugging me. For example, my blog section was not doing what I wanted it to do. Not to get too boring a detailed but the way my theme was built, it put the homepage info at the top of the blog page, and the blog posts themselves began further down the page. So when a visitor went to the blog, it looked like you were basically seeing the homepage again, and with the blog posts (which I had put a solid amount of effort into in fairness) appearing below the fold I felt that they ran the risk of being completely ignored. So I wanted to figure out a way of removing the header and having the blog sit pride of place at the top of the page. I know, this was truly the exciting rock-n-roll side of web development I had dreamed of when I embarked on this digital journey.
So, once again I turned to ChatGPT to cook up some code for me. After a bit of trial and error (“Fail again. Fail better” as Beckett said) I was able to get it to write me a short snippet of code that I promptly hacked into place, and it actually made the header disappear. Success! The blog was now exactly the way I wanted it. This coding thing was starting to get easier with my good friend ChatGPT.
Next up, I wanted to make the visuals on the site pop a bit more and catch the eye. I went into edit mode on the pages of the site and used Elementor to build them. Elementor is a slightly snazzier and more sophisticated building tool than the default one for WordPress pages. It definitely had some limitations of its own that frustrated a non-expert like myself, but as I started to familiarise myself with it I was able to wring some magic drops out of it. Once I had a handle on it, I noticed that Elementor was even getting in on the AI game too (who isn’t these days?) with some built-in AI components that were worthy of a test drive. More on that in a moment.
Once I had laid out some decent looking page templates in Elementor, I turned to one of my favourite new pieces of online software, Canva (basically an idiot proof design tool), to create some cool banners to sit at the top each page. Even Canva has gotten in on the AI act, and I used their built in AI image generator in Canva (that runs on the cleverly named Dall-E) to conjure up some interesting icons and images that I worked into a banner design. I downloaded those freshly created banner designs and popped them into my Elementor page template. I could afford a little Swedish smile at this point. The pages were starting to take proper shape. It was time to cast a critical Irish eye over the content and see if I could crisp it up.
Phase 3: Headline-maker
I was into the home stretch. As proud as I was for solving the blog issue earlier, I realised that the blog posts themselves were looking weird (that’s the technical term my friends) and very inconsistent in their appearance. Back in the day when I originally started my blog (when the internet was in black & white and ran on diesel) I didn’t bother to add an “Excerpt” or a “Featured Image” to my posts. No problem, I don’t need them, I thought foolishly. But now that I had changed my theme and the way my blog was displayed, it meant that, at a glance, an excerpt and an image were crucial to make sense of what I had posted about. This was fairly tedious work but about halfway through I discovered a nifty built-in AI tool in Elementor that scanned the post itself and generated excerpts. They were generally a good starting point, albeit with strange imperfections like speaking in the third person about “the author”. Nevertheless they got me off to a solid start and I was able to modify them to fit my voice and style.
Then my final step was to create interesting images that popped with a bit of colour and some crisp copy to use on my Services page, so they would stand out to prospective clients and visitors to the page. For this I decided to fork out for a monthly subscription to the latest ChatGPT (at the steep price of 20 dollars a month) as it allows you to use its library of plug-ins and APIs from other developers and software providers. So, I tested out a bunch of different plug-ins to generate images, graphs, iconography and other visual outputs, most of which was fun to create but ultimately ended up in the bin. In the end it was the DALL-E 3 plug-in that was the most useful, and I duly created some snappy, smart images that I dropped into Canva, added some design flourishes and text, then downloaded for use on the site.
I then did a final tour of the site tidying up text, tweaking image sizes, updating broken links and generally making it more up to date and appealing. My work was finally done (even though this type of work is never really done). While I was never going to win web design awards, I was really happy with the way the website was looking, and it was all the more satisfying because I was able to do it myself (with more than a little help from my AI toys and tools).
Like any tool, the AI tools I used were only as good as the person in charge. It took me a while to figure out the best ways to phrase and form my inputs in each tool. Like most other crafts and creative endeavours, it was also clear that generating the best creative outputs still required a good imagination, some persistence and a willingness to experiment.
So, what did I learn? The AI tools were incredibly useful, but at the end of the day, they are just that: Tools. Some of them are more advanced and effective than others, at least that’s how it felt to me. But I’m still making solid strides up that steep learning curve. In truth, I’m delighted to add them to my growing toolbox of resources and software, and I am eager to learn more now. At the moment it feels like these AI tools won’t fully replace or automate everything (you still need good old-fashioned creative ideas to generate the outputs), but those of us who embrace these AI tools are less likely to be left behind, as we zip along into the future. In the meantime, I am going to play with ChatGPT to see if it can rewrite this blog post in the style of Samuel Beckett. Hopefully if it fails again, it will fail better.
