Pure Oxygen

Should I be using WebP images?

2020-11-24T17:14:52-05:00

You may have never encountered the .webp file extension before, but you probably have encountered a website that took too long to load, or loaded in the text first, and the images after a few seconds. This is due to images being one of the 'largest' parts of a website, in terms of file-size, and taking longer to download to your computer for viewing. A few years ago, Google purchased a company who's technology allowed them to develop a more compact file type that supports both lossless (like PNG) and lossy (like JPEG) compression: .wepb

WebP images are smaller than both PNG and JPEG files, while offering no visual quality difference.

One of these images is an optimized .jpg, and one is a .webp. Can you tell which is which?

In the above example, the .jpg file, which was optimized with Adobe Photoshop as a JPEG at 30% quality is 85.4 kilobytes, while the .webp file, which was optimized with Google's libwebp at a quality of 50% is 63.3 kilobytes: A savings of 36%. The WebP image is on the left in case you were still wondering (keep your mouse still over the image).

.WebP has been out for a few years now, and as of writing this is supported in all browsers, except for Internet Explorer. While it may not be supported on older versions (and you should avoid using only .webp if legacy support is your goal), it will work on all recent versions of Firefox, Chrome, Safari, Opera, Edge, and their mobile counterparts. You may have encountered .webp images in your everyday browsing and not have known it:

Facebook started using .webp in 2014 and reported a 25-35% size savings for JPEG images, and 80% for PNG
Google has been using them since inception, and has a study reporting .webp is "25-34% smaller compared to JPEG file size at equivalent SSIM index"

These size savings result in faster page loads - which - result in a better user experience. If your site contains many images, and you are looking for an easy way to reduce the size of your site's page load, exploring webp may be a good place to start. If your site only contains a few images, and your goal is a faster page load - we would recommend looking at a waterfall chart and identifying the real culprit before converting your images to .webp.

What is a SSL Certificate; Do I need one?

2018-05-01T21:06:21-04:00

If you are reading this, then you've undoubtedly seen the term 'SSL Certificate' or just 'SSL' mentioned somewhere or other in the past few months, and you might be wondering - what is an SSL Certificate, and should my website or application have one?

SSL Certificate stands for Secure Socket Layer Certificate, which is a file that allows your website or application to create encrypted and secure connections to your users. Websites using SSL can be identified by the prefix 'https' in their URL (the 's' stands for Secure); Your browser will typically display a green lock icon or turn the URL bar green when visiting these sites.

Example of Chrome's address bar with a secure (top), and insecure (bottom) URL

One of the most common ways for hackers to steal information, and marketing companies to track users, is to intercept the data sent when they are browsing the web - this is commonly called 'sniffing'. Sniffing can easily be done on a non-SSL connection with free software - so easily, that airports, coffee shops, any public wifi you use is almost definitely intercepting your traffic to some degree, if only to serve you better advertisements.

SSL negates this vulnerability by creating a secure connection to a website, such that only the website, and your computer can understand the information being sent back and forth. So - do you need a SSL certificate? If your website has any type of form, or deals with any payment transactions, you're going to want an SSL certificate. Even a simple contact form should be secured with SSL to prevent a 3rd party from intervening. If your website doesn't have any of those - there is still a valid reason to have an SSL certificate: Google is using it as a search ranking parameter. This means that sites with an SSL certificate will appear higher in results than sites without one (https://webmasters.googleblog.com/2014/08/https-as-ranking-signal.html).

Advertisements - Inspiration or Annoyance?

2017-07-03T10:31:05-04:00

The average person is exposed to 5,000 advertisements per day, 1,825,000 a year. Whether through billboards on our way to work, tv advertisements at home, or pop-ups on Facebook, you are constantly exposed to a plethora of design in everyday life as advertisers strategically attempt to grab your attention for what little time we, as consumers, give them.

At first it can seem annoying to be bombarded with advertisements every day, and at some point, we might even try to ignore or avoid these nuisances. But as a designer, taking a step back and seeing a beautiful opportunity for inspiration from these advertisements could be extremely beneficial. This daily exposure can instead be seen as design research and help you in your own techniques of communicating through design. Start paying attention to every advertisement you come across and take the chance to critique and dissect what is working and what is not. Did the ad grab your attention? Can you understand the concept? Is it well executed? Is there a clear call to action? Is the point being made clearly? All these questions are important to be able to communicate properly with your target audience. To question other ad designs and their purpose will help you execute your messages better as well. Do not allow yourself to be annoyed... be inspired!

Take this inspiration to the next level…there are many other resources that can help critical and creative thinking. Read books, go to lectures, listen to podcasts, look up TED talks, research the greatest designers past and present. Allow yourself to form an opinion of what you believe works and what does not work. With all of this, experiment and have fun with design! Learn to love to make connections with everything around you from graphic design to architectural design to psychology, the medical field, even sports. The more connections you can make and relate to design, the more opportunities you create for inspiration in your design to better relate and communicate to your audiences.

What is WordPress Multisite?

2017-05-24T19:00:27-04:00

You probably have heard of WordPress at one time or another, your company or personal site might even run on it, but you might not have heard of WordPress Multisite. Multisite is a very useful feature of WordPress that allows you to create a 'network' of sites, all running off of one WordPress install. Furthermore, it allows you to use sub-domains, sub-directories, or custom domains that point to each separate 'site'. As the network administrator, or Super Admin, you can limit the scope of individual site administrators only allowing certain plugins, themes, etc.; essentially creating your own "WordPress.com".

This can be extremely useful for companies that want to roll out individual sites for each of their locations, or parent organizations that want individual sites for their companies. The individual sites in Multisite can be as similar or as distinct as you would like; and the management/maintenance of them all is reduced to that of a single website. This can be a very effective way to reduce the overall time and budget spent managing and updating your multiple WordPress sites.

From a fiscal side - deploying sites via a WordPress Multisite installation can also be more cost effective. While traffic and space requirements are hard to gauge, the server space required to run Multsite is much smaller compared to running the same number of sites, each with their own WordPress installation. Deployment of a site is much easier: using the Domain Mapping plugin, you can set up a new domain for a site in a few minutes (with no technical knowledge), and management/updating is streamlined, as a single update effects all sites in the Multisite network.

Looking for some more resources for WordPress Multisite:

If you are interested in discussing a WordPress Multisite deployment for your organization or company, let us know via our contact page.

A story about story-telling

2016-10-17T08:47:39-04:00

Clients new and old regularly ask us how we can increase their organic exposure, and keep users engaged in their site longer. What keywords can we add, what SEO tricks do we know, how can we get them the greatest return for the time we invest?

Again and again I find myself explaining that there are no shortcuts; No keywords we can add, no 'hacks' we can do, that will get them their desired result.

I think that most are approaching the problem the wrong way; Your user's are not a robot searching for a specific input, and these days the search engine's aren't either. We believe attracting, keeping (and if needed, converting to customers), users starts with creating content they would be invested in, something they can really sink their teeth into; a narrative - with details.

Simplicity is key: While you may find everything about your product or service obvious or self-explanatory, many users do not. One of the easiest things to do to gain organic traffic is simply explain your differentiating factor in text on your website. Yes - pictures and hero text sell; but search engines can't detect that information when crawling through your site for SEO data. Put a few short paragraphs on your about page or blog explaining just how amazing your product or service is; linking to sites that verify that claim will only help your site rank better, and your users feel like you a more legitimate source.

Original content works: Most new website owners find themselves using stock photography, or rewriting their competitor's website copy in a 'new and better way', as this is both very inexpensive and easy to do. While it may fool some, or even most of your customers, if you are trying to gain new followers via search engine optimization or social interaction, these shortcuts will hurt you. Search engines can detect the similar content and reused images, and will prefer sites that are updated more often with original content, in their results list. Users also will not interact with your site's content the same - original content is shared more often than other forms of content (40x more often in fact - https://blog.bufferapp.com/infographics-visual-content-marketing )

Example of an infographic from blog.bufferapp.com

Example of Jet.com Clearly Explaining their benefits

If selling a product: Explain why they (the user) should be purchasing from you (and no - I don't mean by putting 'Free Shipping' into the header). Give some background on your company; what sets you apart from the others? Customers are not only attracted to your impeccable product, they are attracted to the idea of you as a company, what you stand for. They fall in love with your story, your brand, and share it with others.

Give people opportunities: We always recommend giving your customers a place to submit feedback (that may or may not been seen by the public) or let you know how their experience was. Furthermore, allow them to socially share your product/image/services as easily as possible. According to Pew Research, "1/3 of millennials say social media is one of their preferred channels for communicating with businesses" - which is a win-win for most online business; you can meet your customer at their preferred point-of-contact, and obtain free advertising on their friends social feeds at the same time.

All in all - we like to relate the struggle of driving traffic and keeping your site relevant to telling a good story, or writing a good book. Your customer should want to know more about you based off of your image, your cover, your brand. Once they open a few pages, they should have something good to read, that makes them want to read, or buy, more; and like every good book, if your product or service is great to the last page, your customers will tell their friends to read - or buy.

Hackers love Slackers

2016-10-02T23:10:43-04:00

One of the most commonly used security vulnerabilities on the web today is outdated software - be that the Adobe flash player you keep ignoring every time you start your browser, or the version of WordPress your personal blog is running on.

Most websites today run on some type of open-source, or openly-available platform - WordPress, Joomla, Magento, any online shopping cart, etc. And these software platforms typically have plugins or modules created by other 3rd-Party developers that you or your web developers may have used. Keeping all of these various platforms and plugins and modules up to date can be time consuming or costly, and those dedicated to breaking into others systems use this to their advantage.

Keeping any online software you use up to date should be just as important as locking your house when you leave for the weekend. If you haven't already, enable automatic updates if your platform allows it (or ask your developer), and update any plugin, modules, etc as soon as possible. We recommend hiring someone, or utilizing a paid-for service to maintain updates as well - if your developer offers this service, take them up on it - plus if anything ever does happen, they will be there to help get you back up and running as soon as possible.

If it's too late and you believe your site is compromised; feel free to reach out to us - we deal in number of content management and e-commerce platforms; and if we can't help you, we'll point you in the right direction.

In today's web-based world, it is pertinent you keep all of your software as up to date as possible. For further reading, and some info on the most-hacked plugins and platforms, we recommend reading Scuri's 2016 Q1 Report.

Abstractions Pittsburgh

2016-08-30T12:17:32-04:00

The O2DCA Development team was lucky enough to score some tickets to the first-ever Abstractions conference in downtown Pittsburgh earlier this month. It was the first event of it's kind here in Pittsburgh; bringing together designers, developers, project managers, security analysts, infrastructure specialists, and more into one 3-day event. At any one time there were 3-5 talks going on simultaneously, and our team split up to soak in as much as possible.

Rooftop Outdoor Lounge at Abstractions

A Talk at Abstractions 2016

We saw talks from Mark Sherman, Bradley Holt, Phil Dougherty, Richard Stallman, Brad Frost, and more that covered issues ranging from "Risks in the Software Supply Chain" to "Creating Conversational Interfaces" - as well getting to play with some real-life demonstrations. All-in-all it was a great three days where we were able to increase our breadth of knowledge, socialize with industry leaders, and sharpen our skills.

Another Speaker at Abstractions 2016

The mezzanine in between talks

I personally want to thank the event coordinators and Pittsburgh's Code & Supply Co for organizing such an impactful event here in our local tech community. The team and myself look forward to integrating what we've learned into upcoming projects, and creating even better, more efficient solutions.

Google Removes 'Mobile Friendly' Tag, and Introduces new Abusive Pop-Ups Detection

2016-08-24T21:20:37-04:00

Google Announced Yesterday two important changes to it's mobile ranking algorithm. The first piece being that the 'Mobile-friendly' label will be removed from search results on mobile devices. Their logic being that over 85% of sites returned in their results are now mobile-friendly, and removing this de-clutters the interface. Keep in mind, however, that this 'mobile-friendly' flag will still be used in determining your sites ranking in returned results. You can still measure your site's mobile performance in your Google Webmaster Tools.

Example of the Mobile-Friendly Label

The second announcement, and arguably the more important of the two, is that Google will begin penalizing mobile sites that use intrusive interstitials on January 10th 2017. What is an 'interstitials' you ask? According to Wikipedia, an Interstital is:

"A page displayed before or after expected content on the page"

Google expands this to include pop-advertisements, a well as a number of other intrusive 'alerts' you most likely have encountered while browsing the web from your phone. You can find examples of acceptable and unacceptable interstitials on Google's blog post if you would like to know more. If your site uses any of the techniques outlined, you have until the end of the year to correct the problem, or face being potentially ranked lower in search results returning your site or it's sub-pages.