If only Ferris knew what was ahead. That quote comes from much simpler, and slower times. With the web and all it’s related technologies, we have seen life change faster than ever. If life was fast during Ferris’ day, it’s at lightning speed now. But the faster life gets, the more we have to slow down to take stock of things. This is no less true in the ever-changing web. But let’s start at the beginning: web development.
This is usually the starting point of a business’ web presence outside of social media. Sometimes, in haste to “get going” business owners look for web developers to build their website quickly, cheaply, and…incorrectly. I think it’s time to slow web development down. To not look at how quickly it can be done, but at the process in which it is done.
What’s the best way to get the desired result? What will produce a website that’s good for today, tomorrow, and is scalable for whatever advancements come in the next few years? What will allow you to take your site and begin the optimization and marketing process without going back and re-doing what was already done, because it was done fast and cheap and wrong, instead of just doing it right from the start?
Let’s look at some web development essentials that you should be asking to be (or your web developers should be telling you are) included in your web development project.
21 Things Every Web Development Strategy Needs
If you have not performed keyword research before starting on the development of your site, then you are not building a website for your customers. You might as well just look in the mirror and say, “It’s all about me! It’s all about me!” Keyword research gives you a wealth of information on how your audience searches, what phrases have meaning to them and what, specifically, they are looking for. This feeds into the architecture and navigation of the site in huge ways.
Wait. You are creating a design without putting together wire frames first? Big mistake. While skipping this step may get you a completed design quicker, without wire frames, your pages may end up missing critical elements or have functions in the wrong place. It may seem like a simple fix, but the design frequently distracts us from seeing the things we should be seeing.
That leaves you either approving a design you like, not realizing something is missing, or rejecting a design because something just seems wrong but you can’t quite put your finger on it. Build a wire frame for each unique section (or page) of your site so, without distraction of colors or other visual elements, you can ensure everything you need has its place on the page.
Grayscale comps are common in the print design industry, but for whatever reason, not so much in the web design industry. In my opinion, they are just as important here as anywhere else. Color is a distraction. I’ve seen clients reject a site design because they didn’t like it. Turns out, they just didn’t like the colors! Grayscale comps allow designers to design the site using the appropriate contrasts without yet worrying about what colors the client does or doesn’t like, or how those colors are working together in particular areas of the site. Approve the design, then add color later.
The worst that can happen here is that the grayscale comp is accepted but the first color comp is rejected. Do you have to go back and reinvent the wheel? Nope, just change the colors until you get them right!
Coding & Implementation
Believe it or not, there are some web designers who don’t code websites. You have to find someone else to do that. Nothing wrong with that, just so long as you know this ahead of time. Sometimes you can have one person do both the design and code, and other times it might make sense to have two people with two different skill sets implementing your development in phases. Either way, for a site to work, the code has to be built to accommodate the design and the functionality you require.
HTML5 can do some pretty sleek stuff, but many web developers are still coding in HTML4. Sure, old HTML still works, but it ensures your site is obsolete almost immediately. HTML5 is scalable for new media and gives advanced functionality with less code than other forms of HTML. That makes your site sleeker, cleaner and faster! While validation isn’t necessary for a site to work, a developer should be doing clean enough code that the HTML will validate properly. There are some exceptions to this (especially when using 3rd party tools) but validation should be considered a necessary component of good code development.
Search Engine-Friendly Architecture
I understand coding a site can be a daunting task, especially when you’re adding in unique functionality. But that’s no excuse not to code a site with search engines in mind!
Developers need to consider common architectural issues that hinder a site’s performance in the search results, including poor navigation implementation, excessive internal linking, readable URLs, unspiderable links and pages, slow-loading pages, and more. While most developers don’t have search engine optimization experts on staff (even if they claim to!), it’s important to have someone to look over the work being done to ensure the architecture of the site won’t cause problems for you later.
Duplicate Content Prevention
Along with the SE friendly architecture, developers must make sure that your site solves any potential duplicate content problems before the search engines spider a single page. There are many duplicate content workarounds and band-aids, which can be applied after the fact, but a good developer will consider this when building the website from the beginning.
Size Optimized Media
Using any media on your site? If so, is it optimized properly? Often they aren’t, and that’s a problem. Everything from images to video should be optimized for speed and search friendliness. Most media can be compressed to be smaller in size (file size and display size) so they download faster.
There is usually a keyword optimization component in alt tags or captions which can be implemented as well when the media is being created. Most video can be optimized for YouTube and images can be optimized for image search. These considerations are an important part of the development process.
ALT Text For All Images
Speaking of images, if ALT tags are not used on images in the development stage, then when? Oh, right, they have to be done after the site is developed. Again, why go back and re-do what should have been done to begin with?
CSS Image Sprites
Another way to speed up page load times is to use image sprites to consolidate several small images into one. Each image download places a certain amount of strain on the server. One larger image causes less strain and quicker downloading. This is especially true for images used on multiple pages. Use CSS to display the relevant portion of the image
Not concerned about what your site looks like on a mobile device? You should be! Even if your customers don’t complete transactions on your site from their mobile devices, mobile is often the start of their research process. This is usually the first place branding occurs.
If your site doesn’t work or isn’t visually appealing in a mobile environment, you blew your first chance to make a good impression! Yet, with the growth of mobile devices, you can be sure if your audience isn’t using mobile widely today, they will be tomorrow. If you’re not there, you’re not for them.
Scalable at Various Resolutions
Your site must scale well across multiple resolutions and screen sizes. It’s not just mobile that have multiple screen sizes and resolutions (iPad, iPad mini, smart phone, over-sized smart phone, etc.) but desktop screens rang from 19″ to 24+”. Your site needs to work well across the board by being responsive.
Site Optimized For Speed
I’ve talked a lot about site speed in different points above, but site speed warrants its own commentary. After you’ve optimized everything else for speed, look again to see what is slowing the site down. Is it a plugin that should be hard-coded? Is it an unnecessary bit of functionality that just looks cool? Speed is an important factor of a visitor’s experience and the developer needs to look for additional ways to speed the site up.
All this web design stuff is great, but if you don’t have analytics code installed then you have no way of knowing how your new site is performing. Adding analytics code is easy and shouldn’t be an after-thought. It should come standard on all new websites.
Broken Link Checks
If I had a dollar for every broken link that I’ve found on a brand new site or re-designed site, I’d have a whole lot more money than I do now! Ensuring the site rolls out without any broken links is the developer’s job. Period. That’s part of ensuring the site works correctly on all fronts and preventing user frustration.
Under no circumstances should a developer give you a completed site without extensive live testing. There is just no excuse for a new site to be buggy and broken after the developer turns it over to you. Time for testing should be worked into the timing for site development. Under no circumstances should the site be rushed out before the bugs are worked out and tested– it’s worth it to wait!
Custom 404 & Favicon Branding
Yet another relatively small task that developers don’t think about. While they are usually not huge issues, it’s a nice added touch of “completion.” Ever see the little image that appears in the URL bar when you’re on a site, or in the tab title of a site you have open? That’s the favicon. A small visual piece but one that can make a huge impact.
So can a custom 404 page that is accessed when a visitor lands on your site via a bad link. A custom designed page keeps the visitor engaged on your site rather than a generic “page not found” message that often sends them back where they came from.
Finally, all sites should be printer friendly. It is quite common for visitors to print pages for later review or reading. When pages are not printer friendly the text is often difficult to read, multiple blank pages are printed, or other ghastly annoyances turn up on the page. Using CSS, each page of your site can be printed with minimal junk, while making sure the content they want is readable to boot!
Whew! That’s quite a list. And it’s by no means comprehensive! But these are things that many developers just aren’t doing for the sites the build. Sure, cutting corners always saves money at first, but it often costs you more money later. This happens quite a bit in the web marketing industry. However, when a site is developed right it’s ready to be marketed to the search engine. Your SEOs can then spend their time (and your money) bringing in new targeted traffic and less time fixing your web developer’s mistakes.
Oh, if only web developers were web marketers. Some are, but those are few and far between.
That’s okay. You can take this list to your developers and make sure they build your next site correctly.
Featured Image via splitshire.com | Image #1: Anatolii Babii via 123rf.com