Mark Zuckerberg’s pattern of shifting Meta’s policies to appease changing U.S. administrations and his decision to abandon biased fact-checking partnerships reveal a leader driven by corporate survival rather than public accountability. These actions highlight the urgent need for more transparent and impartial oversight of online discourse.
This article is a sponsored by DebugBear
I was chatting with DebugBear’s Matt Zeunert and, in the process, he casually mentioned this thing called Tight Mode when describing how browsers fetch and prioritize resources. I wanted to nod along like I knew what he was talking about but ultimately had to ask: What the heck is “Tight” mode?
What I got back were two artifacts, one of them being the following video of Akamai web performance expert Robin Marx speaking at We Love Speed in France a few weeks ago:
Tight Mode discriminates resources, taking anything and everything marked as High and Medium priority. Everything else is constrained and left on the outside, looking in until the body is firmly attached to the document, signaling that blocking scripts have been executed. It’s at that point that resources marked with Low priority are allowed in the door during the second phase of loading.
There’s a big caveat to that, but we’ll get there. The important thing to note is that…
Chrome And Safari Enforce Tight Mode
Yes, both Chrome and Safari have some working form of Tight Mode running in the background. That last image illustrates Chrome’s Tight Mode. Let’s look at Safari’s next and compare the two.
Look at that! Safari discriminates High-priority resources in its initial fetch, just like Chrome, but we get wildly different loading behavior between the two browsers. Notice how Safari appears to exclude the first five PNG images marked with Medium priority where Chrome allows them. In other words, Safari makes all Medium- and Low-priority resources wait in line until all High-priority items are done loading, even though we’re working with the exact same HTML. You might say that Safari’s behavior makes the most sense, as you can see in that last image that Chrome seemingly excludes some High-priority resources out of Tight Mode. There’s clearly some tomfoolery happening there that we’ll get to.
Where’s Firefox in all this? It doesn’t take any extra tightening measures when evaluating the priority of the resources on a page. We might consider this the “classic” waterfall approach to fetching and loading resources.
Chrome And Safari Trigger Tight Mode Differently
Robin makes this clear as day in his talk. Chrome and Safari are both Tight Mode proponents, yet trigger it under differing circumstances that we can outline like this:
| Chrome | Safari | |
|---|---|---|
| Tight Mode triggered | While blocking JS in the |
While blocking JS or CSS anywhere is busy. |
Notice that Chrome only looks at the document when prioritizing resources, and only when it involves JavaScript. Safari, meanwhile, also looks at JavaScript, but CSS as well, and anywhere those things might be located in the document — regardless of whether it’s in the or . That helps explain why Chrome excludes images marked as High priority in Figure 2 from its Tight Mode implementation — it only cares about JavaScript in this context.
So, even if Chrome encounters a script file with fetchpriority="high" in the document body, the file is not considered a “High” priority and it will be loaded after the rest of the items. Safari, meanwhile, honors fetchpriority anywhere in the document. This helps explain why Chrome leaves two scripts on the table, so to speak, in Figure 2, while Safari appears to load them during Tight Mode.
That’s not to say Safari isn’t doing anything weird in its process. Given the following markup:
<head>
<!-- two high-priority scripts -->
<script src="script-1.js"></script>
<script src="script-1.js"></script>
<!-- two low-priority scripts -->
<script src="script-3.js" defer></script>
<script src="script-4.js" defer></script>
</head>
<body>
<!-- five low-priority scripts -->
<img src="image-1.jpg">
<img src="image-2.jpg">
<img src="image-3.jpg">
<img src="image-4.jpg">
<img src="image-5.jpg">
</body>
…you might expect that Safari would delay the two Low-priority scripts in the until the five images in the are downloaded. But that’s not the case. Instead, Safari loads those two scripts during its version of Tight Mode.
Chrome And Safari Exceptions
I mentioned earlier that Low-priority resources are loaded in during the second phase of loading after Tight Mode has been completed. But I also mentioned that there’s a big caveat to that behavior. Let’s touch on that now.
According to Patrick’s article, we know that Tight Mode is “the initial phase and constraints loading lower-priority resources until the body is attached to the document (essentially, after all blocking scripts in the head have been executed).” But there’s a second part to that definition that I left out:
“In tight mode, low-priority resources are only loaded if there are less than two in-flight requests at the time that they are discovered.”
A-ha! So, there is a way for low-priority resources to load in Tight Mode. It’s when there are less than two “in-flight” requests happening when they’re detected.
Wait, what does “in-flight” even mean?
That’s what’s meant by less than two High- or Medium-priority items being requested. Robin demonstrates this by comparing Chrome to Safari under the same conditions, where there are only two High-priority scripts and ten regular images in the mix:
<head>
<!-- two high-priority scripts -->
<script src="script-1.js"></script>
<script src="script-1.js"></script>
</head>
<body>
<!-- ten low-priority images -->
<img src="image-1.jpg">
<img src="image-2.jpg">
<img src="image-3.jpg">
<img src="image-4.jpg">
<img src="image-5.jpg">
<!-- rest of images -->
<img src="image-10.jpg">
</body>
Let’s look at what Safari does first because it’s the most straightforward approach:
Nothing tricky about that, right? The two High-priority scripts are downloaded first and the 10 images flow in right after. Now let’s look at Chrome:
We have the two High-priority scripts loaded first, as expected. But then Chrome decides to let in the first five images with Medium priority, then excludes the last five images with Low priority. What. The. Heck.
The reason is a noble one: Chrome wants to load the first five images because, presumably, the Largest Contentful Paint (LCP) is often going to be one of those images and Chrome is hedging bets that the web will be faster overall if it automatically handles some of that logic. Again, it’s a noble line of reasoning, even if it isn’t going to be 100% accurate. It does muddy the waters, though, and makes understanding Tight Mode a lot harder when we see Medium- and Low-priority items treated as High-priority citizens.
Even muddier is that Chrome appears to only accept up to two Medium-priority resources in this discriminatory process. The rest are marked with Low priority.
That’s what we mean by “less than two in-flight requests.” If Chrome sees that only one or two items are entering Tight Mode, then it automatically prioritizes up to the first five non-critical images as an LCP optimization effort.
Truth be told, Safari does something similar, but in a different context. Instead of accepting Low-priority items when there are less than two in-flight requests, Safari accepts both Medium and Low priority in Tight Mode and from anywhere in the document regardless of whether they are located in the or not. The exception is any asynchronous or deferred script because, as we saw earlier, those get loaded right away anyway.
How To Manipulate Tight Mode
This might make for a great follow-up article, but this is where I’ll refer you directly to Robin’s video because his first-person research is worth consuming directly. But here’s the gist:
preload and preconnect), the Fetch Priority API, and lazy-loading techniques.fetchpriority=`“high“andfetchpriority=”low”` on items.<img src="lcp-image.jpg" fetchpriority="high">
<link rel="preload" href="defer.js" as="script" fetchpriority="low"
fetchpriority="high" is one way we can get items lower in the source included in Tight Mode. Using fetchpriority="low is one way we can get items higher in the source excluded from Tight Mode.Again, watch Robin’s talk for the full story starting around the 28:32 marker.
That’s Tight… Mode
It’s bonkers to me that there is so little information about Tight Mode floating around the web. I would expect something like this to be well-documented somewhere, certainly over at Chrome Developers or somewhere similar, but all we have is a lightweight Google Doc and a thorough presentation to paint a picture of how two of the three major browsers fetch and prioritize resources. Let me know if you have additional information that you’ve either published or found — I’d love to include them in the discussion.
Spotify’s hidden Star Wars Easter egg turns the playbar into a glowing lightsaber when playing certain official Star Wars playlists. This playful feature delights fans by adding a touch of the Force to their listening experience.
The list of attributes available in HTML is long and well-documented. Even if you haven’t memorized them (and there’s totally nothing wrong with an author… er… random person off the street, who has), there are a bunch of places where HTML attributes you’re familiar with will have different or more specific jobs. Let’s take a look.
name
You may have heard of the name attribute, giving a name/label to information sent through a form. And more specifically you may have used it to bring together a set of radio buttons, but you can also use it with the details element to have only one of a set of accordions open at a time.
Like if you have more than one refrigerator in the office at work, any respectable person would only open one door at a time. Right, Bob?
<details name="office-kitchen">
<summary>Refrigerator 1</summary>
Lunches, condiments, yogurt et al.
</details>
<details name="office-kitchen">
<summary>Refrigerator 2</summary>
More Lunches, leftovers from client meeting, stray cans of off-brand soda et al.
</details>
<details name="office-kitchen">
<summary>Refrigerator 3</summary>
Cookie dough someone bought from somebody’s child’s fundraiser, expired milk, unidentifiable meat et al.
</details>
See the Pen Name [forked] by Undead Institute.
title
You’ve probably heard of the universal attribute title. It’s typically thought of as the built-in tooltip text, but three elements have special semantics for the title attribute: input and the rarely used gems, the definition (dfn) element, and the abbreviation (abbr) element.
If you’re using a pattern attribute on an input to provide some regex-based error correction, then you should definitely tell the user how to meet the criteria you’re using. The title attribute can be used both as a tooltip and as the message shown when the user doesn’t meet that criteria.
<form method="post" action="#">
<label>Who took my <em>well labeled</em> yogurt from the company fridge? I know it was you, Bob.<br>
<input type="text" pattern="Bob [A-Za-z].+" title="There are many Bobs. The only question is which one it was. Please limit your answers to Bob and his/her last name.">
</label><br>
<button type="submit">Submit</submit>
</form>
See the Pen Title – Input [forked] by Undead Institute.
For a dfn element, if you use the title attribute, then it has to include the term being defined. dfn should still have text in it, but it can be an abbreviation or a different form of the term.
<p><dfn title="Office Yogurt Thief">OYG</dfn>’s are a pox on humanity. Stealing yogurts from the office fridge even when they are labeled.</p>
See the Pen Title – dfn [forked] by Undead Institute.
A title on an abbr element not only sets the tooltip but explicitly has the expansion of the abbreviation or acronym. As it says in the spec: “The [title] attribute, if specified, must contain an expansion of the abbreviation, and nothing else.” That’s the specification’s equivalent of threatening a mafia hit if you aren’t careful with your title attributes. You have been warned, Bob.
When dealing with a suspected yogurt thief, we must create a <abbr title="Human Resources Special Task Force on Yogurt Theft">HRSTFYT</abbr> to deal with the problem.
See the Pen Title – abbr [forked] by Undead Institute.
value
The value attribute is well known for setting default values on inputs, but you can also use it on a list item (li) within an ordered list (ol) to change the number of that item and all that follow it. It only takes integers, but you can use it no matter what type of ordered list you use (numeric, alphabetical, or Roman numerals).
<h1>Favorite Co-workers</h1>
<ol>
<li>Tina</li>
<li>Keesha</li>
<li>Carlos</li>
<li>Jamal</li>
<li>Scott</li>
<li value="37">Bob</li>
<li>Bobbie</li>
<li>Bobby</li>
<li>"Rob"</li>
</ol>
See the Pen Value [forked] by Undead Institute.
datetime
You might have used a datetime attribute on a time element to provide a machine-readable format of the time and/or date represented in the time element’s text:
<time datetime="2024-12-09">Dec. 12, 2024</time>
The same attribute can also be used with the ins and del elements (used for notating an addition/insertion and deletion of content, respectively). The datetime attribute on ins and del provides a machine-readable date (and optionally a time) for when the change was made. You can show it to the visitor if you like, but it’s mainly intended for private use.
Check out the edits of the original version of an earlier example:
When dealing with a <ins datetime="2024-11-17">suspected</ins> yogurt thief <del datetime="2024-11-17">, like Bob,</del> we must create a <abbr title="Human Resources Special Task Force on Yogurt Theft">HRSTFYT</abbr> to deal with <del datetime="2024-11-17">Bob</del> <ins datetime="2024-11-17">the problem</ins>.
See the Pen Datetime [forked] by Undead Institute.
As an added note, screenreaders do not announce the datetime attribute in this context.
cite
Sticking with our oft-neglected friends ins and del, the cite attribute that you use on blockquote and q elements to provide a URL of the source of the quotation can also be used on ins and del to provide the URL of a document explaining the changes.
When dealing with a <ins datetime="2024-11-17" cite="https://codepen.io/undeadinstitute/full/VYZeaZm">suspected</ins> yogurt thief <del datetime="2024-11-17" cite="https://codepen.io/undeadinstitute/full/VYZeaZm">, like Bob,</del> we must create a <abbr title="Human Resources Special Task Force on Yogurt Theft">HRSTFYT</abbr> to deal with <del datetime="2024-11-17" cite="https://codepen.io/undeadinstitute/full/VYZeaZm">Bob</del> <ins datetime="2024-11-17" cite="https://codepen.io/undeadinstitute/full/VYZeaZm">the problem</ins>.
See the Pen Cite [forked] by Undead Institute.
Again, these dates are not announced in assistive tech, like screen readers.
multiple
You probably know the multiple attribute as that more-than-meets-the-eye attribute that transforms a dropdown menu into a multi-select box, like a co-worker who lets you choose two donuts from the box. (I’m lookin’ at you, Tina.) But it has two other uses as well. You can add it to both a file input and an email input to accept multiple files and emails, respectively.
<form method="post" action="#">
<label>Upload complaint forms (about Bob) <input type="file" multiple> </label><br>
<label>Email all of Bob’s bosses: <input type="email" multiple></label><br>
<button type="submit">Submit</submit>
</form>
Just be sure that the emails are comma-separated.
See the Pen Multiple [forked] by Undead Institute.
for
In your travels across the internet, you’ve probably come across the for attribute when it’s used to associate a label element with a form field (input, select, textarea, etc.), but you can also use it to explicitly associate the elements of a calculation with an output element.
Unlike a label–input relationship, which is a one-to-one relationship (i.e., one label for one field), the for attribute used on an output can hold an unordered, space-separated list of IDs of the fields that contributed to the calculation.
<form method="post" action="#" id="comeuppance">
<fieldset><legend>Defendant name</legend>
<label>First Name: <input name="fname" type="text"></label>
<label>Last Name: <input name="lname" type="text"></label>
</fieldset>
<label>Number of yogurts stolen (unlabeled):
<input name="numunlbld" id="numstolen-unlbld" type="number">
</label> *
<label>Unlabeled Multiplier:
<input name="multiunlbld" id="multi-unlbld" type="number" value="0.5">
</label> +
<label>Number of yogurts stolen (labeled):
<input name="numlbld" id="numstolen-lbld" type="number">
</label> *
<label>Labeled Multiplier:
<input name="multilbld" id="multi-lbld" type="number" value="1.5">
</label> =
<label>Suggested prison term (in years):
<output id="answer" for="numstolen-unlbld numstolen-lbld multi-unlbld multi-lbld"></output>
</label>
</form>
See the Pen For [forked] by Undead Institute.
target
Just like you can use a target attribute to open a link in a new tab/window, you can use the same target attribute and value _blank to have a form open the response in a new tab/window.
<form method="post" action="#" id="comeuppance" target="_blank">
[...]
</form>
disabled
You may have used the disabled attribute to knock out an individual form field, but you can also use it to disable every descendant of a fieldset element.
No matter what HR says and its innocent-until-proven-guilty ethos, we all know Bob did it. Don’t we?
<form method="post" action="#" id="comeuppance">
<fieldset disabled><legend>Defendant name</legend>
<label>First Name: <input name="fname" type="text" value="Bob"></label>
<label>Last Name: <input name="lname" type="text" value="McBobberson"></label>
</fieldset>
[...]
</form>
See the Pen Disabled [forked] by Undead Institute.
Attribute Selectors
While not technically an HTML tip, attributes can also be used as selectors in CSS. You put square brackets around the attribute name and you’ll select all elements that contain that attribute.
<style>
[title] {
background-color: red;
}
</style>
<h1>List of <del>Suspects</del><ins>Co-workers</ins></h1>
<ol>
<li>Fred</li>
<li>Rhonda</li>
<li>Philomina</li>
<li>Cranford</li>
<li>Scott</li>
<li title="the guilty one">Bob</li>
<li>Bobbie</li>
<li>Bobby</li>
<li>"Rob"</li>
</ol>
See the Pen Attribute Selector [forked] by Undead Institute.
There’s actually a whole lot more you can do with attribute selectors, but that’s the topic of another article — literally.
Wrapping Up
Okay, now that we’ve learned some trivia we can use to properly prosecute Bob’s office and yogurtorial transgressions, do you have a favorite HTML attribute I didn’t discuss? Show off your personal life-of-the-party energy in the comments. (And, yes, cool people have a favorite HTML attribute… really cool people… right? Right?? Right!?!?!?!?!)
A professional font can improve the user experience by 40%. Choosing a font for your website may seem like a minor issue.
In reality, typography is a pretty important web design element to pay attention to.
Think about it. Your marketing messages consist of words. If your target audience can’t read those words, then what good is your message?
How can people know how awesome your product is if something as simple as a font can get in the way?
In this article, we’ll explain the importance of an attractive, readable, brand-consistent font and how to choose the right one to boost user engagement.
Typography in web design because it impacts how your audience perceives and interacts with your content.
A well-chosen font can enhance readability, convey your brand’s personality, and improve user engagement.
Helvetica, for example, is a popular font known for its clean, modern look and excellent readability. This makes it effective for engaging users.
Beaches of Normandy Tours, a tour agency focused on WWII historical tours, uses Helvetica in its blog articles to attract history enthusiasts, veterans, soldiers, and relatives. They use Helvetica’s clear and simple design to create a sense of professionalism and trust.
For example, their article about The Liberation of Paris combines Helvetica with historical photos, making the content easy to read and visually appealing. This approach makes blogs more user-friendly and keeps readers engaged by presenting reliable historical information in an attractive way.
Different fonts can evoke various emotions and perceptions, which influence how users feel about a website and its content. This is called font psychology.
With their traditional and elegant look, Serif fonts often evoke feelings of reliability and sophistication. With their clean and modern appearance, it’s no wonder why about 85% of fonts on the web are Sans-serif fonts.
Their simplicity and clarity make them universal fonts to use in a variety of industries and websites.
On the other hand, script fonts can appear personal and creative, while decorative fonts add a unique and distinctive flair.
StudioSuits, a brand that sells seersucker suits for men, uses simple fonts on its website. It uses the custom font Unna for its headings and a Sans-serif font for its text. This combination creates a sophisticated and engaging experience that aligns with the brand’s simplistic design ethos.
Now, with that out of the way, let’s look at some best practices to consider when selecting website fonts for a beautiful, user-friendly design.
Understanding your audience can help you choose the right font for your website because different demographics have varying preferences and expectations. Knowing your audience’s age, interests, and cultural background can guide you in choosing fonts that resonate with them and enhance their user experience.
For example, Cruise America, a leading provider of RV rentals in Denver, serves the travel industry and aims to evoke a sense of adventure and freedom. The brand incorporates a script-type font for its headings to create a stylish and inviting feel while keeping the remaining fonts simple for readability.
It uses a custom font called Recklame Script, a handwriting font that adds a unique, stylish look, helping to engage its audience and reflect the excitement of travel.
Some tips for choosing fonts that resonate with your audience:
Marketers see a 30% increase in customer engagement when they use fonts that are consistent with their brand.
So, when your font choices reflect the personality of your brand, it creates a sense of authenticity that resonates with your target customer.
For example, a professional corporate brand might benefit from clean, Sans-serif fonts that convey reliability and a sense of trust.
On the other hand, a creative brand might opt for decorative or handwritten fonts that convey innovation and playfulness.
A marketing agency would be a perfect example of a brand that can use more expressive typography. Note the screenshot below. Level Agency uses a bold, creative font to grab attention and convey its innovative approach to marketing.
Only 30% of websites consider font accessibility for visually impaired users. Don’t be part of the other 70% with incorrect letter spacing or Times New Roman font at 8 points with no white space.
No matter how attractive a font is, if it isn’t easy to read, it’s not going to delight your visitors. That means they’re more likely to leave your site, especially if they have a visual impairment.
So, test your chosen fronts across different devices and screen sizes to ensure legibility. Avoid decorative fonts for body text. If you must use them, save them for headings or accent elements.
Make sure there’s enough contrast between your text and background. Dark text on a light background, or vice versa, usually works best.
Add visual interest to your web design by choosing complementary fonts. Consider using a more expressive, bold font for headings. Choose a simpler, more readable font for body takes. Make sure the fonts you pair have contrasting but harmonious styles.
You can also use different font weights (bold, regular, light) to establish a visual hierarchy. This can help you guide users through the content smoothly.
The font(s) you choose can take your website design to the next level. It’s a small piece of the web design puzzle, but an important piece nonetheless.
Test out different styles and capture the essence of your brand. Think about your customers and the industry you serve.
Following these tips can help you find the right font combination that complements your overall web design and ensures a smooth user experience.
Here’s to your success!
Featured image by Natalia Y. on Unsplash
The post Typography in Web Design: Choosing Fonts that Enhance User Engagement appeared first on noupe.
Getty Images and Shutterstock are merging in a $3.7 billion deal, creating a powerhouse for visual content with expanded libraries, cutting-edge AI tools, and integrated solutions for creatives. This merger promises to streamline access to assets and innovate resources for designers.
This article is a sponsored by Cloudways
Product launches and sales typically attract large volumes of traffic. Too many concurrent server requests can lead to website crashes if you’re not equipped to deal with them. This can result in a loss of revenue and reputation damage.
The good news is that you can maximize availability and prevent website crashes by designing websites specifically for these events. For example, you can switch to a scalable cloud-based web host, or compress/optimize images to save bandwidth.
In this article, we’ll discuss six ways to design websites for high-traffic events like product drops and sales:
Let’s jump right in!
How To Design For High-Traffic Events
Let’s take a look at six ways to design websites for high-traffic events, without worrying about website crashes and other performance-related issues.
One of the simplest ways to design a website that accommodates large volumes of traffic is to optimize and compress images. Typically, images have very large file sizes, which means they take longer for browsers to parse and display. Additionally, they can be a huge drain on bandwidth and lead to slow loading times.
You can free up space and reduce the load on your server by compressing and optimizing images. It’s a good idea to resize images to make them physically smaller. You can often do this using built-in apps on your operating system.
There are also online optimization tools available like Tinify, as well as advanced image editing software like Photoshop or GIMP:
Image format is also a key consideration. Many designers rely on JPG and PNG, but adaptive modern image formats like WebP can reduce the weight of the image and provide a better user experience (UX).
You may even consider installing an image optimization plugin or an image CDN to compress and scale images automatically. Additionally, you can implement lazy loading, which prioritizes the loading of images above the fold and delays those that aren’t immediately visible.
The most convenient way to design a high-traffic website without worrying about website crashes is to upgrade your web hosting solution.
Traditionally, when you sign up for a web hosting plan, you’re allocated a pre-defined number of resources. This can negatively impact your website performance, particularly if you use a shared hosting service.
Upgrading your web host ensures that you have adequate resources to serve visitors flocking to your site during high-traffic events. If you’re not prepared for this eventuality, your website may crash, or your host may automatically upgrade you to a higher-priced plan.
Therefore, the best solution is to switch to a scalable web host like Cloudways Autonomous:
This is a fully managed WordPress hosting service that automatically adjusts your web resources based on demand. This means that you’re able to handle sudden traffic surges without the hassle of resource monitoring and without compromising on speed.
With Cloudways Autonomous your website is hosted on multiple servers instead of just one. It uses Kubernetes with advanced load balancing to distribute traffic among these servers. Kubernetes is capable of spinning up additional pods (think of pods as servers) based on demand, so there’s no chance of overwhelming a single server with too many requests.
High-traffic events like sales can also make your site a prime target for hackers. This is because, in high-stress situations, many sites enter a state of greater vulnerability and instability. But with Cloudways Autonomous, you’ll benefit from DDoS mitigation and a web application firewall to improve website security.
As you’d expect, large volumes of traffic can significantly impact the security and stability of your site’s network. This can result in website crashes unless you take the proper precautions when designing sites for these events.
A content delivery network (CDN) is an excellent solution to the problem. You’ll get access to a collection of strategically-located servers, scattered all over the world. This means that you can reduce latency and speed up your content delivery times, regardless of where your customers are based.
When a user makes a request for a website, they’ll receive content from a server that’s physically closest to their location. Plus, having extra servers to distribute traffic can prevent a single server from crashing under high-pressure conditions. Cloudflare is one of the most robust CDNs available, and luckily, you’ll get access to it when you use Cloudways Autonomous.
You can also find optimization plugins or caching solutions that give you access to a CDN. Some tools like Jetpack include a dedicated image CDN, which is built to accommodate and auto-optimize visual assets.
When a user requests a website, it can take a long time to load all the HTML, CSS, and JavaScript contained within it. Caching can help your website combat this issue.
A cache functions as a temporary storage location that keeps copies of your web pages on hand (once they’ve been requested). This means that every subsequent request will be served from the cache, enabling users to access content much faster.
The cache mainly deals with static content like HTML which is much quicker to parse compared to dynamic content like JavaScript. However, you can find caching technologies that accommodate both types of content.
There are different caching mechanisms to consider when designing for high-traffic events. For example, edge caching is generally used to cache static assets like images, videos, or web pages. Meanwhile, database caching enables you to optimize server requests.
If you’re expecting fewer simultaneous sessions (which isn’t likely in this scenario), server-side caching can be a good option. You could even implement browser caching, which affects static assets based on your HTTP headers.
There are plenty of caching plugins available if you want to add this functionality to your site, but some web hosts provide built-in solutions. For example, Cloudways Autonomous uses Cloudflare’s edge cache and integrated object cache.
One of the best ways to design websites while preparing for peak traffic is to carry out comprehensive stress tests.
This enables you to find out how your website performs in various conditions. For instance, you can simulate high-traffic events and discover the upper limits of your server’s capabilities. This helps you avoid resource drainage and prevent website crashes.
You might have experience with speed testing tools like Pingdom, which assess your website performance. But these tools don’t help you understand how performance may be impacted by high volumes of traffic.
Therefore, you’ll need to use a dedicated stress test tool like Loader.io:
This is completely free to use, but you’ll need to register for an account and verify your website domain. You can then download your preferred file and upload it to your server via FTP.
After that, you’ll find three different tests to carry out. Once your test is complete, you can take a look at the average response time and maximum response time, and see how this is affected by a higher number of clients.
The final way to design websites for high-traffic events is to refine the WordPress back end.
The admin panel is where you install plugins, activate themes, and add content. The more of these features that you have on your site, the slower your pages will load.
Therefore, it’s a good idea to delete any old pages, posts, and images that are no longer needed. If you have access to your database, you can even go in and remove any archived materials.
On top of this, it’s best to remove plugins that aren’t essential for your website to function. Again, with database access, you can get in there and delete any tables that sometimes get left behind when you uninstall plugins via the WordPress dashboard.
When it comes to themes, you’ll want to opt for a simple layout with a minimalist design. Themes that come with lots of built-in widgets or rely on third-party plugins will likely add bloat to your loading times. Essentially, the lighter your back end, the quicker it will load.
Conclusion
Product drops and sales are a great way to increase revenue, but these events can result in traffic spikes that affect a site’s availability and performance. To prevent website crashes, you’ll have to make sure that the sites you design can handle large numbers of server requests at once.
The easiest way to support fluctuating traffic volumes is to upgrade to a scalable web hosting service like Cloudways Autonomous. This way, you can adjust your server resources automatically, based on demand. Plus, you’ll get access to a CDN, caching, and an SSL certificate. Get started today!
The FTC has ordered accessiBe to pay $1 million for falsely claiming its AI-powered tool could make websites fully compliant with accessibility standards. This action is part of the FTC’s crackdown on deceptive AI marketing practices.
I never thought my family would be able to do this. My parents are of hardscrabble rural West Virginia and rural North Carolina origins. They barely managed to claw their way to the bottom of the middle class by the time they ended up in Virginia. Unfortunately, due to the demons passed on to them by their parents, my father was an alcoholic and my mother participated in the drinking. She ended up divorcing my father when I was 16 years old. It was only after the divorce that my parents were able to heal themselves, heal their only child, and stop the drinking, which was so destructive to our family. If the divorce hadn’t forced the issue, alcohol would have inevitably destroyed us all.
My parents may not have done everything right, but they both unconditionally loved me. They taught me how to fully, deeply receive love, and the profound joy of reflecting that love upon everyone around you.
I went on to attend public school in Chesterfield County, Virginia. In 1992 I graduated from the University of Virginia, founded by
We are at an unprecedented point in American history, and I’m concerned we may lose sight of the American Dream:
We must act now to keep the dream alive. Our family made eight $1 million donations to nonprofit groups working to support those most currently in need:
I encourage every American to contribute soon, however you can, to organizations you feel are effectively helping those most currently in need here in America.
We must also work toward deeper changes that will take decades to achieve. Over the next five years, my family pledges half our wealth towards long term efforts ensuring that all Americans continue to have access to the American Dream.
I never thought my family would be able to do this. My parents are of hardscrabble rural West Virginia and rural North Carolina origins. They barely managed to claw their way to the bottom of the middle class by the time they ended up in Virginia. Unfortunately, due to the demons passed on to them by their parents, my father was an alcoholic and my mother participated in the drinking. She ended up divorcing my father when I was 16 years old. It was only after the divorce that my parents were able to heal themselves, heal their only child, and stop the drinking, which was so destructive to our family. If the divorce hadn’t forced the issue, alcohol would have inevitably destroyed us all.
My parents may not have done everything right, but they both unconditionally loved me. They taught me how to fully, deeply receive love, and the profound joy of reflecting that love upon everyone around you.
I went on to attend public school in Chesterfield County, Virginia. In 1992 I graduated from the University of Virginia, founded by Thomas Jefferson.
During college, I worked at Safeway as a part-time cashier, earning the federal minimum wage, scraping together whatever money I could through government Pell grants, scholarships, and other part-time work to pay my college tuition. Even with lower in-state tuition, it was rocky. Sometimes I could barely manage tuition payments. And that was in 1992, when tuition was only $3,000 per year. It is now $23,000 per year. College tuition at a state school increased by 8 times over the last 30 years. These huge cost increases for healthcare, education, and housing are not compatible with the American Dream.
Programmers all over the world helped make an American Dream happen in 2008 when we built Stack Overflow, a Q&A website for programmers creating a shared Creative Commons knowledge base for the world. We did it democratically, because that’s the American way. We voted to rank questions and answers, and held elections for community moderators using ranked choice voting. We built a digital democracy – of the programmers, by the programmers, for the programmers. It worked.
With the guidance of my co-founder Joel Spolsky, I came to understand that the digital democracy of Stack Overflow was not enough. We must be brave enough to actively, openly share love with each other. That became the foundation for Discourse, a free, open source tool for constructive, empathetic community discussions that are also Creative Commons. We can disagree in those discussions because Discourse empowers communities to set boundaries the community agrees on, providing tools to democratically govern and strongly moderate by enforcing these boundaries. Digital democracy and empathy, for everyone.
In order for digital democracy to work, we need to see each other through our screens.
We often behave online in ways we never would in the real world because we cannot see the person on the other side of the screen. But as our world becomes more digital, we must extend our kindness through that screen.
I’ve always felt Stack Overflow and Discourse are projects for the public good that happen to be corporations. I probably couldn’t have accomplished this in any other country, and I was rewarded handsomely for a combination of hard work and good luck. That’s what the American Dream promises us.
We built it, and people came. I earned millions of dollars. I thought that was the final part of the American Dream. But it wasn’t.
I recently attended a theater performance of The Outsiders at my son’s public high school. All I really knew was the famous “stay gold” line from the 1983 movie adaptation. But as I sat there in the audience among my neighbors, watching the complete story acted out in front of me by these teenagers, I slowly realized what staying gold actually meant: sharing the American Dream.
In the printed program, the director wrote:
This play is a reminder that strength lies not just in overcoming hardships but in staying true to ourselves and lifting up those around us.
We hope you feel the raw emotions, sense the camaraderie, and connect with the enduring themes of resilience, empathy, and unity. Whether you’ve read this story recently, long ago, or not at all, I hope you are able to find inspiration in the strength and passion of youth. Thank you for being part of this journey with us.
I believe deeply in sharing The American Dream. It is the foundation of our country, the second paragraph in our Declaration of Independence, written by the founder of the public university I attended:
We hold these truths to be self-evident, that all men are created equal, that they are endowed by their Creator with certain unalienable Rights, that among these are Life, Liberty and the pursuit of Happiness.
But the American Dream is not always available to every American. Its meaning can be distorted. Jimi Hendrix captured this distortion so eloquently in his rendition of our national anthem.
We are still trying to live up to those ideals today. In November 2024, enough of us voted for people who interpret the dream in a way that I don’t understand.
34% of adults in America did not exercise their right to vote. Why? Is it voter suppression, gerrymandering causing indifference, or people who felt their vote didn’t matter? The 7.6% that are ineligible to vote are mostly adults living in America who have not managed to attain citizenship, or people convicted of a felony. Whatever the reasons, 42% of adults living in America had no say in the 2024 election. The vote failed to represent everyone.
I think many of the Americans who did vote are telling us they no longer believe our government is effectively keeping America fair for everyone. Our status as the world’s leading democracy is in question. We should make it easier for more eligible Americans to vote, such as making election day a national holiday, universal mail in voting, and adopting ranked choice voting so all votes carry more weight. We should also strengthen institutions keeping democracy fair for everyone, such as state and local election boards, as well as the Federal Election Commission.
It was only after I attained the dream that I was able to fully see how many Americans have so very little. This much wealth starts to unintentionally distance my family from other Americans. I no longer bother to look at how much items cost, because I don’t have to. We don’t have to think about all these things that are challenging or unreachable for so many others. The more wealth you attain, the more unmistakably clear it becomes how unequal life is for so many of us.
Even with the wealth I have, I can’t imagine what it would feel like to be a billionaire. It is, for lack of a better word, unamerican.
In 2012, the top 1% of Americans held 24% of our country’s wealth. By 2021, the top 1% of Americans held 30%. So many have so little, while a tiny few have massive, wildly disproportionate wealth, which keeps growing. Now the global top 1% hold nearly twice as much wealth as the rest of the world combined.
I grew up poor in America, inspired by the promise of the American Dream that I could better myself and my family by building things that mattered:
Work is service, not gain. The object of work is life, not income. The reward of production is plenty, not private fortune. We should measure the prosperity of a nation not by the number of millionaires, but by the absence of poverty, the prevalence of health, the efficiency of the public schools, and the number of people who can and do read worthwhile books.
Our version of capitalism delivered so much wealth to my family for my hard work in co-founding two successful companies. My partner and I gladly paid our full taxes, and we always planned to give most of our remaining wealth to charities when we pass, following the Warren Buffet Philanthropic Pledge:
More than 99% of my wealth will go to philanthropy during my lifetime or at death.
I admire Buffett, but even having only a tiny fraction of his $325 billion fortune, to me this pledge was incomplete. When would this wealth be transferred?
Last year he amended the pledge, giving all his wealth at death to a charitable trust run by his children, aged 71, 69, and 66, who do not make for natural charitable bedfellows. I am only holding back enough wealth for my children so they can afford college educations and buy a home. I am compelled to, because being a parent is the toughest job I’ve ever had, and I am concerned about their future.
November 5th raised the stakes. It is now time to allocate half the wealth I was so fortunate to be dealt within the next five years, not just for my own family, but for all my fellow Americans.
Our government seems to be slower and slower at delivering change due to the increased polarization of our two party system. The last meaningful constitutional amendment we’ve managed to pass in the last 60 years was the 26th amendment in 1971, lowering the voting age to 18 and giving more people a voice in our democracy.
Political polarization is at historically high levels and rising. In a two party system, this level of polarization is counterproductive and even dangerous. Do we all still believe in the same American Dream?
I’ve always loved the ideals behind the American Dream, though we continually struggle to live up to them. They are worth fighting for, even if it means making “good trouble”. We must come together and believe in our shared American Dream so deeply that we can improve our democracy… but which dream?
The American Dream contains the path of hate, and the path of love. Throughout our history, one hand is always fighting the other. Which path are we choosing?
Our family pledges half our wealth toward an American Dream founded on love.
Here are some starting points for longer term efforts:
We’ve already completed the eight $1 million donations listed above to help those most immediately in need. Within the next five years, half of our family wealth will support longer term efforts. There is no single solution, so let’s work together. I will gladly advise and empower others working towards the same goal.
Please join us in Sharing the American Dream:
Stay gold, America.
(I could not have done this without the support of my partner Betsy Burton and the rest of my family. I’d also like to thank Steve McConnell, whose writing inspired me to start this blog in 2004. So many people from all walks of life generously shared their feedback to improve this post. We wrote it together. Thank you all.)
Starting an affiliate program is one of the most effective ways to generate traction and grow your business.
You authorize others to promote your solutions on your behalf and compensate for their efforts in the form of commissions.
However, offering an affiliate program isn’t a one-time thing. There are certain ongoing tasks you need to perform for your affiliate program to get you the desired results.
The goal here is to maintain healthy partnerships with your affiliates and ensure regulatory compliance.
Knowing which tasks to perform to enhance the credibility and performance of your affiliate program can be challenging.
Hence, we have come up with a list of maintenance tasks that you should consider to make things easy for you.
A common mistake is thinking that once you have initiated an affiliate program, you should wait for others to join. A smart move is to actively reach out to promising candidates and ask them to consider what you bring to the table.
Influencer recommendations convince around 88% of people to purchase certain products or services. It makes influencers worthy candidates for affiliate programs. All you need to do is find the right ones that believe in your vision.
Also, consider contacting content creators with a decent number of followers on social media who are comfortable publishing sponsored posts.
It’s a maintenance task for your affiliate program that enables you to grow fruitful partnerships and increase your chances of generating more revenue.
Another maintenance task you should consider is optimizing your landing page for better reach.
Entrepreneurs, influencers, and content creators often use search engines to look for fitting affiliate programs that they can join. Hence, optimizing your affiliate landing page helps you generate traction organically and attract promising prospects.
Search engine optimization also complements your authority. When your affiliate page ranks among the top search engine recommendations, your prospects feel more motivated to join your program.
As more candidates show a willingness to join your affiliate program, your chances of shortlisting and partnering with suitable affiliates increase significantly.
It’s a huge mistake to put affiliate induction on hold. As your affiliate program becomes more popular, you may see a lot of people joining it.
The time may come when you feel like you reached the limit, and you should stop onboarding more affiliates. It’s when many businesses stop entertaining applications they receive from potential affiliates.
The problem is that all affiliates in your program aren’t active. Some may be dormant, whereas others may leave the program somewhere down the road.
Hence, you should actively onboard affiliates to keep your affiliate program up and running. If you feel like you have an overwhelming number of active affiliates, you should reach out to applicants and thank them for wanting to join your program.
Communicate that you have stopped inducting affiliates for the time being and will cater to their request as soon as you resume onboarding.
It helps you build healthy relationships with the candidates and maintain a good reputation in your respective industry.
Affiliates are representatives of your brand. How your affiliates promote your offerings and engage the intended audience has a profound impact on your reputation in the industry.
Moreover, your affiliates’ efforts contribute to your revenue-generating capability. Hence, you should consider tracking their performance.
Affiliate performance review serves two purposes. First, it helps you to identify high-performing partners in your affiliate program. You can help them access useful resources and tools, which boosts their performance even further and enables them to drive more traffic for you.
You can strategize with your high-performing affiliates, enabling them to overcome the challenges they encounter and operate at their maximum efficiency.
Second, you can detect affiliates who are not performing up to your expectations and help them do better.
Affiliate programs perform well when the concerned stakeholders work in close coordination. Your role as an onboarding brand is to be a guide to the affiliates joining your program.
They are your ambassadors. Ideally, you should help them promote your solutions to the right audience. After all, it helps you fuel your sales funnel with more quality leads.
One of the reasons affiliates underperform is the lack of training. It happens when aspiring entrepreneurs start their journey and pick affiliate marketing as a business model.
They often struggle to drive traffic due to their lack of experience and the inability to promote the products or services to the right audience.
They have just started their entrepreneurial journey and don’t know how affiliate marketing works. In this case, it is the responsibility of onboarding brands to train their affiliates and show them how to promote their solutions to the right people.
Not everyone joining an affiliate program is a veteran marketer. So, you can’t have the same expectations from them all.
You should pay close attention to prospects who are new to the world of affiliate marketing. As a matter of fact, even seasoned marketers require training to promote your products or services the right way.
Therefore, conducting affiliate training should be one of the most important tasks on your to-do list. With well-designed training, you can help your affiliates identify relevant sources to drive traction and deploy useful tactics to perform as per your expectations.
You may encounter multiple issues when running an affiliate program. Disagreements between brands and their respective affiliates are common occurrences, especially when it comes to payouts.
It makes conflict resolution one of the most important ongoing tasks when managing an affiliate program.
Your affiliates often reach out to you when they face any issues as part of your affiliate program. However, you shouldn’t solely rely on them to do so. Instead, actively reach out to your affiliates from time to time and inquire about their concerns.
Even if they don’t report any problems, you can ask them for their suggestions to help you make your program better.
It makes your affiliate program stand out among other alternatives and enables you to maintain lasting relationships with people onboard.
Running a successful affiliate program requires effective maintenance. You need to perform a series of tasks to ensure that you maintain healthy relationships with your affiliates and drive the desired results from your initiative.
We have discussed the most important tasks that you must consider. However, efficient affiliate program maintenance isn’t limited to the action items we talked about.
The tasks we mentioned will help you get started. You can explore other important ones to consider as you go.
Featured image by 1981 Digital on Unsplash
The post 6 Maintenance Tasks to Conduct for Your Affiliate Program appeared first on noupe.
