2016-08-31 How to Take Your Life Back From Social Media Featured Image

How to Take Your Life Back from Social Media

/in /by

Everything wants your attention and almost nothing deserves it. There are moments when the noise generated by the Internet seems to drown out the things that matter.

Count how many notifications your phone generates in an hour. How many of those distractions really deserved your attention? On my average day, I’d say somewhere close to zero.

Our modern mobile obsession didn’t bother me until recently. I figured it’s a social change and that we’ll adapt to it in time. But as I struggled to meet a deadline I realized the speed of Darwinian evolution wasn’t going to fly for me.  Five different social networks screamed for attention as dozens of blogs were actively nagging me with Push Notifications to read new posts.

Each time something tugs at our attention, it takes time to get it back. Some studies show it can take over 20 minutes.  Reading a new comment on Facebook only takes a minute, but getting your brain back into the task you just abandoned could take longer.

Whether you’re self-employed like me or you work for somebody else, your time is money to somebody. And more importantly, your time is your time. Take control of it.

I don’t suggest you stop using smart phones or social media.  I love this stuff. I’m suggesting you use technology intelligently to make it your bitch and not the other way around.

Disable Unnecessary Phone Notifications

I’ll cut to the chase: here are instructions on how to disable notifications on the two major types of smart phones, iPhone and Android:

If you have a smart phone turn off notifications from apps that aren’t that important. For me this included Facebook, Instagram, Twitter, LinkedIn, shopping apps, news apps, and others. If anyone expects you to be instantly available through any of these apps (looking at you, mom!) realign their expectations and suggest contacting you a different way if they really need your attention.

You won’t lose notifications: most apps just present them the next time you open the app.  Disabling app notifications ensures that you see them on your schedule and not when the app wants your attention.

Social networks and app developers know that once they have your attention, you’ll likely waste a few minutes scrolling through your feed, reading junk, and generating ad revenue. Your wasted time equals their money. Don’t play their game.

This simple step has simplified my life considerably. Disabling phone notifications has improved my productivity, and when I’m spending time with friends and family I feel more present.  Now I only check my phone when they start to bore me!

Disable Browser Notifications

As if mobile notifications weren’t distracting enough, now the web has push notifications too. While the technology has cool implications for web applications, it’s currently being used to nag users to revisit social media and blogs.

Embrace RSS

RSS is a web format that’s popular among geeks but never caught on among the unclean masses.  Bear in mind: I call you unclean as I sit here typing with orange Cheeto fingers.

Think of RSS as push notifications in reverse. So… pull notifications?  Kind of.

A website’s RSS feed is updated whenever the website has new content to share.  But the website doesn’t blast this information to all of your devices. Instead it quietly updates it’s RSS feed, and it’s up to the user to refresh the feed and see what’s changed.  I use a program called Feedly to view and manage my RSS subscriptions to about 30 blogs. When I open Feedly it provides me with a list of unread articles from all my favorite news sources.

I’m not sure why this model isn’t more popular.  RSS isn’t annoying. It doesn’t beg for your attention. It’s the information you want, when you want it, and not a moment before.

No Self-Control? Lock Yourself Out of Social Media

If you really want to level-up your productivity, install a browser plugin to lock yourself out of time-wasting websites and social media. I use a plugin called StayeFocused to keep me away from Facebook during my office hours.  Of course there’s always a way to circumvent the system, but it prevents turning knee-jerk moments of boredom or frustration into a spiral of pointless scrolling and clicking.

Summary

Nobody is suggesting you give up social media. The productivity suggestions above are deceptively simple, but on average I’d say they’ve saved me an hour every work day. That’s an additional hour of billable time. Or an extra hour to spend with my family, or on hobbies and projects I’d rather be working on. Try it out. If after a week you don’t feel better about life, you can always go back to donating a portion of your day to Mark Zuckerberg.

How to Add Social Media Icons to your WordPress Site Featured Image

How to Add Social Icons to Your WordPress Site

/in , /by

One of easiest and most effective ways to integrate your WordPress website into the world of social media is to add links to your social media profiles.  These links help your visitors find and follow your social profiles, and just about every website has them. There are a variety of ways to integrate social links or social icons into your WordPress website, and I’ll demonstate three methods in this article.

1. Choose a Theme That Supports Social Icons

If you’re in the early stages of developing your website, the simplest way to add icons for your social profiles to WordPress is to choose a theme that provides social links as a feature. Lots of themes have built in support for social media icons. All of my favorite premium themes support them including the theme I’m currently using on this site (Enfold). Lots of free themes in the WordPress Theme Directory support social icon, and even WordPress’ current default theme Twenty Sixteen has a social icon menu built in.

There are few things to keep in mind:

  • There are better reasons to choose a WordPress theme, and there are other ways to add social media icons. So if you’ve chosen a theme but it doesn’t support social media icons, you don’t necessarily need to discard it for that reason.
  • Make sure the theme supports all of your social media profiles, or provides a way to add new ones. I recently built a website for a well-known romance author and she needed an icon for Goodreads, a niche social network for authors and their fans. My theme didn’t support it directly but made it easy to add a new social network and icon.
Highlighted in this image is the social icon area built into Enfold, one of my favorite premium themes.

Highlighted in this image is the social icon area built into Enfold, one of my favorite premium themes.

2. Use a Plugin to Add Social Icon Support

You can use a plugin to add social icons to your website. Some plugins, like Social Icons, work by letting you manage a list of your social media profiles and then  the plugin displays the icons as a widget in one of your WordPress widget areas. Some like cbnet Social Menu use WordPress’ menu tool to manage your social icons. Choose a plugin wisely: make sure it has a high rating and good reputation, and that it’s author updates it regularly.

In this screenshot I've highlight the social icons that have been inserted with a plugin.

In this screenshot I’ve highlight the social icons that have been inserted with a plugin.

3. Manually Add Social Icon Support

If you’re not afraid of writing some code, adding your social icons to your WordPress theme is easy. You need to choose where in your theme you want to add the icons, insert some HTML code, and then add some styling to your theme’s style.css.  Here’s some sample code. Obviously your code will differ base on your theme and how you want to style your icons.

HTML Code

Add the following HTML to your theme to render a list of social icons. You could place this anywhere, but you’ll usually want your icons to appear in your header (header.php) or footer (footer.php):

<ul class="social-icons"> <li><a href="https://www.facebook.com/user"><em class="fa fa-facebook-square"></em></a></li> <li><a href="https://www.twitter.com/user"><em class="fa fa-twitter-square"></em></a></li> </ul>

CSS Code

Add the following CSS code to your theme’s style.css to style the list as a horizontal list of icons. You’ll need to modify the code to integrate the look and feel of the icons into your own theme.

/** * Load FontAwesome if your theme isn't already doing it. */ @import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css); /** * Style and position the list. */ .social-icons { top: 0; right: 0; margin: 0; padding: 0; list-style: none; text-align: right; margin: 10px auto; max-width: 1174px; } /** * Style the list items. */ .social-icons li { padding: 0; display: inline-block; font-size: 30px; } /** * Override the colors of the FontAwesome icons to be appropriate for the * social network. */ .social-icons li .fa-facebook-square { color: #3e5b98; } .social-icons li .fa-twitter-square { color: #4da7de; }
In this image I've highlighted the social icons that I manually added to my theme code.

In this image I’ve highlighted the social icons that I manually added to my theme code.

Summary

There are a number of ways to easily add social media links and icons to your WordPress website using themes, plugins, and custom code.  But adding links to your social media profiles are just one way to integrate your website with social media! Stay tuned for more tutorials on integrating your WordPress website with social media.

Help Web Design Clients Take Great Web Photography - Facebook

Help Web Design Clients Take Great Web Photography

/in /by

I love when a web design client can provide great web photography. I’m not a photographer, and hiring one can eat up a small business’ online marketing budget fast.

Fortunately today’s technology allows anyone to take a pretty good photo, and letting the client do it themselves is a great way for me to give their customers a media-rich, immersive web experience  without breaking their budget.

Before a web design project begins you should communicate expectations for client-provided photography up-front to avoid wasting time editing or re-shooting photos later. Taking a great photo for the web requires special consideration.

In this article we’re going to talk specifically about photo orientation, scaling, and cropping.

Photo Orientation for Web Photography

Landscape orientation  is almost always better than portrait orientation when you plan to use your photography online.

The image gallery I’ve included below shows photos I took of a Jack Daniels bottle sitting on my desk (FYI, it’s legal  and often encouraged to drink and design!) The gallery also includes some “meta-photography” showing how you hold your camera or smart phone to take photographs in portrait and landscape orientation. I’ll be referring to this gallery throughout the article.

Portrait and Landscape Orientations Explained

Portrait Orientation

Portrait orientation is when the height of a photo is greater than its width. A portrait orientation photograph is what you get when you hold your smart phone or camera vertically.

To visualize the ratio and scale of portrait orientation, think of a picture of an individual framed and hanging on your wall, or a page in a book.

Landscape Orientation

Landscape orientation is when the width of a photo is greater than the height.  A landscape orientation photograph is what you get when you hold your smart phone or camera horizontally.

To visualize the ratio and scale of landscape orientation, think of a family photo taken in a wide orientation to fit all the members in frame, a photograph of a natural landscape, or the size and scale of most computer monitors.

Why Landscape Orientation Photos are Preferred for the Web

When you’re taking photos for the web, landscape oriented photos are almost always better. This isn’t an absolute rule, but it’s a pretty good guideline. Here’s why.

Landscape Orientation Fits the Flow of Most Websites

We read most websites from left to right, and top to bottom by scrolling vertically. All of our devices build on this basic truth. If you turn your phone or tablet, the screen rotates so the pages still flow left-to-right and scroll vertically. Landscape photos fit this layout well. You can fit the full image on-screen without scrolling, and because the text is already laid out left to right in a wider orientation, your photos will flow with the text. Portrait oriented images often take up most of the screen and can leave the user wondering if there’s still content left below them.

Image Galleries

If an image will display inline with your content, landscape orientation is usually best. But if the image is part of an image gallery the rules are often more flexible. Talk to your web designer to see what works best before you start snapping photos.

Coping with Automatic Cropping

Most website building tools (like WordPress) automatically scale and crop your images to specific ratios. This means that if you don’t plan your images could get cropped in a way that leaves them ugly, confusing, or ineffective. Talk to your web designer before you begin snapping photos.

I recommend framing your photos with the subject centered and with ample space around it if cropping occurs. The goal is to keep the subject visible regardless of how the image gets cropped by your website. Take a second look at the image gallery above. The landscape oriented image of the bottle works well when cropped to a square or rectangle. The version taken in portrait orientation doesn’t work well, because it’s cropped in the middle of the bottle.

Social Media and Sharing

Every social media site has specific rules about how they scale and crop your photos.  Facebook accepts photos of any size, but they scale and crop your images based on the their purpose and context. Most of the image sizes used by Facebook, Twitter, Instagram, LinkedIn, and other popular social media services are landscape oriented or square. Once again, this means that you’ll find portrait-oriented images difficult to use for things like profile photos, header photos, cover photos, thumbnail photos, etc.

Social Media Image Resources

I’ve provided a Pinterest board that I use to collect resources related to social media image sizes.  Browse the pin board and see for yourself how your images get scaled and cropped for different purposes across all of social media.

Exceptions

Exceptions exist for every rule. Use portrait oriented photography when it’s right. It makes perfect sense to use portrait orientation on the photos of employees on a Meet the Team page.  An artist or photographer showing off their artwork in an online gallery isn’t going to want their work cropped into an aspect ratio that doesn’t fit their vision.

Video

Video should always be recorded in landscape orientation. No exceptions. Online video hosting services such as YouTube and Vimeo always display videos in landscape orientation. If you record a video in portrait orientation your designer will have to crop it to landscape orientation (resulting what’s likely an unacceptable loss of video content), or your video will display with big, ugly black margins to either side.

Communication is Key

Letting web design clients provide their own photography is a great way to offer them a beautiful website you can all be proud of, give their customers a rich and immersive experience, and give their wallets a break.  This is especially true today when most of us have a pretty good camera built right into our phones.  But communication is key. Let your client know what orientation will work best for their photography, what sizes it might be scaled and cropped to, and how they can account for it by orienting and framing their photos when they take them.

Final thoughts: I’m a freelancer. I work alone, and there’s every chance that I could be taking my own opinions a little bit too seriously. If you’ve got a different perspective on correct photo orientation for the web, framing the subject, or any other topic I’ve covered I’d love to hear it.

Yoast Basic SEO Online Course Review

/in /by

Brian Reich successfully completed the Yoast Basic SEO course!
Today I completed the Yoast Basic SEO course from Yoast Academy. Yoast is synonymous with WordPress SEO. In fact, they’ve developed the WordPress SEO plugin that’s used on every website I develop (and any WordPress site where the author cares about SEO).

Being a fan of their free and premium WordPress plugins, I was curious when they started offering training and signed up almost immediately.

The Cost

Yoast Basic SEO cost me $200.  Since my purchase they’ve run several specials, so subscribe to their mailing list and watch for discounts. Given the amount of content you get in this course I think $200 is a fair price to ask. It doesn’t contain any information you can’t find somewhere else, but the Yoast team has done a great job of covering all of the basics of search engine optimization in one simple, easy to follow package.

The Material

The Yoast Basic SEO course covers the basics of search engine optimization.

The course starts with a primer on keyword research. After all: how can you optimize your site until you know what keywords and key phrases you want to optimize for?

Next the Yoast team introduces you to technical SEO. The course discusses the basics of making sure that your website is crawlable, findable, and usable by search engines and, more importantly, the humans that use them.

Next the course covers SEO copywriting (popularly called Content SEO). This section explores how to write for the web in a way that’s visually and intellectually interesting while feeding search engines what they need to understand and rank your content. The Content SEO portion of the training relies heavily on the fact that Google’s goal is to give the best ranking to content that best answer’s a user’s query.

Finally Yoast Basic SEO covers UX and Conversion Optimization. This section helps you understand how users interact with the web and how you can use common design patterns to nudge visitors toward the actions you hope they’ll take. Conversion Optimization involves formulating hypotheses about how users will respond to changes in your content, and then testing those ideas to maximize your conversion rates.

Final Thoughts

I really enjoyed the Yoast Basic SEO course. I’d recommend it to folks who would like to know more about SEO and how to effectively handle the SEO necessities of their own blogs and websites.

Individuals that already have a strong foundation in SEO will find it lacking, and maybe even a little shallow. After all: Yoast’s SEO recommendations are often based on what Google tells us they’re doing, and not necessarily the reality of what can get a site ranked for a particular keyword. Yoast’s courses are built around the idea that Google rewards the content that answers a user’s query most effectively and accurately. But we’re all aware that there are professional SEO’s still effectively gaming that system.

Yoast Basic SEO provides exactly what it advertises: basic SEO knowledge. Yoast Basic SEO is the beginning of the journey and not the destination. If you need to quickly get from SEO novice to a working knowledge of the terms and ideas behind search engine optimization then this course will serve you well.