Top 5 Reasons To Test Your Website Across Browsers
I would hope that those of you taking the time to read this posting would have some idea of why you should perform some level of testing of the software and websites you create. However, I am keenly aware that some management types don’t always understand the importance of testing until an untested “feature” appears in the wild, frustrating all that run across it.
- Ensure Cross Browser Compatibility- Unless you develop a website for internal usage only, where you are able to successfully restrict users to a specific version of a specific browser, Cross Browser Compatibility ensures your site functions well for the greatest number of users.
- Detect Shallow Errors - Simply loading a website for a quick look in all the major browsers allows you to find 95% of all the browser compatibility errors for your site.
- Discover Performance Issues - Typically, older and less-advanced browsers, such as Internet Exporer, and the older versions of Chrome, Firefox, and Safari are unable to process the CSS, JavaScript, and HTML that the most recent and more-advanced versions of these browsers handle with ease.
- Prioritize Backwards Compatibility - I have heard countless times that we need to make sure this website supports browser versions that were released more than a decade ago. Instead of just making excuses for why you can’t support them, testing your site in the older browsers first allows you to put a more accurate time estimate that supporting these browsers will require. Its amazing to see how the requirements for supporting old and outdated browsers evaporate as the time and cost estimates begin to add up.
- CYA - Whether it is your internal customer that is requesting the new website or you are an agency working with another individual or business for a new website, the last thing you want to have happen is that the customer open the site when it goes live in a browser you have not tested yet and has major issues. Establish ahead of time what the list of supported browsers will be and make sure to test all of them. If you have time, test the next most popular browsers or versions of popular browsers.
While testing your website may not be the most exciting part of web development, it definitely will save you time and money in the long run.
Firefox 36 Has A Massive Memory Leak
While looking through our TrackJS logs the other day, I ran across a peculiar error message coming from Firefox 36 on Windows 7. The error message was simply out of memory. It seemed that the pesky local storage issue had reappeared mysteriously. However, with a quick check of the codebase, I verified that no one had accidentally reverted those fixes.
With that possible cause ruled out, I turned to a developer’s best friend, Google, for solutions. Well, it appears that Firefox 36.0.0 has quite the memory leak issue. When looking into the detail of the issue, it became highly probably that this issue was the cause of the errors in our monitoring tools. Apparently, this bug rears its ugly head when you are doing 2D rendering on your page, and the site uses a 2D charting library to present information.
Avoid 'Persistent storage maximum size reached' in Firefox
One of the nice tools out there for tracking down issues that your website’s visitors are having is TrackJS. We started noticing the other day that we were getting overwhelmed by errors with the text Persistent storage maximum size reached for our Magento site. When we looked further into the issue, it quickly became obvious that all of the errors originated from a single user that was running Firefox.
It quickly became obvious that there was a single user that had exhausted their localStorage resources on their browser, but why was it only one user? Well, as it turns out, there is one browser that allows the user to set the amount of space that localStorage can use, and that one browser is Firefox.
Web Browser Font Rendering is the New Edge Case
In the early days of the web, designers and developers relied upon visitors to the sites they were developing to have their chosen font pre-installed on their computers so that their web browser of choice would be able to properly render the selected font. As quickly became obvious, there is a wide variety of fonts installed across all computers worldwide, so this was not an achievable scenario, especially when print level typography was desired. Unfortunately, at that time, the solution was to put all of the text in an image, ensuring the text would display exactly as the designer had specified, but hiding the same text from search engines and blind users.
Window.Open Causes Browser Compatibilty Issues
One of the things that always annoys me as a web developer is when native browser functions that are accesible from JavaScript do not share the same function signature. One perfect example of this is the window.open function. When you are using non-Microsoft browsers such as Firefox and Chrome, you are able to make a call something like this window.open(url, 'window name', 'dimensions or other settings');. The window name parameter is important because it allows you to open multiple links in the same external window/tab. However, when using Internet Explorer, especially Internet Explorer 8 and older, you can only use window.open(url);. If you try to use the first type of function call, you get a very ambiguous error message in the browser that doesn’t tend to show exactly where the error occurred.
Google Analytics Site Speed is a bit Unreliable
Google Analytics will now allow site owners to track the performance of their websites with real live traffic. This is a nice feature that lets you understand just how long it takes for the average visitor to your site to see the fully complete version of your website. While this sounds like a great tool that will give you an accurate view of yoru website’s performance, it does not tell the full story. You can access the Site Speed section of Google Analyics under the Behavior>Site Speed>Overview section. Please be aware that not all visitors will send this information, so you will have to have a certain amount of traffic to your site before you will get any information in this section at all.
Categories
Tags
- 100pounds
- 2020
- Adblock-Plus
- Agile
- Apache
- Apple
- Authorize-Net
- Bing
- Bingbot
- Blog
- Book-Reviews
- Books
- Cache
- Chrome
- Cloudflare
- Compass
- Conversion
- Css
- Culture
- Design-Patterns
- Development
- Disqus
- Docker
- Firefox
- Genesis-Framework
- Ghost-Tag
- Githubpages
- Helper
- How-Not-To
- How-To
- Html
- Hugo
- Internet-Explorer
- Interviews
- Iphone-6
- Javascript
- Jekyll
- Jquery
- Laravel
- MacOS
- Magento
- Magento 2
- Magento2
- Management
- Microsoft
- Mysql
- Netlify
- Nginx
- Nodejs
- OSX
- Performance
- Personal
- Php
- Programming
- Python
- Rant
- Responsive-Web-Design
- Safari
- Scrum
- Security
- Series
- Sitecatalyst
- Sota
- Sql
- Sql-Server
- Teams
- Testing
- Tier-Pricing
- Tips
- Tmobile
- Unittest
- Ux
- Varnish
- Visual-Studio
- Web-Development
- Windows-7
- Windows-Vista
- Woocommerce
- Wordpress
- Xml