Caching doesn't get talked about that much; but it can really affect the web browsing experience.

What Is Caching?: Here's a great definition: "Caching is the process of storing data in a cache. A cache is a temporary storage area. ... When you return to a page you’ve recently looked at, the browser can get those files from the cache rather than the original server, saving you time and saving the network the burden of additional traffic." (from the good people at WhatIs.Com)

For instance, if a web page has a large number of photos on it, it will take a long time (aka a couple of seconds) for it to load all of the photos. But the next time you visit the same page, it will load drastically faster since it's likely "caching" the photos. The photos themselves have been downloaded to a spot on your computer or device, usually in an out of the way folder.

Exactly how long those files get cached is controlled in a few places. That's what this post is about - first for casual visitors, then later for web developers.


Web Users - What You Need To Know About Caching

Have you ever visited a site where what you're seeing doesn't match what somebody told you to expect at the site? Somebody may have told you to return to a site to see a particular photo, but that new photo isn't there. This is likely a caching issue. What's happening is that the website really has changed, but caching settings have "held onto" the earlier version of the page as it was when you previously visited. You want to shake the page loose to show the new content. Often times a page refresh will do the trick; press F5 key in your browser, or the Refresh button.

If that doesn't work, you might want to change your default cache settings - to hold on to previous views of websites for shorter periods of time. Here are some online instructions for changing your browsers cache settings.
   -  Chrome
   -  MS Edge
   -  Safari
   -  Firefox
   -  Opera

If at any time you feel like websites routinely seem slow, especially when there are lots of photos - then perhaps visit these same settings in your browser and make sure default cache settings hold onto previously loaded images for longer periods in time.

Also, when somebody helping you troubleshoot something on the web, sometimes they'll ask you to "clear your cache". You should be able to do that at the URLs listed above for each browser.


Another Way To Force A Re-Cache Of A Site

Let's say you're at our website where the URL is www.plannedscape.net. Another way to force a refresh is to create some unusual, fake argument or parameters to the web site in the URL field. So you can change www.plannedscape.net to www.plannedscape.net?anything=random (where the words "anything" and "random" can really be any words you want). Store that idea away for future use.


Website Cache Preferences Take Precedence Over User Browser Settings

This is very important for both web developers and garden variety people looking at web pages: When web developers or web sites explicitly specify how long to cache their images, then these settings take preference over the viewer's browser default cache settings.

With that said, the rest of this article is intended for web developers and not the general public. To those of you dropping off here, thanks for making it this far. We'll see you on future blog posts.


Developers- Meet Your .htaccess File

If you're a web developer or admin, please tell us that you've heard of the .htaccess file. It's in your web site's root directory and it controls a lot of things about how browsers will access your site. Here's a great rundown: https://ithemes.com/blog/what-is-the-htaccess-file/ DESCRIPTION

What you'll want to do to control how long browsers will hold on or cache your photos or page elements (like .CSS). Below is a screen capture of part of our .htaccess file here at Plannedscape. We use the ExpiresByType convention to control how long to cache for various file types with the "access plus" parameter. This should seem fairly self-explanatory.




While Developing - Caching Keeping Your Changes From Showing Up

Sometimes while you're developing, you might have a "Things don't look any different" moment of frustration. That's likely a symptom of over-caching. It seems to really happen a lot when making changes to a .CSS file. You're trying to change something about your layout, you upload a new .CSS file with design modifications, but then when you refresh the page, the changes don't seem to take effect.

May we suggest temporarily changing the .htaccess file for CSS files and then reload. Or call the full URL location of your CSS file and click refresh. If you don't see your latest changes to CSS there after that, then call your CSS file with a dummy argument, like www.yoursite.com/style.css?ShakeIt=Loose


Good Luck!

If you're curious about other trouble shooting tips or best practices, feel free to reach out to us. Otherwise, you should be good to go and on your way. Remember: As a web developer, take advance of htaccess and things you can control on your side to employ best practices; don't just rely on users' default configuration settings to do things in a way that optimizes your site to look its best. Good luck!