What’s the difference between a good website and a bad website?
March 22, 2016 By everybody , aka mind
Making websites can be pretty fun, if you’re into that sort of thing like we are. But it can also be a lot of work, with numerous ways to get the end result you want. When it comes to a good website vs bad website, the difference between them is mostly subjective. There are better adjectives we can use to describe a website, though.
I’d like to explain two example situations to you from a typical website: displaying an image and displaying a company’s address and phone number. When displaying an image, you can embed a single image that loads the same on everyone’s computer, tablet, or phone. You can also display different versions of a similar image, depending on how big the screen is, the resolution or clarity, or the orientation, in whatever way is optimal for their situation.
For an address, you can display the text — the street name, city, state, zip code, and telephone number clearly legible. But if you take the extra time to define the fact that it’s a street address, for a specific business, with all of its parts identified, then it will be easier for “crawlers” or “bots”, from search engines and other data aggregators, to identify and understand it. You can extend this notion in other ways as well. Such as a company that sells bats clearly identifying the fact that they sell baseball bats and not small flying mammals. It can also be used for identifying specific aspects of your product like its availability, price, or a photo.
Even if you’re not a developer, you can see that this:
<picture> <source media="(max-width: 700px)" srcset="large.jpg 1200w, medium.jpg 700w, small.jpg 320w" sizes="50vw"/> <source srcset="large2.jpg 2x, small2.jpg 1x"/> <img src="small.jpg" alt="An image"> </picture>
is more complicated than this:
<img src="large.jpg">
Or that this:
<div itemscope itemtype="http://schema.org/LocalBusiness">
<h1><span itemprop="name">Business Name</span></h1>
<div itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
<span itemprop="streetAddress">123 Any Street</span>
<span itemprop="addressLocality">Cityville</span>,
<span itemprop="addressRegion">NY</span> <span itemprop="PostalCode">12345</span>
</div>
Phone: <span itemprop="telephone">123-456-7890</span>
</div>
is more complicated than this:
<p> Business name 123 Any Street Cityville, NY 12345 Phone: 123-456-7890 </p>
Many Paths on the Mountain
There are numerous ways to do simple things on the web today. And even more ways to do complicated things. You can consider, and optimize for, a variety of types of computers and screens and ways that people will interact with your website, or you can build a site that is simply good enough for someone to find your phone number and call, or maybe find your address or operating hours. Whether it takes 2 seconds or 10 seconds to load, how big the images are or how easy it is to update may not be a major concern for you.
On the other hand, maybe your website is crucial to your business, or is a viable method of attracting new customers, and you want to invest serious effort to ensure you have a clean, original, and well thought out user experience built to today’s web standards and supported by modern mobile devices and streamlined computers.
The end result, as in what’s actually visible in your browser on your computer when you’re looking at the site, can in some cases be very similar. The differences once the page loads and the user interacts with it, can be small. But the way it loads, the way search engines see it, the way people can use it, and the way different people with different kinds of computers, operating systems, and browsers are handled differently. Are you sure your website looks good on the screen of everyone who visits it…not just yours and your web designer’s screens? It should work on a laptop, iPad, smartphone, or the screen embedded in your refrigerator (once those are a little more common, anyway.)
Not Every Path is Equal
It’s not that “more code is better and takes longer to write” is always the case. Some situations are the exact opposite. Even smaller websites are, in general, better by virtue of taking less time to download and display their content. This particular example only applies to frontend code (HTML, CSS, and javascript), while the notion is more ambiguous in regards to backend code that simply runs on the server.
Everything up to this point has been emphasizing the side of the website that the user interacts with…the frontend. A lot of modern websites today have another side. Effectively the “backend” of the website where the owners, administrators, authors, or moderators can perform updates, maintain content, add or modify functionality, or just change pictures and page titles as the seasons change. Equal consideration can be made for things like maintaining inventory or managing orders for ecommerce sites, or moderating user comments on a forum or blog.
How easy it is to use and maintain a website is an equally important factor, especially if you need your site to be easy for non-technical people to update. A good rule of thumb is that the easier it is for the end-user, the more time it takes for the developer to set it up that way. There are other things to consider, especially in this world of “What You See Is What You Get” editors, where a developer can take extra steps to prevent end-users from making changes that break the site, change things that shouldn’t be changed, or imply things incorrectly (such as using a heading when they just want larger text, or using a table when the layout should be defined by CSS.)
A Good Developer Will Help You Choose
So, while “good” and “bad” are mostly subjective, there are some objective parameters that we can use to judge a website. How fast it loads, how easy it is to use, how well it works for everyone, and of course, how much it’s helping you do whatever it is that you need your website to do for you.
View Comments