Starting your website can be stressful. So make sure everything is in order to make a great first impression. We lay out everything you need to check before opening the shop.
Test browser and mobile compatibility
You probably only use one browser, but the rest of the internet uses a variety of browsers. You should test your website in Chrome, Firefox, Edge, and Safari. Make sure your website looks the same as certain browsers can process CSS differently. For example intrinsic and extrinsic dimensioning (
width: fit-content ) has some bugs in Firefox, so make sure you have fallbacks in case the browser doesn̵
prefers-color-scheme Media queries used for automatic dark topics on websites are supported in the latest version of Chrome and Firefox, but not in IE or Opera or Chrome for Android.
Mobile support is another major issue and requires more work than browser support. However, this goes beyond just making sure it works on your phone. You should make sure that your website looks great at any resolution. This is known as responsive design and is an important part of modern web development. Chrome has very good tools for testing. You can open it by right-clicking anywhere on your website and selecting “Inspect”. Then select the mobile device icon in the top left corner and select “Responsive”:
You can drag the handles around your site to change the desktop size, which you can see in pixels above. Additionally, you can select different mobile devices to see what that resolution will look like.
You should continue to test on real mobile browsers on real devices because they have different properties and different user agents. Additionally, you should check your site through a VPN so that you can change your country of origin. Make sure nothing strange happens to the ads in particular as they can be regionally dependent.
Test for speed
People are incredibly lazy and your website needs to be as fast as possible to get their attention quickly. Even if your website only takes three seconds to load, 53% of mobile users have already left your website.
You can test the speed of your website with Google’s PageSpeed Insights tester. It analyzes your website and gives you a list of desktop and mobile recommendations on how to fix your speed issues.
Your speed directly affects your rankings on search engines like Google. It is therefore important to keep up with the competition.
Make Google Happy (SEO)
SEO is a complicated topic, but here are some tips to improve your website’s ranking.
- You can manually test your SEO with the help of services like Moz, Ahrefs, and Screaming Frog. These crawl your website and monitor your analytics to let you know how you are doing. You should also check for broken links with a spider tool as they can negatively affect your SEO.
- You should have an XML sitemap for your site. This acts as a directory that Google can use to index it. However, you don’t have to do this manually. There are WordPress plugins like Google XML Sitemap and many online generators. You can then submit it online or make it available over the Internet
Sitemap:Policy in your
- Speaking of which, check yours
robots.txtFile to make sure that you aren’t preventing search engines from crawling your website. You can optionally deactivate certain routes such as
/wp-adminthat search engines should ignore.
- Your social metadata should be set correctly. This is especially important to let other websites know how to embed your pages, be it an article, video, or general website. You can generate these using an online tool.
- You should check out Google’s structured data features as this can greatly improve your search exposure. For example, if your page is an article, you can include the structured data as JSON to tell Google what the hero image, headline and lede look like so they can be displayed in Google News. There are all kinds of content types so you are sure to fit in somewhere.
- It’s a good idea to validate your HTML to make sure there aren’t any major issues, although perfect W3C validation is very strict and you don’t have to fully adhere to it (most websites don’t).
Make sure it’s accessible
People with disabilities also use the internet. So make sure your website is accessible through a screen reader. Typically, this means adding alt text to images, properly marking the landmarks of your site, making sure keyboard navigation works properly, and that the labels are set correctly.
You can use Khan Academy’s tota11y userscript to debug your site’s problems. A button appears in the corner that you can use to check, for example, contrast, heading order, and labeling problems. It also shows how a screen reader sees your website. For more information, see our complete guide to troubleshooting accessibility issues.
Install an analytics tool
Analytics tools monitor and log the traffic on your website. It is important that one is running from the beginning and collecting data in the background. Even something as simple as Google Analytics for collecting traffic data will show you how your website is doing.
Once launched, you can also use A / B testing to land on a design that is optimized and achieves its goal as often as possible. This is especially important on landing pages that are shown to users coming to your website from your ads, as improving your conversion ratio means you get more revenue for every dollar spent on advertising. Check out our review of some popular analytics tools to find out what is right for you.