Digital Strategy Works founder and WordPress Consultant and Trainer, Tony Zeoli, is coining the phrase, "WordPress Assembler" to describe the combined skillset of someone who builds websites with today's powerful theme frameworks and page building tools. While it's not yet a common term, it may become one as more people turn to theme frameworks to layout and style websites and blogs, while solving common design and development issues that are now baked into these powerful products.
Here are a few tips for you about using/uploading images to your WordPress site.
First, web browsers do not render 300 dpi, so for all you photo fanatics out there, stop uploading uncompressed 300 dpi images to your media library. A browser renders only 72 dpi regardless of the resolution of your images. Yep, I know it reduces image quality, but only to you! Remember, your perception is your reality. The person viewing your image online doesn’t care whether it’s 300 or 72. They just want to see the image. Sure, that doesn’t help photographers or art galleries much, so you’ll just need to go old school and FedEx your printed books instead, if you want your intended audience to see the full resolution image.
Second, reducing the dpi also reduces the file size. If you have 300 dots per in, then reducing it to 72 dpi is only going to help your website visitors download your images faster, especially over mobile phones. Remember that we all have finite mobile bandwidth, except those who pay for unlimited. That means you are burning up your website visitors mobile bandwidth allotment (if not on wifi) by not compressing your images. If I were looking at your photos, then waiting for them to download on my phone and it’s not fast, I would leave your site and go somewhere else. No one wants to wait for your huge images to download on their phone.
Third, you can certainly reduce the dpi and that will compress an image, but remember the physical landscape of the image itself should only be sized to what you need to display on the web. That’s probably around 1800 pixels. I’ve seen some clients upload photos that are over 3000 pixles wide! Resizing your images BEFORE you upload to your media library is important. Fortunately, WordPress now provides a resizing tool inside the Edit feature of your WordPress Media Library, so you can resize photos down. Note: Never resize photos up or you will literally be stretching the photo like a rubber band. That will stretch the pixels in the image and your image will look like crap. You always downsize. Never upsize!
Fourth, you can use a tool like WP Smush, which is a freemium plugin, to compress your images to the best possible size and resolution. When you install WP Smush, you can compresses up to 50 images at a time with the free version. You’ll have to keep clicking if you have more images to compress. It will also not compress images over 1MB, so to process all images and images over 1MB, you’ll have to upgrade to the paid version.
Fifth (and maybe it should have been first), under Settings > Media, you can set the sizes for Large, Small, and Thumbnail images when you upload them. WordPress will retain the original file, but also copy and store resized versions to select for posts/pages. While this does not “compress” the image, it does help with managing the sizes you want to set for your site.
Sixth, remember that PNG is for transparency. You might use PNG for a logo, a small icon, or some other small graphic that may have a special use case, like a drop shadow. Don’t use PNG for large photographic images. It adds data to the image and therefore increases the file size. If you have a photo, always used JPG. There’s no reason to use PNG for any photo.
Lastly, use a CDN (content delivery network) to speed up the delivery of images on your website. With plugins like W3 Total Cache or Super Cache, you can send your website’s image to servers around the globe for storage and retrieval at the “edge” of major cities, so that they are served quickly to your intended audience. If you’re using JetPack by Automattic, you can turn on Photon, which is powered by Automattic. Photo is the CDN employed by WordPress.com, so you can leverage Automattic resources to store your photos on servers around the world. The caveat here is that it most likely only store and serve images uploaded to your media library. If you have images in your theme’s folder, they may be ignored by whatever solution you use. You want to choose a theme that doesn’t store images in the theme folder, or they’ll just be forgotten. The’ll then show up on a Google Page Speed Insights report telling you they need to be compressed, but WP Smush only compresses images in your media library and not extraneous images in theme folders.
If you need additional custom image sizes, you can use a plugin like Simple Image Sizes to create additional settings for you to select when publishing posts/pages: https://wordpress.org/plugins/simple-image-sizes/
Here’s the link to download WP Smush:
Note: The Featured Image above is set to 624 KB and 1800 × 916. That means, it will size for most large screens and will automatically resize in mobile responsive for smaller screens. Compression will help the image load quickly on mobile devices.
For the past few weeks, I’ve been suffering from what is called “insecure” or “mixed content” issues on my WordPress multisite network, which I’m hosting over at WP Engine. The goal has been to use the new free Flexible SSL from CloudFlare on a number of sites in my multisite, but leaving three of those sites as Full a as designated in CloudFlare, because I purchased a 3-domain certificate from Commodo, through my domain name registrar, NameCheap.
While I’ve done all of this…I’m still not seeing my free, Flexible SSL locks on the site in the network that are SSL enabled at CloudFlare. I’m not sure if it’s going to take 24-hours to possibly resolve all those mixed content errors, which will finally unshackle me from a plain grey file looking icon up there in the URL bar of some sites in my network (not this one, as this one has a paid cert from Commodo).
Last night I clocked out at 1 am after working on a WordPress DNS setup for Comfort Theory, trying to figure out why my Flexible SSL locks from CloudFlare aren’t fully green on my WordPress multisite network, and figuring out how to get a custom URL for another client, Youth Mission Co here in Asheville.
Today was quite busy too. Between caring for Hudson, our 13-month old, all morning while my wife continues to work on her health, fitting in the configuration of Modern Tribes’s Event Calendar ticketing system with Woo Commerce checkout and PayPal IPN for CQResults.com, as well as having a late afternoon dinner with wife and son, the day is still not over.
I just launched a new coupon campaign for All In One SEO Pack Pro and cleared some social media posts tonight in Sprout Social and I still haven’t figured out my issue with my multisite. I have yet to run by another client’s restaurant, East Village Grille, to show him his new restaurant menu system I implemented using OpenMenu.com.
Ah ha! I just now finished the battle with YouTube on merging two channels. Learning something new everyday! Verification was a little difficult as well, but enduring leads to success! Just gotta work the issues.
I’ll probably be in bed tonight again at 1 am.
The desktop app is pretty sweet and much faster than logging into your WordPress admin. Since it’s always there are the ready and you can switch sites easily (as long as you’ve connected all your self-hosted sites using WordPress.com username and password connected through JetPack), this new app for both Mac, which is what I’m using, and PC should increase your blogging output.
It’s a New Year and with this great new tool from WordPress, I should be able to churn out my thoughts on my blog, before I publish to a Facebook feed or a Twitter status update.
I’m going to try and be more dilligent about using the new WordPress desktop app to increase my blogging output, for sure.
Wow, how time flies! It’s been well over a year since I gave this talk on WordPress & Social Media at the Brooklyn Technology Meetup. If you know me, you know I live and breathe WordPress through my digital strategy consultancy, Digital Strategy Works. While WordPress is not necessarily inherently social, there are a ton of tools for WordPress, like JetPack, which is a multi-feature plugin with a number of tools to help you site be social.
Here’s the video…
Over the past couple of days, I’d gotten a few phone calls from prospective clients who told me they were using the contact form on my Digital Strategy Works website to submit an inquiry about our services, but they hadn’t heard back from me. Huh, I wondered. Really? How could this be?
I did some preliminary investigating and there didn’t seem to be a problem with the Contact Form 7, which I use for my forms. WordPress itself and my server were running normally. After clicking around, it was time to test the form for myself.
I sent myself an email through the form and got back the following (removed the @ symbol to obfuscate address):
Hi. This is the qmail-send program at netmixsupport.co. I'm afraid I wasn't able to deliver your message to the following addresses. This is a permanent error; I've given up. Sorry it didn't work out. <az(at)tonyzeoli.com>: This address no longer accepts mail. --- Below this line is a copy of the message. Return-Path: <tonyzeoli(at)me.com> Received: (qmail 25887 invoked by uid 110); 13 Jan 2012 21:47:22 -0500 Delivered-To: 1-admin(at)netmix.co Received: (qmail 25882 invoked by uid 10001); 13 Jan 2012 21:47:22 -0500 To: admin(at)netmix.co Subject: tonyzeoli(at)me.com X-PHP-Originating-Script: 10001:class-phpmailer.php Date: Sat, 14 Jan 2012 02:47:22 +0000 From: "tonyzeoli(at)me.com" <tonyzeoli(at)me.com> Message-ID: <[email protected]> X-Priority: 3 X-Mailer: PHPMailer 5.1 (phpmailer.sourceforge.net) MIME-Version: 1.0 Content-Transfer-Encoding: 8bit Content-Type: text/plain; charset="UTF-8" From: tonyzeoli(at)me.com <tonyzeoli(at)me.com> Subject: test Message Body: test -- This mail is sent via contact form on Digital Strategy Works http://netmix.co/digitalstrategyworks
I though, that’s odd. The qmail-send program should be sending an email from the server to the email address I’d set in the admin panel of the Contact Form 7 plugin. But, I was getting a bounce back to the email address I’d tested in the form, saying that the address I was sending to was undeliverable. Why was it undeliverable, when I get email to my tonyzeoli.com address all the time?
There were a couple of reasons. First, I am using Google’s hosted mail service to handle mail for a couple of my domains: tonyzeoli.com and tonyzeoli.com. Second, when I set up my WordPress network on MediaTemple VPS, I needed to add a “domain alias” for each domain name that would be included in the network. While I added Netmix.com and DigitalStrategyWorks.com to the MediaTemple administration panel, you’re required to access the root domain of your WordPress network and add those domain aliases.
My root domain is netmix.co and my domain aliases were added to that account in my control panel. The image below is a screenshot of the control panel. Under “Websites and Domains,” click the “Show Advanced Operations” text link at the mid point of the page, which will drop down an extended set of options. Highlighted in the red square is the link to “Domain Aliases,” where you can add or manage all of the alias domains you’re going to use in your WordPress network. Remember, just because you’ve added them in your MediaTemple account center, does not mean that they will work. They must be added as a domain alias in your primary domain’s control panel or none of your domains will resolve correctly in your network.
After you have clicked on the Domain Alias link, you can add the domain aliases. In the image below, you can see a list of domain aliases that I have added so that the domain mapping plugin for WordPress can redirect to each domain alias assigned under the primary domain.
Now, here’s what I found that was causing the inadvertent mail issue. Since I’m using Gmail hosted mail services for two of my domains, tonyzeoli.com and tonyzeoli.com, I am not using the qmail feature of the server to send email directly from the server. The two domains in question, tonyzeoli.com and tonyzeoli.com inherit the local functionality of the qmail server, but we don’t want that, because my email DNS entries are listed as Google’s and not MediaTemple’s. Aha! Therein lies the problem. The domains are not accepting mail, because they are set to use the local mail server and not the 3rd party Google hosted mail server!
If you are hosting your email through a 3rd party service and not using the local mail feature, you’re going to get this issue where mail cannot be delivered to the domain, because the server is trying to use local mail and not the Gmail system. How do you fix that? Easy, just click on any one of the domains that you’re hosting mail for using Google or another service, and then turn off the local mail service. Problem solved!
On November 7, my postion as Lead Developer in the Reese Felts Digital Newsroom at UNC School of Journalism and Mass Communication ended. I really enjoyed working with so many talented students and look forward to seeing where they end up in their careers. As for me, I’m off in search of a Director of Digital Strategy position for an agency/brand, or a Product Development position in a news or media organization. It’s a tough market out there, but with a shiny new resume and this nice letter of recommendation from the J-School, I should land on my feet in no time.
In the meantime, I’ll be working on consulting projects through my Digital Strategy Works consulting company. If you stumble across this post and need help, training, or advice building websites with WordPress or iOS applications, I’d be happy to speak with you. Get in touch!
Here are a couple of presentations I’ve loaded up on slideshare.net/tonyzeoli. These slides will help you get involved in WordPress from a beginner’s level.