Sizzy - A tool for testing websites responsiveness

By Solomon Stephen | OpenSource | 20 Apr 2019

$0.03 tipped


This is actually the very first time I will be reviewing a web app. As my previous reviews had always been on mobile apps, and to be specific, they are Android apps. I am happy things are changing positively as expected. I have always wanted to try out something different, and here comes my first try.
Today's blog post is all about Sizzy. A web tool for testing websites. Sizzy was developed by kitze, and currently being managed by him.

 

I tried building a website some years back, and I understand the importance of online testing tools. If you've also built a website, you should definitely understand the importance of a responsive website. Let us look at it as an end user. Would you come back, visiting a website that loads slowly? Or Would you even recommend a landing page that doesn't load completely to someone? The answer is No! So, could this be prevented?

The only solution to this is by making your site user-friendly, or responsive on all platforms. But, It isn't easy to archive this if you don't have the right tools. Like, having different platforms to test your website.
It's every developer's aim to satisfy every person who uses their project, no matter what platform they're running the project on. But it's always a tough aim if the developer is not well-equipped. Take for example;

Mr. Jones is an app developer who developed and successfully tested his project with his device. Unfortunately, he received negative feedback from the app user who used the app on a different device.

The negative feedback from the example given above could be received by any type of developer, even a website developer. So, what's the way forward? Does it mean that the developer needs to purchase different types of devices for testing? No! That'd be extremely expensive, and would even be more than expensive when it's time to upgrade the devices.

That is definitely not in any way the best idea. This is where an online testing tool comes in.

There are several tools online that is being used to test the responsiveness of websites. For example, http://ami.responsivedesign.is/ is one of the tools that display any website that is being tested on a different screen, showing how it will look like when it' completely developed.
http://ami.responsivedesign.is is an awesome website. But, there are a few setbacks for using it. One of them is, it lacks the ability to rotate the virtual device screen while it's being used for testing. This is the main reason I have chosen to introduce the awesome project developed by kitze.

The uniqueness of Sizzy is its ability to display the website being displayed on different types of Operating systems. Also, it's possible for users to filter the display by different devices and view them on different variations. Because of these unique features, testing websites with Sizzy on a mobile device aren't always suitable, due to the different sizes of screens, it displays its input. Although, I was able to guess a workaround for it. Sizzy worked perfectly well when the mobile browser is set to desktop mode.

Here's what I explained in the previous paragraph. Sizzy recommend that I use a wider screen to test a website, which simply means that I need to make use of a desktop computer. But, it worked after switching to a desktop mode.

Before switching

Screenshot_20190420-181040.png

After switching

Screenshot_20190420-181117.png

What Were The Things I Was Able To Do With Sizzy?

 

The number one aim of anyone that wants to use this tool is to check a website's responsiveness. As I was able to successfully test Utopian.rocks on different devices, and Os. I'll give details of how I used it, and at the same time would be sharing my experience and thought about the project.

Since Sizzy is a tool for testing website, it'd definitely request for input from its user. If you should check the previous screenshot I dropped, you'd notice from the second screen that it asked for a website URL. That's perfect, exactly as expected.
The display is similar to inserting words into a search engine and pressing the Go button to load the result. But for Sizzy, it accepts only a URL and not words, which it then, displays the website entered on different type OS of different screen sizes.
By default, the website is displayed in a portrait view on the virtual device and could be rotated to landscape view. Before I try this out, I'd love to list the awesome features embedded inside Sizzy.

With Sizzy you can;

  • Rotate screen of the virtual device from portrait to landscape and vise versa.
  • Import a keypad to on the virtual devices.
  • Filter devices by OS
  • Filter devices by type
  • Hide dimensions
  • Switch themes
  • Reset all settings.

The very first uniqueness of Sizzy is its ability to rotate devices. This feature can easily be archived by clicking on the rotate button on the website. Another interesting thing about Sizzy is that it provided all its features on top of the website, and also at the left sidebar of the website. This will definitely give users easy access to those features.

Below are the screenshots showing the portrait, and landscape view ofUtopian.rocks, which I tested.

image.png

image.png

I have stated that the placement of these feature on the website is perfect, for it can easily be accessed. I was able to capture my screen while I was testing Utopian.rocks on different devices, and on different variations.

1PQUGEX.gif

As you've seen from the gif above that switching between the different options on the website is very fast. It doesn't lag and that is another reason I love using Sizzy.

Finally, Here is a screenshot showing how I was able to select a particular device, and then, added a virtual keypad to it. The added keypad isn't functional. But, the website being tested is scrollable right from the virtual device screen.
image.png

 

Sizzy Vs Others

The similarities between any online web tool for testing websites is that they display the result on a virtual device of the screens, Os, and devices. But, the developer behind Sizzy added more functions to his project by letting it rotate the virtual device, and filter the devices, which isn't possible on most of his competitor's websites. For example, below is a screenshot a similar web tool, but with a less function.
image.png

As you've seen for yourself that it lacked completely about 80% of the features that are available on Sizzy.

Project Update

17days ago, the project owner updated the project's repository readme file, where he deleted the Support us information and a particular error experienced by developers trying to work with the repo.
Also, 5days ago, he merged a PR from a contributor who added the iPhone X details.

Are there any upcoming feature?

Currently, there aren't any. The project hasn't received any new feature request or a feature code update from the PO.

Conclusion

I believe that everyone that read this article by now won't disagree with me if I place Sizzy over other web tools for checking website responsiveness. Also, Sizzy is well maintained and is available on different platforms.
The last statement where I said that Sizzy is available on different platforms would lead to me to disclose a source.

Do you know that Sizzy is available on Chrome extension? Oh! yes, it does. Head over to Extention Store to download it. That's all I have for you today. See you next time. bye.

REF: Via my steemit blog


Solomon Stephen
Solomon Stephen

Digital Artist?️? | Conversation maker? | cryptocurrency trader | Traveler | Beta Tester


OpenSource
OpenSource

This Blog is a collection of Introductory posts to open source project.

Send a $0.01 microtip in crypto to the author, and earn yourself as you read!

20% to author / 80% to me.
We pay the tips from our rewards pool.