Categories
Web Development

How To Know if a Site Is Actually Serving WebP Format Images

A WebP image is a new modern next-gen format that provides exceeding image compressions. The most significant advantage of utilizing WebP images is better site speed, as these images will load & render a lot faster. For comparison, lossless WebP images can be 26% smaller in size than the same image in PNG format, whereas,

Read More
Categories
Web Development

What Is the strict-origin-when-cross-origin Referrer Policy?

Many, if not all website owners, rely on site analytics — at least to a certain extent — to understand where their users come from. Technically, the act of knowing which websites are referring traffic to your site is achieved via the referrer header. Now, how much information (more on that) is revealed of the

Read More
Categories
Web Development

What Is x-content-type-options: nosniff Response Header?

Response headers contain a lot of useful details about a web document/file that is sent over the internet. A very known example is a text/html content type, or in other words, a regular HTML page, as the non-technical folks would say. The information inside a response header has nothing to do with what you see

Read More
Categories
Web Development

About Automatic Signed Exchanges (SXGs) and LCP Load Times

Cloudflare is taking performance & website load times very seriously when it comes to assisting users who leverage their services. Quite recently, it launched a beta on early hints 103 HTTP code. Almost hand in hand, it seems, they also unveiled the “Automatic Signed Exchanges” beta in partnership with Google — with the primary purpose

Read More
Categories
Web Development

What Is an Early Hints 103 Status HTTP Code, and How It Helps Load Times

The hunger for serving site users with faster and quicker load times is still on, and while we have made significant positive leaps towards that goal, there is so much room for improvement left, that we constantly push newer Internet standards & best practices, as well as develop more efficient methods of communicating page resources

Read More
Categories
Web Development

What Is DOM and How To “Avoid an Excessive DOM Size”

Web Browsers are a beautiful creation that allows us to view & use web pages on the internet. The governing fundamentals that make that happen transpire at the speed of light. From the many, one of the core principles is DOM — or short for — Document Object Model. What Is DOM (Document Object Model)?

Read More
Categories
Web Development

Preconnect to Required Origins: What Is rel=”preconnect”

If you’ve ever run your site through Google PageSpeed Insights, and came across “preconnect to required origins,” this post will cover the ground on what that message conveys, and specifically, focus on the rel=”preconnect” aspect. If you’re interested in dns-prefetch, you can check out my previously written post, where I discuss the necessary details to

Read More
Categories
Web Development

A Prefatory Guide to dns-prefetch

As the name suggests, dns-prefetch is a hint for modern web browsers that strives to calculate the IP address of a domain present on a page. In other words, it’s already prefetching the information — prior to it being requested. How Does dns-prefetch Help? On its most fundamental level, one of the core activities that

Read More
Categories
Web Development

Link Rel Preload and Site Speed: A Preliminary Guide

A lot of the initiatives in the web development world and the search engine rankings have been around providing a positive user experience. From the many, web performance holds great importance. And from the myriad of options available for improving site speed, link rel Preload is one of them. What Is rel=”preload” ? When rel=”preload”

Read More
Categories
Web Development

Static and Dynamic Content: Delineating the Differences

As we progress towards a more personalized digital world, you will start to experience increased content geared towards you. And what you see on a webpage may be entirely something else than what others see because of their personalization activities. This by nature — where content is served uniquely to each – often falls into

Read More
Categories
Web Development

Basic Differences Between a CSS ID and a CSS Class

If you’re just getting into marketing and analytics, data and behavior tracking, or even programming/web development, one of the common terms that you’ll often hear thrown around or read about is ‘CSS selectors.’ Amongst a bunch of them, two of the commonly used CSS selectors are ID and class. Both these selectors help apply styling

Read More
Categories
Web Development

A Basic Introduction to HTML5 Semantic Elements

If you look up the actual definition of “semantics,” you’ll get answers around it having to do with meaning or its study. Along the same line, HTML5 semantic elements serve that purpose as well. On a super high-level, HTML5 semantic elements aim to: Provide guidance about an element to a browser. In other words, give

Read More