Have you ever wanted to impress your users with text animations? Textify.js is a fast and highly customizable open-source library for creating text reveal animations triggered by scroll. This can be used for displaying instructions, tips, or just about anything else you want to show on scroll. Textify.js is a simple library that works with… Continue reading Text Reveal Animations On Scroll – Textify.js
Tag: Help & How to
How to Create Animated Typing Effect (JavaScript)
If you want creating a dynamic typing animation that looks like the text is being typed by a typewriter then typer.js is the right solution for you: It is written in native JavaScript (ES6) and works with almost no 3rd-party dependencies. Download typer.js GitHub Link How to Use It Follow the steps: Step 1: Include… Continue reading How to Create Animated Typing Effect (JavaScript)
Cyotek WebCopy: Copy Entire Websites To Your Local Machine
You might have heard about tools like HTTrack Website Copier which allow you to download any website to your local hard drive for offline viewing. This website copier basically create a replica of the entire website so you can browse it just like you do in online mode. 📣 Also Read: How to copy any… Continue reading Cyotek WebCopy: Copy Entire Websites To Your Local Machine
A Guide to Web Font Optimization
Practically every modern new website gracefully relies on Custom Webfonts. Web-fonts are fonts that are not available in the browser by default. They are fonts that are fetched remotely and rendered by the browser. Web fonts allow you to build a much better web experience, but these fonts also cause a lot of problems such… Continue reading A Guide to Web Font Optimization
Using Resource Hints to Accelerate Site Performance
Resource hints are snippets of HTML code that give the browser a head start by prompting selected files to begin loading sooner than if the browser discovered those same files through the normal course of evaluating and loading the page. There are several types of resources hints, indicated with the rel attribute on the link… Continue reading Using Resource Hints to Accelerate Site Performance
Bing Webmaster Tools – A Quick tutorial for Beginners
Bing Webmaster Tools is a free Microsoft service that allows webmasters to add their sites to the Bing crawler so they show up in the search engine. It also helps to monitor and maintain a site’s presence. Bing Webmaster Tools is to the Bing search engine, what Google Search Console is to Google. Also Read:… Continue reading Bing Webmaster Tools – A Quick tutorial for Beginners
Speed Up Resource Loading with Priority Hints and fetchpriority
Loading experience is crucial to the user’s first impression and overall usability, so Google defined Largest Contentful Paint (LCP) metric to measure how quickly the main content loads and is displayed to the user. The main content for LCP is usually the largest element located above the fold. This element could be an image, video,… Continue reading Speed Up Resource Loading with Priority Hints and fetchpriority
How to Lazy Load Images and Video for Better Website Performance – 2024 Updated
Lazy loading is a technique that defers loading of non-critical resources at page load time. Instead, these non-critical resources are loaded at the moment of need. Where images are concerned, “non-critical” is often synonymous with “off-screen”. If you have used Lighthouse and examined some opportunities for improvement, you may have seen some guidance in this… Continue reading How to Lazy Load Images and Video for Better Website Performance – 2024 Updated
How to Set Up Google Analytics 4: A Step-by-Step Guide
When you set up a business website or blog, the primary goal is to attract visitors and, hopefully, have them convert into paying customers further down the line. Google Analytics (GA) allows you to measure the metrics behind these goals, as well as provide a wealth of other valuable data. However, setting up Google Analytics… Continue reading How to Set Up Google Analytics 4: A Step-by-Step Guide
CSS Ellipsis (the 3 dots…) on Single OR Multiple Lines
UI Developers usually truncate the extra text in the line by applying text-ellipsis, which means showing the 3 dots (visually explains there is even more text, that can be handled by applying title attribute to the element and show the full text on hover). Ellipsis to One Line Text Applying ellipsis for one line is… Continue reading CSS Ellipsis (the 3 dots…) on Single OR Multiple Lines
How to Create a Sticky Footer in CSS
The purpose of a sticky footer is that it “sticks” to the bottom of the browser window. But not always, if there is enough content on the page to push the footer lower, it still does that. But if the content on the page is short, a sticky footer will still hang to the bottom… Continue reading How to Create a Sticky Footer in CSS
How to Publish a Website on GitHub Pages
You have finished creating your HTML website and you are feeling proud of your hard work. But there is one thing that is still missing: you have no idea how to publish your website. GitHub is not only a great place to store and share your code with others but they also offer free web… Continue reading How to Publish a Website on GitHub Pages