6 Ways to Improve Your Online Security

Cyber Security

As our businesses and personal lives are increasingly conducted online, it is more important than ever to keep our digital activities as safe and secure as possible. Here I will share some tips for safeguarding not only your website but your personal digital presence in general.

1) Keep your apps and software up to date, including WordPress

One of the main reasons why software developers provide regular updates is for security patches. So if you are running old software versions you are potentially exposing your computer to security vulnerabilities that have long since been fixed. This includes your computer itself — you are much safer if you keep your computer’s operating system up to date. I know some of you are reluctant to update your OS because of certain software compatibility issues (*cough* Adobe CS6 *cough*), but you should really consider whether it’s worth running an old OS that is vulnerable to all kinds of viruses and malware.

Also, if you have a WordPress blog, you MUST regularly update it and all its plugins to the latest versions! It’s easy, just log in to the WP admin and click the updates link in the menu when it shows that updates are available. Just follow the directions there and after a few clicks it’s all done.

Continue reading

5 Common Admin Mistakes to Watch Out For

Homer at workWith the WideRange Galleries Admin software, I strive to provide robust yet intuitive tools to manage all of your galleries, photos, prints, and other website content. While some website companies opt to make their admin panels as easy as possible by dumbing down the available options, I prefer to offer more powerful tools even though I realize that in some cases it may increase the risk of confusion or misuse. In this article I will explain the most common pitfalls that clients sometimes make in the WideRange Admin.

1) Overuse of Embedded Formatting in Text

The WideRange Admin features advanced text field editors that make it easy to add links, insert images or videos, add lists, or apply special styling to text. It is this last feature that is often abused, particularly when it comes to changing text colors and alignment.

Keep in mind that these text editors are NOT what-you-see-is-what-you-get text editors! Your text will look different on your website than it looks in the admin. For example, in the admin text editors the text is always black on a white background, but your website might have light grey text on a black background. The default fonts and font sizes will also be different. Your website already applies default text styling and formatting, so there’s no need to apply it manually in the admin. There’s almost never a need to change your text colors or text alignments in the admin, except for occasional unique circumstances. The key is to only embed text colors or alignments sparingly, only when necessary for a specific unique purpose. If you find yourself regularly changing the text color or alignments of entire paragraphs, you’re probably doing it wrong and it would be better to contact me to change your default text styling for your website instead.

It is best practice to keep your text as clean and free of embedded formatting as possible. Overuse of embedded text styling or formatting inevitably leads to inconsistent looking pages, which in turn looks unprofessional. Also, when you have an overabundance of embedded text styling/formatting it makes it very difficult to modify later on, for example if you want to update your website design or fonts in the future. Because instead of just updating the default site-wide CSS text styling in one swoop, you then have to go in and change or remove all the individual bits of embedded styling throughout your data, which is a huge pain.

Remember, if you keep your text data as clean and raw as possible, your website will look more consistent and it will be much easier to update in the future.

Continue reading

Responsive Images!

I am happy to offer a new feature for WideRange Galleries clients with responsive-designed websites: Responsive Images!

Summary

• Responsive images allow you to upload larger images.
• The larger image files will be served to large or high resolution screens. Images will look sharper on retina screens.
• Smaller image file versions will be served to mobile devices with small screens, saving bandwidth and loading times.
• Recommended sizes for new responsive image uploads would be between 1200-1600px on the long side.
• Existing website photos will stay how they are; new larger images will be responsive.
• Instructions for uploading and updating images files are listed below.

What are responsive images?

Traditionally when an image is embedded in a page, there’s just one image file and the browser loads it. With responsive images, for each photo several different image sizes are provided, and the browser will automatically choose the best one to load based on a variety of factors including browser size, screen resolution, and internet connection speed.

Why responsive images?

The responsive images feature has two major benefits: it provides higher resolution image files for large monitors and retina screens, and conversely it supplies lower resolution image files for small devices that don’t need to load a big image file.

The first issue mainly involves retina screens. Retina screens are the newer high resolution screens like you’ll find on iPhones, iPads, and the newest iMacs and MacBooks, for example. Before retina screens came along, all websites displayed at 72ppi resolution, and images looked just fine at these fairly low resolutions. But because retina screens have over twice the resolution of normal monitors, webpages and images viewed on retina devices are automatically upsized by 2x in order to maintain the same relative visual size. This means that web images that look fine on a normal monitor will look soft and blurry on a retina screen.

Responsive images solve this blurry retina problem by providing an image that’s twice the resolution, which will look much sharper on retina devices. Similarly, people using large desktop monitors with big browsers will also get to see larger versions of your photos.

On the other end of the spectrum are small mobile devices, which often use slower wireless internet connections. Since more and more people are accessing the internet with these small devices using slower internet speed, it’s important to also provide smaller image files that will load quicker. There’s no need to load a huge 1600px image on a screen that’s only 320px wide! Responsive images solve this problem because the browser will be able to load a small version of the image file rather than the big version, thus saving valuable bandwidth and loading time.

In short, responsive images allow your website to cater simultaneously to both large and small screens, rather than needing to compromise on either.

Demonstration

To see responsive images in action, I’ve provided an example below along with a normal image to compare. To fully appreciate the responsive image, you really should view those photos on a larger retina screen such as an iPad or retina iMac or MacBook. On a normal monitor you won’t see any difference, while on a retina screen you can really see the difference in sharpness.

900px non-responsive image
A normal 900px non-responsive image. This will look fine on a normal screen, but a bit blurry on a retina screen.
Responsive Image example
A responsive image. On a normal screen this will load the same 900px image as above. But on a retina screen it will load a 1800px image which will look much sharper. Also, try resizing your browser smaller and see how it loads a smaller image file instead. (You might need to refresh the page to see the effects).

What’s happening in this case with the responsive image is that there’s actually four different sized jpg files at 600, 900, 1200, and 1800 pixel widths. In the code we’re telling the browser that there’s these four images available and what sizes they are, and the browser is automatically choosing the best one based on the screen resolution and browser size. It only chooses the one that’s as big as it needs, thus saving bandwidth for smaller devices resulting in faster loading times. For high res retina screens the browser knows it needs to load one of the larger images to display sharper.

How to start using responsive images

The responsive images feature is built-in with all Version 5 WideRange Galleries websites (basically any WideRange Galleries website built or updated after 2014). All you have to do is upload your web images at the desired size (see below) and the admin will automatically create all the various smaller thumbnail sizes.

Note that if your website is an older non-responsive website (meaning the content doesn’t scale to fit smaller screens/browsers) we will need to upgrade your site to the responsive Version 5 in order to utilize the responsive images feature. I highly recommend this, since more and more people are using the internet on phones and other mobile devices, so it’s becoming more important to have a responsive, mobile-friendly website.

Read more below about recommended photo upload sizes and how to replace any existing smaller pre-responsive images with larger versions. Continue reading

What to Know about SEO

google-result

Search Engine Optimization (SEO) is a very broad term that covers basically everything involved with the process of getting website pages to rank well in search engines’ organic (natural, non-paid) search results. SEO involves the technical aspect of building the website code properly (my job), the publishing aspect of entering good content and keywords (your job), and the salesman aspect of actively promoting your website (also your job). In this post I will talk about all three aspects of SEO in a practical sense and will answer some common questions about it.

How do Search Engines Work Exactly?

Search engines use special algorithms to crawl your website, analyze the content, and rank your pages relative to every other website on the web. These algorithms are secret, and therefore SEO in general is somewhat of a voodoo science. There are some things we do know though: Continue reading