I used Gemini to create a website, here’s what happened
Beyond the Alphabet
Beyond the Alphabet is a weekly column that focuses on the tech world both inside and out of the confines of Mountain View.
Most of the dust has settled following Google I/O 2025, and since then, we’ve been messing around with the various new features that are available. This, for me at least, started with Android 16 QPR1, which introduces all of the new Material 3 Expressive design changes.
A recurring theme that I noticed throughout the Keynote was how Google continued pointing out the variety of ways that Gemini can help you. Not just with your phones and tablets, but for other tasks such as browsing the web with Project Mariner, or even creating full-blown websites.
Seeing as I can barely even get “Hello World” to appear correctly, I figured it might be fun to see what Gemini can do. As it turns out, there’s a pretty big anniversary right around the corner, as Android Central’s EIC, Shruti Shekar, reminded us that it will have been 20 years since Google bought Android. So, what better way to put Gemini to the test and see what it can come up with?
Setting the parameters
On one hand, you could just go all-in and ask Gemini to create a website, which I did. However, Gemini Advanced isn’t the only version that I have at my disposal. As such, I decided to set up a comparison of sorts between the following models:
- Gemini 2.5 Pro Preview
- Gemini 2.5 Flash Preview via Google AI Studio
- ChatGPT o4-mini-high
- Claude Sonnet 4
For further reference, I didn’t use something like LM Studio to run these models locally on my computer. Everything was done right from Chrome browser tabs on my desktop PC.
With that out of the way, I started with the most basic of prompts: Create a website about the history of Android.
Gemini 2.5 Pro
Gemini 2.5 Pro took a few seconds, then enabled Canvas, and started writing code for the website. It even told me that “it will be a single-page website,” before rendering the page in a preview window for me to see.
After the site finished rendering, Gemini provided a brief explanation as to how it created the site, including the frameworks that it used.
Gemini 2.5 Flash Preview
Using the same prompt, I switched over to Gemini 2.5 Flash Preview in AI Studio and was provided with something a bit different. I fed Gemini the same prompt, and was taken to a completely different dashboard. However, it didn’t take long for me to realize that this is essentially a coding studio, as the middle pane shows the layout of various files. Meanwhile, the pane on the right is where I watched the code being generated by Gemini.
A few minutes later, I came back to my computer after grabbing some coffee and was met with an error message in the preview window. I have no clue what it was trying to fetch or why, and thankfully, I didn’t need to. In the Code Assistant panel, there’s a little button that says “Auto-fix.” So obviously, I clicked on it and let Gemini fix its own code.
Not only did it figure out what was wrong, but it also provided an explanation, along with the necessary fixes, and just started updating the code itself. Another minute later, and we had another single-page timeline with some rather interesting image choices and brief descriptions.
ChatGPT o4-mini-high
I don’t know whether it was OpenAI or Google that started showing the “thought process,” but it can be a nice touch. Especially when you’re trying to use these services to accomplish a task that you know nothing about.
Nevertheless, ChatGPT took about 40 seconds to figure out how it was going to structure and create the website. Like Gemini 2.5 Pro, it created a single HTML page, opting for a timeline view, just like the others.
While writing the code, a separate panel appeared to the left of the chat conversation. But unlike the Gemini models, ChatGPT didn’t automatically show me the preview once the code was created.
Instead, there’s a “Preview” button in the top right corner that shows you what was created when clicked. It’s not like this is a big deal, but it’s just something that I noticed that was done differently.
Claude 4 Sonnet
Rounding out the pack is Claude 4 Sonnet, which is one of Anthropic’s newest models. It followed suit, just like the rest, offering up a single landing page that starts with a timeline. And for some reason, it opted for a light purple background, as opposed to choosing a shade of green.
At first, I expected this to be pretty much what I’ve seen so far, but Claude had a surprise for me. Below the timeline view were additional sections for “Android by the Numbers” along with “Major Android Versions.”
The former just shows various statistics about market share, active devices, etc. But the latter highlighted a few of the more important Android releases, while also providing four of the biggest features for each release.
Overall thoughts
Considering that I provided each of these AI chatbots with a simple prompt, I’m not really surprised that it resulted in some pretty basic designs. Some are more complex than others, but each one is just a single static page.
Going into this, I assumed that this Gemini 2.5 Pro-generated website would be the most basic of the four, but as it turns out, that was the wrong assumption. In fact, if all I needed (or wanted) was a single HTML page, this would be the one I would start with.
It doesn’t start off with an actual timeline, but begins with neatly organized sections for each timeframe while offering thorough descriptions. Scroll past that, and we have a compressed timeline, along with two more sections about Android’s impact and “The Horizon.”
Funnily enough, I was actually most disappointed with the Gemini 2.5 Flash Preview model. Gemini 2.5 Flash Preview was the only model that threw back any kind of errors. Of course, this was quickly remedied with the push of a button, but I kind of feel like it shouldn’t have happened to begin with.
In terms of design, the award for worst goes to ChatGPT, as it’s about as barebones as it gets.
Go big or go home, or just stay home
“You get out what you put in.” That’s a phrase that I have to constantly remind myself of whenever using LLM models. If I only ask a basic question or provide a basic prompt, I’m only going to get basic results, with the rare and random overachiever response.
So if you want something more in-depth and can’t figure out the right prompt to enter, let AI do it for you, which is exactly what I did, as I knew that the basic prompt might not give me the results I wanted. And all I asked was, “Create a prompt to use if I want to create a website about the history of Android.”
Image 1 of 2
Funnily enough, Gemini gave me something that looked similar to what the Gemini 2.5 Flash Preview gave me earlier. If you want to check it out for yourself, you can see the prompt here, but I then took this detailed “prompt” and ran it through all four models.
For the sake of brevity, I won’t go through each result, but the gallery of screenshots above shows the responses. This time around, things were just a bit different, with Gemini basically regurgitating the prompt. ChatGPT kind of did the same, but at least gave me an HTML snippet for a “Hero Section.” Other than that, it just broke down each section further, which obviously, isn’t what I was hoping for.
Claude took a similar approach to Gemini 2.5 Pro, featuring sections packed with details and information. And while this is still just a single page, it added shortcuts at the top so you can jump between sections.
I had high hopes for Gemini 2.5 Flash Preview, but after being prompted to leave the page, it threw another error that needed to be fixed. And another, and another, and another, etc. After clicking the Fix Now button at least five or six times, the website finally rendered.
It’s easily the most in-depth of the bunch, as there are actually multiple pages, as opposed to everything on one. However, even the home page is chock-full of information, even if the stock images are laughably off the mark.
This was really only the first step
Image 1 of 4
More importantly, this is kind of what I had envisioned when setting out on this project. Partially because that’s how my brain operates, but also because I’m a fan of the “completionist” approach to certain websites.
The kicker about this is that it’s really just the first step. You can’t actually visit any of these websites that were created, as you need a host and a domain. Not to mention that none of the populated information has been fact-checked. Once all of that’s done, then I’ll go through and replace the placeholder images throughout before pushing the site live.
However, it did help open my eyes a bit to what’s possible, even if it’s something that seems as basic as building a website. Oh, and by the way, keep your eyes peeled, because we may or may not have something special to share in the very near future.
Post Comment