قالب وردپرس درنا توس
Home / Tips and Tricks / How to test your website correctly before you start – CloudSavvy IT

How to test your website correctly before you start – CloudSavvy IT

Shutterstock / Chaosamran_Studio

Starting your website can be stressful, so you want to make sure everything is in order to make a good first impression. We put out everything you need to check before you open a store.

Test browsers and mobile compatibility

You probably only use one browser, but the rest of the Internet uses a large number of browsers. You should test your site in Chrome, Firefox, Edge and Safari. Make sure your website looks the same, as some browsers may handle CSS differently. For example, inherent and external size ( width: fit-content ) has some bugs in Firefox, so you should make sure you have cases if your browser does not know how to handle it.


7;s up to you if you want to support 2% of users stuck with IE 11, as many modern CSS and JavaScript features may be broken and may require solutions or cases for IE. You can use CanIUse to check the compatibility of different language features. For example prefers-color-scheme Media query used for automatic dark themes on websites is supported in the latest version of Chrome and Firefox, but is not supported in IE or Opera or Chrome for Android.

Mobile support is another important issue and requires more work than browser support. But this goes beyond just making sure it works on your phone – you want to make sure your site looks good in every resolution. This is called responsive design and is a big part of modern web development. Chrome has very good tools to test this; You can open them by right-clicking anywhere on your site and selecting “Inspect”. Then select the mobile device icon in the upper left corner and select “Responsive”:

You can drag the handles around your website to change the desktop size, which you can see in the form of pixels at the top. In addition, you can select different mobile devices to see what it will look like with that resolution.

You should still test on real mobile browsers on real devices, as they have different features and different user agents. In addition, you should check your website from a VPN so that you can change your country of origin. Make sure nothing strange happens to the ads in particular, as they may be regionally dependent.

Test for speed

People are incredibly lazy, and your website needs to be as fast as possible to grab attention quickly. Even though it only takes three seconds to load your site, 53% of mobile users have already left your site.

You can use Google’s PageSpeed ​​Insights tester to test your site’s speed. It will analyze your site and provide you with a list of recommendations for desktop and mobile devices for solving your speed issues.

Your speed directly affects your ranking in search engines like Google, so it is important to stay on par with the competition.

Make Google Happy (SEO)

SEO is a complicated topic, but here are some tips to help your site rank.

  • You can test your SEO manually using services like Moz, Ahrefs and Screaming Frog. These crawl your site and monitor your analysis so you know how you are feeling. You should also search for broken links with a spider tool, as they can adversely affect your SEO.
  • You should have an XML Sitemap for your website. This acts as a directory that helps Google index it. You do not have to do this manually though; There are WordPress plugins like Google XML Sitemap and many online generators. Then you can submit it online or make it available via Sitemap: the Directive in your robots.txt file.
  • Speaking of, check yours robots.txt file to make sure you do not disable search engines from crawling your site. Alternatively, you can disable certain routes such as /wp-admin which search engines should ignore.
  • Your social metadata should be set correctly. This is especially important for telling other sites how to embed your pages, whether it is an article, video or a public site. You can use an online tool to create these.
  • You should look at Google’s structured data features, as it can significantly improve your search presence. For example, if your page is an article, you can include structured data like JSON to tell Google what the hero image, headline, and link are so that it can appear in Google News. There are all kinds of content types, so you are sure to fit in somewhere.
  • If you use Google’s Accelerated Mobile Pages, you want to make sure they are valid. You can use their online tester to test the AMP version of your site. The most important requirement for AMP pages is that JavaScript is not allowed, other than the experimental amp-script.
  • It is a good idea to validate your HTML to ensure that there are no major problems, although perfect W3C validation is very strict and you do not have to follow it completely (most websites do not)

Make sure it is available

Disabled people also use the internet, so you want to make sure your website is accessible through a screen reader. This usually involves adding alt text to images, marking the site’s landmarks properly, making sure that keyboard navigation works properly and that labels are set correctly.

shows completely wrong on the site

You can use tota11y usercript from Khan Academy to troubleshoot problems with your site. This displays a button in the corner that allows you to check things like contrast, headline order and labeling issues, and it shows how a screen reader will see your site. You can read our complete guide to fixing accessibility issues to learn more.

Install an Analytics tool

Analytics tools monitor and log traffic to your site. It is important that you run one from the beginning and collect data in the background. Even something as simple as Google Analytics to collect traffic data, you can know how your site is doing.

After you start, 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 appear to users who come to your site from your ads, as the improved conversion rate means you get more revenue per dollar spent on advertising. You can read our review of some popular analysis tools to learn what’s right for you.

Source link