Hoverify Review: The web developers' tool to streamline your workflow

April 3, 2022

Hoverify Review: The web developers’ tool to streamline your workflow

Matt Li

Disclosure: I am an independent blogger and the reviews are done based on my own opinions. The information in this article is based solely on my own experience using the product. If I have not used the product, I will never give a review of it. My posts may contain affiliate links. You won’t pay a single cent more if you buy something through one of those links. But I’ll get a small commission, I would greatly appreciate it and, in this way, I can produce more valuable content in the future. Click here to read the full disclosure policy. Thanks!

Hi everyone, today I will like to share with you a tool that I uses almost daily for my web development work. Check out Hoverify, an all-in-one browser extension for web developers and designers. Created to streamline your daily workflow and development processes.

What is Hoverify?

Hoverify is a add-on/extension that is compatible with Chrome, Brave, Firefox, and Chromium. You can activate the program on up to three browsers for $30USD per year (about $2.50USD per month).

There are 7 key features that streamline your web development process:

1. Inspector

Hoverify makes it so easy to check any site by just hovering over it.

In a nutshell, the inspector tool is a UI/UX upgrade to “Inspect Element” on a web browser, showing all the information in an organized way. Check the HTML script, style, color, font, and edit the website with a ‘live preview’ without logging into the website admin. For example, adding custom CSS scripts or editing content for demonstration purposes.

This tool is often used by me to identify the color palette, fonts, and padding on a website. This is particularly useful for clients who want to use a specific font, size, and color palette from a website.

Another feature worth mentioning is the tool’s integrated codepen.io support. With a simple click, the tool exports the entire component to Codepen.

2. Color Eyedropper

Pick colors right from any part of the page, even images and frames.

This tool is extremely useful, especially for web designers. With a single click, you can identify the color code or RBG setting. Besides being able to select more than one color at a time, it also automatically saves the colors in the “Recent” tab, keeping up to 18 colors there. You can save your favorite colors in the “Saved” tab.

3. Assets

Download images, SVGs, and videos from any page.

Another cool feature offered by Hoverify – you can download all the assets on a page. Either click “Save All” to download it all, or click on the image, svg or video to download it. Sometimes the client is unable to provide backend access to download everything, this tool will come in handy if your client wishes to reuse the media assets from your existing website.

*Note that Youtube, Facebook and Instagram are not supported.

4. Responsive

View any site on multiple screen sizes side-by-side.

It is an added bonus for me to have this tool. I used the free app Responsively, which works the same way. In contrast to most web browsers which only allow a single preview screen, Hoverify offers multiple preview screens and seamless switching between portrait and landscape modes. By doing this, you save a great deal of time, rather than checking how your website looks on different screen sizes one at a time.

5. Debug

Check for meta tags, broken links, HTML semantic elements, clear cache, and spellcheck.

This feature is newly released on March 2022. Due to my lack of SEO knowledge, I will not elaborate on this point. For me, spelling check is irrelevant since I use other tools for this.

6. Built With

Find out what technologies a site uses easily.

Those who are unaware of Built With should check out the tool. It’s a free tool that displays information about the technologies (such as CMS, plugins, servers, IP addresses, and scripts) used by a website.

I use it whenever a lead asks me for a quote on a web-related project. This gives me an idea of the CMS platform, page builder, and hosting service I am going to work with.

In my experience, I have performed this check on competitor’s websites when a client requested a similar function. I will either propose the same solution or an alternative plugin to achieve the same goal. Your client will be impressed by this too!

*Note: Please note that it is possible to hide all details from the website. As a result, you may not find any information at times.

7. Screenshots

Screenshot the whole page at once.

In the past, it was very time-consuming for me to screen shot each section and stitch them together into one image.

A full page snapshot is a great way in which to have an overview of your entire website in .pdf, .png, or .jpeg format. I always use the captured image as part of my portfolio on my website; it works exceptionally well with the Scrolling Screenshot Widget by Unlimited-Elements for Elementor.

Additionally, it also has other functions, such as “Selected Area”, “Visible Part”, and “All Tabs”. I never use them since the shortcut “Window+Shift+S” is much faster. Oh yes, “All Tabs” doesn’t seem to work for me; perhaps it crashed due to too many tabs open.

Conclusion

In general, Hoverify provides excellent value for the price. Although you can do the same thing with multiple extensions or software installed, I think it’s worth it if you use three or more of the features available often. I use it almost every day, and I saved a ton of time. Time is money, after all. Moreover, the developer releases new features every quarter – looking forward to more exciting tools in the near future!

1 thought on “Hoverify Review: The web developers’ tool to streamline your workflow”

graliontorile
August 26, 2022 at 7:34 pm

Just wanna state that this is invaluable, Thanks for taking your time to write this.

Reply

How to justify text in Shopify’s pages?

Do you know? In order to customize the look and feel of your web store in Shopify, it is highly recommended that you learn some simple coding to improve the user experience and navigation. One of the requests I often received from clients will be justifying the text in specific pages such as Privacy Policy,

September 1, 2021