Business Directory Plugin for WordPress

Create any kind of directory on your site, easily

Why WordPress Microinteractions Are Important for UX

By

Many designers and developers struggle with creating a better User Experience (UX), both for their own websites and for their clients.

The trouble with UX is that there are many different elements involved – websites must be accessible, usable, valuable, and, above all, desirable.

There are thousands of ways that UX could go wrong. If the copy of the website is off, visitors won’t click. If the button they’re supposed to click doesn’t work, they can’t click. If the page the button leads to doesn’t load, that’s the end of the journey.

Every interaction on a website matters.

One of the most nuanced components of UX, however, is microinteractions – those tiny, pesky little actions that no one notices when they work correctly but that can significantly harm UX when they’re broken.

For WordPress designers, these microinteractions can cause a lot of trouble, but getting them right is essential.

Free Download: 5 Examples of Microinteractions That Need Your Attention
Click Here

What are Microinteractions?

Microinteractions are “single-case interactions that revolve around the use of a product or technology.”

One example of a familiar microinteraction is the hyperlink, or links that change when you hover over them, like the example below.

(Image Source)

Everyone who has been on the Internet has clicked on a hyperlink at some point. It’s an action so micro that you wouldn’t consider it an action at all.

But what if that link doesn’t work? What if the link doesn’t change color when you think it would or the underline doesn’t show up? You might start to wonder if the link works at all.

Some other common microinteractions you might have experienced in WordPress include menu hovers:

(Image Source)

Microinteractions also include things such as liking blog posts or posting a comment on the blog, logging in to a site, or even signing up for a newsletter.

(Image Source)

While some might consider these “conversions,” the functionality of the action – the clicked link or button, for example – is a microinteraction.

Why Microinteractions Matter for UX

So how do microinteractions impact UX?

For one, they serve as sensory cues. They tell the user where to go, why to go there, and what they will get on the other side.

If the microinteraction is unsuccessful – the linked page is a 404 page, for instance – then the visitor is more likely to click away from the site instead of retrying the microinteraction.

The less a user interacts with a site, the less likely they are to convert on a larger scale. Think of it this way: If a user can’t get to your sign up page, how will they buy from you?

They also serve as a basis for judgment about the website (or business, or brand) itself.

If you went to a site where every link was broken, would you stay there?

Click To Tweet

Would you view the owner of the site as reputable? Or would you consider them “cheap” for not maintaining their site?

Microinteractions also provide direction.

If you were to click on an embedded video, for example, but no music was playing, what would you do? Most people might look for an audio symbol that indicates that the video is muted.

What Developers and Designers Should Know About Microinteractions

So what should you do about microinteractions as a designer or developer?

For one, it’s important to be aware of all the minute aspects of a site’s UX. While it sounds like a big task, consider that most of your job already revolves around the creation of microinteractions.

When you create a link, for example, double check to make sure it works properly. Easy, right?

Most microinteractions will take care of themselves in the design process, but that doesn’t mean you can turn off your brains. There’s a reason why they’re important, so it’s equally important to pay attention.

Here are a few things you can do in WordPress to ensure your microinteractions are not negatively impacting your UX.

1. Know your end user.

Microinteractions are all about the end user – who is interacting with the site and why?

Use the WordPress guidelines to make sure you understand why someone would click on your button (or interact with your site) and what they would expect from it. If someone expects a link to change in some way on a hover over, for example, make sure it does.

(Image Source)

2. Double check for errors.

Errors are a death sentence for a microinteractions (and UX).

Do your best to ensure that that the process of a microinteraction doesn’t break the flow of an entire action. For instance, if someone clicks a button to “go to the next step” on a form, that “next step” button needs to work.

3. Avoid adding extra features or unnecessary elements.

The key to a good microinteraction is simplicity.

Elements like hover overs and scroll bars are expected to behave in a particular way, and while it might be cool or trendy to make things perform differently than expected, it can also ruin the interaction for the user. Consider getting feedback if you want to change a microinteraction to something a little different.

4. Use human-oriented language.

Along with simplicity, microinteractions and any associated text should be easily understandable to most people (particularly the end user). This means using short, clear words wherever possible and using visual cues, like arrows or symbols, to help specify an action.

6. Keep animation to a minimum.

Again, simplicity is key. Animation is great for certain microinteractions, but can be over the top for others. When it doubt, go with simplicity, and get feedback for more interactive elements. You don’t want the design to hinder the functionality of the action.

7. Prepare for microinteractions to evolve over time.

The functionality of the Internet continues to grow and change, and that won’t stop anytime soon.

Pay attention to how others are using microinteractions in creative ways, and watch how they develop over time. Update your WordPress sites to make sure they support any new features, too.

You don’t want to get stuck with a beautiful and innovative microinteraction that doesn’t work and tanks your UX.

Here are 5 WordPress microinteractions you should focus on
Click Here

Final Thoughts

Like all UX, the microinteractions on your site will be specific to your end user.

Some users might prefer a simple link (as long as it does what they expect), while others might appreciate something with a little animation.

When in doubt – or when designing for a picky client – it’s important to keep things functional. If you have to choose between innovation and functionality, choose the latter.

While the creation of most microinteractions might escape your notice (they are micro, after all), pay close attention to the ones that could affect UX the most, like links, images or visual cues.

The last thing you want is a simple link hover over to ruin the user experience.

The Best WordPress Plugins for Mobile Optimization and SEO

By

Web developers and designers are always trying to improve the quality of their sites.

One of the best ways to do that is by using plugins to expand the functionality, design, and features of a site quickly and easily.

But with thousands of plugins to choose from – both paid and free – it can be difficult to know which are worth the effort and which ones will simply add unnecessary bulk.

These plugins can also help developers and designers improve their rankings with search engines like Google.

With the changes that Google is making to their algorithms, however, it’s important to know that you’re choosing the right plugins for the right purposes.

Here are a few plugins that will help you keep up-to-date with Google’s standards.

Free download: WordPress Mobile Optimization Checklist
Click Here

Web developers and designers are always trying to improve the quality of their sites.

One of the best ways to do that is by using plugins to expand the functionality, design, and features of a site quickly and easily.

But with thousands of plugins to choose from – both paid and free – it can be difficult to know which are worth the effort and which ones will simply add unnecessary bulk.

These plugins can also help developers and designers improve their rankings with search engines like Google.

With the changes that Google is making to their algorithms, however, it’s important to know that you’re choosing the right plugins for the right purposes.

Here are a few plugins that will help you keep up-to-date with Google’s standards.

How Google Is Changing Mobile and SEO

Google works tirelessly to update their algorithms to better answer search queries.

Their latest update, dubbed by some as “Fred,” is changing how Google prioritizes the first page SERPs.

Pages hit hardest by the update are those that:

  • Are content-driven
  • Featured aggressive advertising
  • Lack mobile-optimization
  • Have poor quality backlinks

What this means for most sites is that certain SEO factors will be more important than others going forward.

Backlinks will be important, as well as minimizing the amount of display ads on your site so as not to clog up your theme.

Mobile optimization will be an absolute essential for all sites, as Google’s algorithm will favor mobile-optimization over most other factors. (You can check your mobile-friendliness using Google’s tool here).

Google’s algorithm will favor mobile-optimization over most other factors

Click To Tweet

For WordPress developers, this means choosing themes that are both mobile optimized and incorporate more robust SEO features.

But what happens if you’ve already built a site, or you simply want to boost your mobile-friendliness or SEO efforts?

Thankfully, there are several plugins that you can use to ensure that your WordPress sites measure up to Google’s algorithm.

WordPress Plugins for Mobile Optimization

Having a mobile-optimized site is about more than just having a website that shows up on a mobile browser. It needs to be totally mobile responsive.

Here are a few plugins that get the job done.

1. WPTouch

With WPTouch, you can have two distinct versions of your website to display to your visitors.

It automatically recognizes when a visitor is browsing from a mobile device and displays a mobile-optimized version to them.

You can set screen size for specific devices and change titles, zoom, and landing pages to match your mobile audience.

Cost: You can download a basic version for free, but WPTouch Pro and any extended licenses will range from $69 – $349, depending on your needs.

2. WordPress Mobile Pack

If you want your mobile site to act more like a mobile web application, WordPress Mobile Pack can help.

It comes with several mobile app themes that you can purchase that are pre-optimized for Google’s algorithms. They can be purchased individually or as a bundle.

This plugin works with both Apple iOS and Android devices, and has been tested for use with Google Chrome, Safari, and most major mobile browsers.

Cost: The free version allows you to change the basics (color, text, etc.) while the Pro version starts at $99/year for freelancers and ranges up to $499 for larger companies.

3. WordApp

Like WordPress Mobile Pack, WordApp is an entirely free app that allows you to choose a template to instantly convert your site into an app.

They also offer tutorials in building mobile web apps as well as a range of resources for those who want to go the extra mile to optimize their mobile site.

Cost: Free. This plugin is completely open source. Though you can also hire them to build your app if you don’t have the time.

4. WP Smush

Large image files can quickly bog down your mobile site, which will be marked against you in Google’s new algorithm.

WP Smush is an easy plugin for compressing your images and large files quickly so your mobile speeds stay optimized.

It also deletes all unnecessary data without slowing down the site. Just install and pick which images need compressing by hitting the “smush now” button that will appear next to them.

Cost: Free, though there is also a Pro version. You can subscribe to a single WP Smush Pro plugin for $19/month, while the full Pro version will cost around $99/month. You can also get the Pro version for free if you have a WPMU DEV Membership.

5. Call Now Button

Since your visitors are already using their phones, you can add a feature that enables them to call your business with one click using the Call Now Button plugin.

This places a click-to-call button on the bottom of the screen which is only visible for your mobile visitors.

You can also integrate a click tracking method with the plugin including Google Universal Analytics and Google Classic Analytics.

The only catch is that your website needs to be mobile optimized before you use this plugin.

Cost: Free, but there is a Pro version coming soon (as of the date of this post publishing, you can sign up to be a tester).

WordPress Plugins for SEO

There are many plugins out there that can also help with your SEO endeavors. Here are a few of the top ones to consider if you’re trying to stay ahead of Google.

1. Yoast SEO

This is one of the most popular SEO plugins out there, and for good reason.

Yoast SEO (sometimes called SEO by Yoast) has a range of features that can help you add backlinks, choose keywords and optimize your content for better rankings.

You can also perform SEO page analysis from your WordPress dashboard.

Cost: They have a free version that gives you some basic features, like keyword focus and backlinks. Their Premium version has all of their SEO features and is around $89 per site.

2. Rich Snippets WordPress Plugin

One of the things Google will also take note of for SERP rankings is rich snippets, or the use of Schema Markup on your web pages.

Using rich snippets allows your website to appear as the highlighted portion at the top of the first page of Google, even if your actual content appears lower in the rankings.

The Rich Snippets WordPress Plugin allows you to add rich snippets to your content quickly and easily without a ton of coding.

Cost: A regular license is $49 and includes 6 months of support, with 12 months of support at an additional $16.88.

3. All In One Rich Snippets

Like the plugin above, there’s a free plugin that works with GitHub called All In One Rich Snippets that also integrates Schema Markup for you.

This plugin is more developer-oriented (you can contribute to it yourself, if you want). But it’s a nice alternative if you want to work with Schema or rich snippets.

Cost: Free.

4. Get Backlinks

Backlinks and internal links will both be important to SEO rankings going forward.

Get Backlinks is a plugin that allows visitors to easily link to your website by copying an HTML code.

It’s a simple plugin, but can help if you’re trying to grow your influence around the web and build up a presence on other sites.

Cost: Free.

5. Broken Link Checker

Broken links will also count against you with Google’s algorithm update. Broken Link Checker is another useful SEO plugin that cleans up link problems on your WP website.

It allows you to monitor pages, comments, images and custom fields, and then notifies you about all changes in your dashboard or via email.

Coming with a search and filter option, this plugin allows for editing links directly from the plugin’s page. It is also available on GitHub for developers.

Cost: Free.

Make sure your site is mobile optimized with this free checklist
Click Here

Final Thoughts

While there are plenty of other plugins to choose from, make sure you look at ones that will help you keep pace with Google’s algorithm.

This includes plugins with a focus on mobile optimization and responsiveness, as well as links, backlinks, and Schema (in addition to keywords, of course).

It’s not clear whether or not continued changes to Google’s future algorithms will impact any of these factors. But, for the foreseeable future at least, these plugins should help you with your Google rankings.

Do You Actually Need WordPress Multisite If You Manage Multiple Sites?

By

Managing multiple websites, whether as a freelancer or as part of an agency, comes with its own challenges. Back in 2010, WordPress introduced their multisite feature, giving developers and designers the ability to create networks of sites on a single WordPress installation.

We have written before about using multisite as a part of a management strategy for those that have a plethora of clients utilizing WordPress. In general, multisite is a great tool for developers and designers.

But is it an absolute must-have if you run or manage more than one site for your clients? Not necessarily.

There are many pros to using WP Multisite, but there are certain situations where other multisite tools may be more beneficial, or other management approaches more efficient. Here are a few things to know if you’re considering using it.

Free download: 5 Tips for Managing Multiple WP and Non-WP Sites
Click Here

 

WordPress Multisite Pros and Cons

The benefits of using WP Multisite are fairly straightforward. You get:

  • Multiple site management from a single dashboard (for WP sites)
  • Quick updates and plugin installation across multiple sites
  • Shared users and login access across multiple sites
  • User-created multisite networks

In general, it’s a great choice if you build WP sites for multiple clients and you want to update and manage them with less effort. When doesn’t it work out so well? Some cons include:

  • Shared resources across sites (if one goes down, they all go down)
  • Less security across multiple sites (if one gets hacked, they all get hacked)
  • Some plugins may not work well across multiple sites
  • Creating sub-sites with different domains can be a challenge
  • Finding servers that can handle multisite installation can be difficult (and expensive)
  • HTTPS sites do not always work well on multisite (HTTPS is also an SEO ranking factor)

While Multisite is a good tool, there are some downsides that may affect your choice to use it to manage your WP accounts.

When to Use Multisite and When to Skip It

As a rule of thumb, WP Multisite can work if you find yourself in any of the following situations:

  • You need to run sites in multiple languages (WP Multisite lets you easily create different sites for each language)
  • You need multiple sites for the same client with different product or service offerings
  • You have sites that need to be managed by different teams (as part of an agency, for example)
  • You have other designers that need to create different sites on your behalf
  • You have all WP sites that are fairly simple, using the same or similar plugins, layouts and themes

WP multisite doesn’t make sense for every kind of site. If you’re managing multiple websites that have completely different designs, goals, and purposes, for example, then you may just want to manage these separately.

You also may want to think twice about using Multisite if you find yourself in these scenarios:

  • You need separate user profiles for all your sites
  • You want users to have access to install themes and plugins
  • You need to restrict plugin usage to certain sites
  • You are having trouble with widgets and plugin installation across sites
  • You need to extract sites from the network (this can be difficult once connected)
  • You have other, non-WP sites that you want to manage

If you decide that you don’t want to use WP Multisite, there are other options, of course. Services like ManageWP allow you to manage multiple (single) sites from one location, similar to what WP Multisite does.

What If You Have Non-WordPress Sites?

But what if you have non-WP sites that you want to include into your multisite management? You do have multisite alternatives that may serve your purpose better.

You do have multisite alternatives that may serve your purpose better.

Click To Tweet

You can always create a headless or decoupled CMS. This option is good for multisite installations because you can easily manage multiple domains from a single one, and you can manage sites from different platforms at the same time. The only issues are that the choices in terms of CMSs are limited and they do require more developer knowledge.

Another option is to use a service like ServerPilot, which is a server management platform that hosts PHP apps like WordPress on the cloud. You can add and manage sites from WP, Magento, Laravel, Drupal and more from a single cloud provider.

Source: ServerPilot

If you want to manage sites separately but still have some shared hosting power, you can also move your sites to a single VPS (Virtual Private Server). Many developers use a VPS in place of shared hosting, since you can typically find a VPS for the same price as a WordPress site.

The main difference between shared hosting and VPS (and the main benefit) is that a VPS gives you a certain amount of CPU and RAM to run your sites, whereas a shared hosting plan will give you a limited amount (since you’re sharing with others on the server).

Sharing a hosting platform can bring continuity to multiple sites, even if it doesn’t give you access to design or install plugins (etc.) to those accounts from a single dashboard. At least you have the ability to upload and change files from a single hosting account.

Keep in mind that you can always combine all of your WP sites into Multisite, and then manage other, smaller accounts separately, or use another service like ServerPilot to handle non-WP sites or more complicated ones.

Here are 5 more tips for managing multiple non-WP sites
Click Here

Final Thoughts

So do you actually need WP Multisite? Maybe. If you have several single WP sites that run with similar plugins, themes and designs, then yes. WP Multisite (or even ManageWP) is a great tool for combining resources and saving you time.

If you find yourself in a more complex situation, where you need multiple accounts, access, and so on, and you’re worried about security and logins, then you may want to keep and manage sites separately.

Even if you have separate sites, you can always use Multisite in a smaller capacity, or simply use a VPS to connect sites together so at least part of your job is easier. But ultimately it will depend on what your sites need and how complex your role will be.

What to Know About Client-Proofing Your WordPress Admin Access

By

Whether you’re a freelance developer or you work as part of a larger agency, at some point you will have to deal with the boundaries of your client relationships.

That can include things like communicating with clients about expectations or negotiating fees, salaries and work scope, but it also includes technical aspects of that relationship, like how much control over their WordPress site they should have.

If you’re building a site for them from scratch, should you give them admin access? If you’re building and managing a site, do they need to use the dashboard at all? How about if you’re building it but not managing or making updates? Should they be given access before you hand over the wheel or only after everything’s completed?

Some clients may come to you with a site already setup, in which case you may be the one needing admin access. How do you ensure a client doesn’t accidentally undo all your hard work?

Even if it’s not your fault, broken sites almost always make the developer look bad. You need a way to client-proof your WordPress site to some degree, even if it means un-client-proofing it down the road.

Download our free WordPress Client-Proofing Checklist:
Click Here

When Clients Should/Shouldn’t Have Access

In order to answer the question, “Should my client have access to the WordPress admin dashboard?” you need to have a clear understanding of exactly what type of working relationship you plan to have with the client now and in the future.

Generally speaking, there are two different types of clients: those that want you to build a site and maintain it over time, and those that want you to build a site and hand it over later.

A client that wants you to build and maintain a site (or just fix/rebuild/maintain a site that already exists) may do so for a number of reasons. They may know enough about coding to do it themselves, but they simply don’t have the time to develop a site properly and want to focus on other aspects of their business.

Alternatively, they may not know anything about coding and rely on you to direct their every whim.

You’re looking for knowledge: How much code does the client know? How likely will they be to screw something up?

You’re looking for knowledge: How much code does the client know?

Click To Tweet

WordPress developer Jayson Cote said in response to a Quora thread on the topic that it’s about the client’s comfort level:

“For us, it depends on the client and their comfort level for maintaining their website. Some of our clients do not want admin access because they rely on us for running updates and installing new plugins for functional features.”

Of course, there are still good reasons to give them admin access, even if they’re not exactly WordPress-savvy. In the same thread, Morten Rand-Hendriksen, staff author at lynda.com, adds that it “comes down to the ownership of the site”

“In the end it boils down to who owns the site. We are strong proponents of the idea that a client is the de-facto owner of her own site once we are done. That means their name is on the domain, the hosting solution, and the site itself. That also means they have access to admin and the means to update the site and move to a different host or developer if they so choose.”

But even if you decide to give a client some (or full) access to the WordPress backend, there may be times when you’re making updates, performing maintenance, or otherwise changing the site and don’t want something to break as the result of a client messing around.

In this case, you want to client-proof certain aspects of the site, whether permanently or temporarily, to ensure that nothing gets changed without your knowledge.

Client-Proofing Your WordPress Backend

Here are a few things to do if you want to client-proof your backend. Some will require code that may be harder to change down the line, so consider whether or not you want to keep them in place for the long haul before you implement them.

Set Up User Roles

The first thing should be to set up temporary (or permanent, as the case may be) user roles in WordPress. If possible, there should only really be one administrator role, but depending on the situation you may need more than one – especially if you plan to turn over the site to the client later on.

Users can include:

  • SuperAdmin (available on multisite installations only) – who has full access to the site network.
  • Administrator – who has access to all features within a single site
  • Editor – who can take control over the publishing and management of all posts and pages on a website, and additionally perform comments moderation without limitation
  • Author – who can manage, publish and edit his own posts.
  • Contributor – who can manage his own posts, but cannot publish them
  • A Subscriber – who only has read privileges, and cannot make any changes to the website

Set roles appropriately based on who you want to have access to which parts of the site. Remember to delete any old or inactive accounts and keep in mind that you can block the user without deleting their account if needed.

Take Proper Security Measures

You also want to make sure that if clients are setting their own login and passwords, that they don’t use “admin” as a login, but create a unique username and use a complex password. The fewer people that have access to a site’s admin panel, the less risk there is of being hacked or otherwise compromised.

Simplify the Dashboard

Even if you give a client access, they may not know enough about WordPress to justify them seeing every option available (or they may prefer to only see what they need so as not to be confused). Simplifying the dashboard, therefore, allows you to de-clutter unnecessary areas while protecting the core parts of the site you’re working on.

The easiest way to do this is by using a plugin. WP Admin UI Customize, for example, allows you to adjust the way a given user sees the wp-admin dashboard from a single visual interface. No coding, no mess.

Developer Jeff Brock prefers to use the Admin Menu Editor plugin, which lets you rename, reorder, and hide items in the left navigation menu, and (in the pro version) allows you to hide items by individual user.

You want to hide anything that is completely unnecessary for a client or may confuse them, like the WordPress news or Quick Draft features, or navigation items that they shouldn’t need to access.

Login and Double Check

After you’ve finished simplifying the site, you want to login as a potential user to see if there’s anything still showing that you may not want them to see, or areas that they can access where you might not want them to go.

You should also create instructions for users who may not know what to do with the areas they can access. If you’re handing over access to users later on, make sure that you go back and re-add features that they may want access to later on

Find more tips on client-proofing your sites with our free checklist here:
Click Here

Final Thoughts

Ultimately, whether or not you decide to give access to your clients is a case-by-case decision. There are some clients that may not want access to the site at all, and will rely on you for everything, while other clients may demand full administrative roles from the get-go.

If you’re concerned about the level of WordPress expertise of your clients (who have access), consider addressing the issues directly with them and let them know that you can create a user role for them that will help them manage their account with minimal interference.

You may find that less code-savvy clients still want to see what you’re doing, but don’t actually want to mess around with your system too much.

What Type of Navigation Design is Best for My Site?

By

How easy is it for users to find their way around your site?

If you’ve ever been frustrated trying to find something on a website, you understand just how important navigation can be. There are many different ways sites can organize their navigation menus, and some are more effective than others.

While there’s not necessarily a “best” solution, some options can be better in certain circumstances. If you’re not sure if your navigation design is effective, here are a few things to consider.

Check out these 9 websites with unique and effective navigation:
Click Here

Horizontal vs. Vertical

When it comes to placement of a navigation menu, there are essentially two options: horizontal or vertical.

Horizontal navigation, also known as top navigation, is the most common, though some designers will argue that it’s not necessarily the most effective. Horizontal/top navigation does have a few benefits compared to other types.

For one, it’s one of the first things visitors will see when they land on your site, so it’s easy to find. It helps users answer the question “where do I need to go to find what I’m looking for?” – the answers are all at the top of the page.

But there are also some limitations. For instance, you can only fit so much text into the top navigation bar. If you have multiple pages on your site you want featured in your navigation, you may have to use dropdown menus or a combination of top and side navigation.

Just using vertical navigation can have its benefits as well. Side navigation allows you to stack relevant content and give a hierarchy to the order of your menu items in a way that a standard horizontal alignment won’t.

You can also place your menu on either side of the page, which frees up room for other creative focuses (though there is some debate about which side works better). This can be handy if you don’t necessarily want your navigation to be the first thing someone sees when landing on your page and you want them to look at an image or some other element of your site instead.

On the other hand, side navigation can be cluttered if too much content is featured. It’s difficult to do a dropdown menu as side navigation, so if you have a lot of content to feature, it’s not necessarily your best option.

So which is preferable? It depends. For content heavy navigation and usability, a horizontal menu is probably best, and for those who want to free up space or stack content, side navigation works well.

In some instances using both options – essentially having navigation in an F-shaped pattern – may actually help improve conversions, as in the case of a directory or e-commerce site.

Dropdown vs. Scrolling

Dropdown menus are one of the most popular options for site navigation with a lot of content. Dropdowns are almost always used with horizontal navigation and are typically used for sites with more than a few pages of content.

However, the use of traditional dropdown menus has been on the way out in the last few years with the addition of static scrolling and parallax scrolling menus. There are several reasons why many designers are switching from traditional dropdown menus to scrolling menus.

For one, usability studies show that many people find excessive dropdown menus annoying. Dropdowns can also be difficult for search engines to index, which can harm SEO.

Scrolling menus can be more effective than dropdown on mobile devices, especially in terms of usability. Many site designers are now creating desktop sites that mimic mobile sites to create cohesiveness and improve functionality.

Scrolling menus can be more effective than dropdown on mobile devices.

Click To Tweet

Scrolling menus also give users access to more content right away. Instead of looking at a few navigation items and trying to guess where they go, they can be given more context in a scrolling menu.

But that doesn’t mean scrolling is necessarily more effective than dropdown for your site. If a user knows where they want to go – they want to learn about your company, for example – but don’t have a quick way to get there on a scrolling menu, they may become frustrated having to sort through too much information to find what they want.

Ideally, users should be able to find what they’re looking for quickly, so the best choice of navigation between dropdown and scrolling is the one that gets them where they need to go the fastest.

If you have a lot of content, dropdown menus (as long as they’re well organized) can help minimize space and create context for the user to weed through your site. On the other hand, if you have a few menu items and you want to present more information for your users, scrolling or parallax scrolling menus may be better.

Visible vs. Hidden

Another menu variation that can be combined with any of the options above is hiding your navigation under what’s known as a “hamburger” menu. The “hamburger” is an alternative type of dropdown menu that replaces a standard navigation with an icon:

Once clicked, the icon reveals the full navigation list. You can also use the word “Menu” in place of the icon. It can be used with side or top navigation and can even be combined with scrolling navigation for maximum effectiveness.

This design has been growing in popularity over the last few years, though there’s some debate about whether or not the “hidden” menu is actually effective, particularly for desktop sites. On one hand, it allows sites to free up space and encourages users to find missing content. But this only works if you have content that’s also worth spending time navigating.

Other designers argue that hidden menus harm the user experience, as it’s difficult for people to find what they’re looking for. If someone is not familiar with a hamburger menu on a desktop site, for instance, they may not know where to click to find the menu at all.

Some designers place the hamburger icon in the top corners of the desktop site so it’s automatically optimized for a mobile experience, but desktop users may find this confusing. Ideally, a hidden menu would be used for sites that have a high number of mobile users visiting their landing pages and that also want to keep their design as minimalistic as possible.

For everyone else, having a traditional, visible navigation menu at the top or side of your page is a safe bet. There are plenty of ways you can be creative with a traditional menu, so don’t feel the need to use a hidden menu just because it’s trending.

How to Choose the Right Navigation

Ultimately, the effectiveness of your menu will come down to the content of your site as well as your users (and the devices they use).

If your site is content heavy, like a news site for example, a dropdown menu might be the most efficient. You can create a hamburger menu (which is also a dropdown menu) accessible on the side of your site if it’s noticeable enough, though hamburger menus often include less content than a traditional dropdown menu.

If your users are more tech savvy and tend to access your site on mobile, a hamburger menu or scrolling menu (or both) may help you improve the user experience on both desktop and mobile.

Here are a few questions to ask when deciding which method is better:

  • How long will the menu take to navigate on average?
  • How difficult is it to find the navigation if you’re a first-time visitor?
  • How familiar with web design best practices are your users? (Do they know where to look for a hidden menu or will it confuse them?)
  • Which is more of a priority – visual elements/screen space or navigation?
  • Which navigation will showcase the core features you want users to see first?
  • Are the navigation menu items easy to understand?
  • Will a hamburger menu icon be easy to understand or should you use words instead?

Again, the best solution is whichever is most effective for your user. It’s not necessarily more effective to have a “cool” navigation menu if your users can’t understand it. Do what’s best for usability.

Don’t miss: 9 Cool Navigation Ideas You Might Want to Borrow.
Click Here

Final Thoughts

It may be important to test out your site from a user perspective before settling on a final navigation. Don’t assume that just because you can navigate the site perfectly, your audience will understand what to do. Keep in mind you can always combine navigation options and that there’s no one-size-fits all solution. Do your best to be creative, just keep functionality in mind.

How to Create Simple Images for Your Site (Instead of Using Stock Photos)

By

featured_how-to-create-simple-images-for-your-site-instead-of-using-stock-photos

Stock photography can range from totally professional to downright awful and everywhere in between.

The trouble with most good stock photography, however, is that it’s expensive. The average cost per photo is around $9, which can cost hundreds of dollars per month depending on how many you use.

On the other side of the coin, businesses can save money by purchasing cheap or free photos. But as the old saying goes, you often get what you pay for.

So what can you do if you want top quality images for your site (and you need them in bulk), but you don’t want to shell out the money to buy new images every month? You make your own.

Here are a few great ways to create your own inspiring images for your site without spending a penny on boring stock photography.

Here are 5 image editing alternatives for design novices:
Click Here

DIY Photography

Not everyone has the budget to hire a professional photographer to take photos for their site, but the reality is you don’t always need a professional to generate images; all you need is a camera.

photography

There are a lot of reasons why DIY photography is preferable over stock photos, including:

  • Cost savings – You don’t have to pay for photos that you produce
  • Creative license – You can use the photos however you want, you own the copyright
  • Control – You can take photos of exactly what you want, how you want

Another huge benefit to using your own photos is that you never run the risk of accidentally using a photo without proper licensing or using the same image as a hundred other sites.

Using your own photos all but guarantees that you will stand out from the competition.

Click To Tweet

You can always hire a student photographer at a lower rate to take some everyday photos that you can use for your site, like snapshots of people walking, photos of local buildings or businesses, or using a product you sell in action.

You can also supplement them with higher-quality stock photos of things that aren’t as easy to photograph.

Or, if you have the interest, you can take the photos yourself. Even if you only have a modicum of photography talent, you can still create stunning images with relative ease and a little know-how. Sites like Lynda.com (and others) have tutorials for DIY photography beginners.

And who knows, if your photos are good enough, you could probably sell them to a stock photo site and make some money for yourself.

Illustrations

Illustrations are another great way to add charm to your page without sacrificing quality.

illustration

Drawings and illustrations are often underutilized because they’re often more difficult and time consuming to create than traditional photos, but they have some benefits over photography that make them worthwhile:

  • They’re customizable – You can create any image to fit any piece of content
  • They’re whimsical – They can be more fun and honest than traditional images
  • They’re engaging – Bad photos can decrease conversions but illustrations improve them
  • They’re targeted – You can add text and custom elements to target specific audiences

If you can draw, you can create your own custom illustrations using tools like YouiDraw or Vectr. Or if you’re on a budget, you can inexpensively and easily obtain original illustrations for your page on sites like Upwork and Fiverr.

You could also advertise for a digital illustration student at a local college that can undertake the work for a fraction of the cost.

Infographics

An infographic is an illustration with a very specific purpose: to visualize data. They have the power to transform boring information into a memorable (and shareable) image, which makes them a perfect alternative to traditional photography.

In fact, infographics are 30 times more likely to be read than regular text, and are “liked” and shared on social media 3 times more than other any other type of content.

Source: SEMrush
Source: SEMrush

They can be particularly helpful if you need readers to retain specific data. Studies show that people retain 65% of information presented visually compared with only 10% of information presented verbally.

So how do you know whether or not an infographic would be most useful in place of a regular image?

Infographics can be helpful if:

  • You have content or data that needs further explaining, like reports, statistics, or teachable lessons
  • You have a specific audience in mind that would use or enjoy an infographic
  • You have an end goal to improve conversions or social sharing for your content

You don’t want to replace every single image on a page with an infographic, but there are times when having information broken down into a visually palpable form will help improve your design as well as boost conversions.

You can hire infographic specialist on Upwork or Fiverr, or use tools like Infogram, Easelly, or Visually to create your own from scratch.

No Photos

Another option to using stock photos is to skip using images all together.

Flat Design, a design philosophy that embraces minimalism, is a growing trend in the world of web design. Instead of images, blocks of colors or patterns are used to segment layouts, and shadows and textures are used to create dimensionality.

Some smaller images, like icons, may be used to differentiate items on a page, but for the most part, images are reduced or eliminated to make way for content.

There are plenty of sites to find free icons, like FlatIcon or FreePik. Or you can make your own using tools like IconsFlow.

If you’re seriously over using stock photos on your site but you want to maintain a creative look, consider ditching images for icons and using color and white space to add flair to each page.

Check out these 5 Image Editing Tools That Aren’t Photoshop:
Click Here

Final Thoughts

You don’t have to be a professional designer to create images that stand out on your site, though you always have the option of hiring a professional to create images for you.

Keep in mind that each image you choose should relate to the page it’s on. As much as possible, tailor your images to the content that surrounds it for maximum impact.

And remember that you don’t have to use images if you don’t want to. While photos can certainly help improve your design and give clarity to information on each page, colors and other more minimalistic elements can work just as effectively.

Why Your WordPress Theme May Be Hurting Your Directory

By

featured_why-your-wordpress-theme-may-be-hurting-your-directory

Not every website has a directory, which makes having one an added benefit.

You can drum up more traffic, procure copious amounts of backlinks, and give your users something that will add value to their own businesses. It’s a win-win.

But whether or not you have an entire website dedicated to your directory or simply add one onto an existing site, one thing many site owners overlook is design.

A poorly designed directory can turn people away, and a large part of your site’s aesthetic comes from your theme, especially if you’re using WordPress.

While your WordPress theme may look great for the rest of your site, or work well for a generic business site, here’s why you may want to choose something a little different to keep your directory converting the way it should:

Here are 6 tips for designing a great-looking directory:
Click Here

Design Affects Usability

Most websites are built in relatively the same way: logo, header image, navigation bar, content, and footer.

There are plenty of variations of this, of course, like having a navigation bar at the side of your site, or dividing your content into sections, or having infinite scroll. Generally speaking, however, most websites look the same.

Except for directories.

Directories need to be different because they’re focused on a different task: searchability. Your directory is about getting users to see what you want them to see, go where you want them to go, and click on what you want them to click on.

Directories need to be different because they’re focused on a different task.

Click To Tweet

This requires a different set of design standards that a typical template or theme can’t provide.

Different Navigation

Making your site easy to navigate is essential to success, and even more so for directories that rely on finding specific links and not just browsing at random.

A directory’s navigation is best done in an F-shape pattern, with buttons, links, or tabs running across the top and left side of the page, and the content next to it, broken up by headers and subheaders (in this case, categories).

oct-3-img-1

Most themes will stick you with a standard T-shaped pattern, and many newer “web 2.0” themes have eliminated navigation altogether, using “sticky navigation” instead. While these techniques are helpful for normal websites, your directory needs to be far more searcher-friendly, and that means more navigation, not less.

Using Text, Not Images

Many common themes today are also highly visual, which is good for grabbing attention. But studies show that when it comes to searchability, headlines work better than images for getting your users to engage.

Text draws the eye quicker, which makes it easier for users to find the categories and subcategories they’re looking for easily. That doesn’t mean you shouldn’t use images – in fact it’s recommended to use high quality images for your categories.

This just means that you should include bold category headers that are highly readable alongside your navigation (you can also use bold text within an image, as long as the text is pronounced).

oct-3-img-2

When you do use images, it’s important to use the right ones:

  • Don’t use stock photographs that are obviously stock photographs
  • Don’t use poor quality images of any kind—better to not show anything than to show something pixelated, over-compressed, badly resized, or of low-resolution
  • Don’t use crowd shots
  • Don’t use bigger than life-size images of faces
  • Don’t use historical subjects unless you’re catering to that audience

Basically, don’t do this:

oct-3-img-3

Avoiding Clutter

Another big factor in usability is a lack of clutter – in other words, being able to find what you need without having to wade through tons of content.

Many WordPress templates and themes are focused on simplicity, which is a great thing, but they don’t always account for the amount of content that is processed through a directory.

It’s easy to have a “simple, clean” website when you only have a few pages and text, but needing to organize your site for hundreds of links and listings is another story altogether.

The most practical solution to avoiding clutter in a directory is to implement the above rules of clear navigation and using headlines to guide users. Craigslist does a great job of this, and while it’s not a “pretty” website, it’s effective at helping users find what they want without looking too messy.

oct-3-img-4

Design Affects Conversions

Design also plays a big role in credibility, something that is necessary for any directory’s success.

According to research from Stanford University, 46.1% of people say a website’s design is the top criteria for deciding if a company is credible or not.

This is about more than a professional design – though that’s also important.

Directories have to worry about one thing that traditional websites don’t necessarily have to worry about: spam.

Spam postings will instantly drive down the attractiveness and usability of your site, but they also pose a significant security risk. Spammers can easily steal email addresses and other information directly from your site, especially if you have a free posting option or allow anyone to post.

This is why you also have to factor how you display your text into your design. Website Helpers has some suggestions for listing email addresses on your site in particular.

It’s also important to use other credibility indicators on your site that most themes would ignore, including testimonials and other trustmarks, if applicable. If you can, include a design element like a button or banner that shows users that your site is spam-free.

oct-3-img-5

You want to make your site look as legitimate as possible, and a poorly-designed site – one that is cluttered, hard to navigate, or uses a lot of stock imagery – will send users running for the hills.

While most basic themes will work for businesses that don’t have to worry as much about credibility, your directory’s theme will need to go above and beyond to show that you’re legitimate.

Don’t miss 6 more tips for perfecting your design:
Click Here

Final Thoughts

Standard WordPress themes (or any other themes) are great for helping you design a beautiful, functional site, but there are other design considerations that directories need to take into account.

You need to make sure that your site has better navigation for your users, preferably in an F-shaped pattern that allows for better readability.

You should also put more focus on your text, including your headers and subheaders and category titles, and when you do use images, make sure that they look professional.

It’s also important to avoid clutter at all cost, and above all, avoid spam listings that can both clutter up your page and damage your site’s reputation. After all, if you don’t have credibility, you have nothing.

9 Best Responsive Themes (If You’re New to WordPress)

By

FEATURED_Best-Responsive-Themes-(If-You're-New-to-WordPress)

If you’re building a website in WordPress, then you probably already know that you need a responsive layout: one that responds to a user’s behavior based on screen size, platform, and orientation.

Why, exactly? Well, over the last few years your audience has shifted, and they will continue to change in the years to come. No matter what specific industry you’re in, you will eventually be faced with an influx of digital users between the ages of 18 and 34, also known as Millennials.

In fact, they account for more than 80 million Internet users in the United States alone, with around 60 million of those users accessing the web from their mobile phones.

Basically, your new audience is not only technologically savvier than their predecessors, but more demanding when it comes to online experience. They want fast loading sites accessible 24-7 on any device. And your website needs to keep pace.

Don’t Miss: 6 Easy Ways to Improve Your Responsive Theme.
Click Here

Responsive Isn’t Just About Mobile

The beauty of responsive design lies in its inherent flexibility – it’s designed on a grid system that can reshape to any screen size, making it perfect for mobile viewing. But designing a site simply to look good on mobile doesn’t mean you’re creating a “responsive” design.

Responsive design isn’t only about adjusting screen sizes.

Click To Tweet

Responsive design isn’t only about adjusting screen sizes, however. After all, there have been more than 400 different mobile devices sold since 2005, and many of them have varying screen sizes, which is why it’s less important to have a broader view of responsive design.

sizes

Source: Sender11

What you really need is to think of your site in terms of pure flexibility. A few years ago, “flexible layouts” only incorporated structural elements like columns and text. Images and other elements could easily break layouts, so mobile sites would often be pared down to the bare bones of text-only design. They would lose visual appeal in order to remain “readable.” In essence, flexible didn’t really mean flexible.

Nowadays, however, images can be automatically adjusted and grid-layouts that are considered truly flexible for mobile viewing enable users to not only switch from portrait to landscape, but resize at will for use on a computer screen, tablet, or smartphone.

So what’s the easiest way to ensure your site is truly flexible? If you’re using WordPress, you’re in luck, because they already have responsive themes.

(Truly) Responsive WordPress Themes

Keep in mind that not every WordPress theme is truly responsive, even if it claims to be. Remember that a responsive design is not one that’s simply viewable on mobile devices, but one that can really reshape to any screen size, large or small, without losing visual appeal. A truly responsive site will look just as good on a tiny iPhone screen as it does being viewed on a large HD screen.

Here are a few of the top truly responsive themes (both free and premium) that you should consider when designing your WordPress site.

SociallyViral

sociallyviral

SociallyViral is one of the fastest WordPress themes on the market, which is extremely important when it comes to targeting a younger audience. It was built with navigation in mind to help increase traffic and reduce loading times. If your site is content heavy but you don’t want to sacrifice speed or SEO ranking, then this theme will help on both accounts without losing any visual appeal.

Shapely

shapely

Shapely is a FREE theme, and it’s fairly popular for a reason. Despite being a one-page design – which makes it ideal for any professional, portfolio, or business website – it is surprisingly flexible and is compatible with most WordPress plugins, making it a great choice for a starter site.

Sparkling

sparkling

ColorLib’s Sparkling theme incorporates a modern design based on the latest Bootstrap technology. It not only looks amazing on any mobile devices due to its sharp design and fluid layout, but also comes with a variety of other premium features such as a full-screen slider to enhance photos and other graphics.

Unite

unite

Unite is an incredibly minimalistic (and incredibly free) and powerful responsive layout perfect for any industry. It makes full use of Bootstrap 3 technology and allows you to customize nearly any aspect of the design with ease, meaning greater flexibility to build the site you’ve always wanted.

SEOWP

seowp

SEOWP’s design fits any type of business, so if you need to include certain design elements outside of the norm, this is a great theme to try out. It offers a full-width animated slider, unlimited header styles, an SEO ready interface and is optimized for speed.

Enigma

enigma

Enigma is not only mobile ready but also has great flexibility when it comes to browsers, which is not true of every WordPress theme. Content and images can be viewed on high-resolution retina displays, and while the layout isn’t quite as design-friendly as other themes, it does come with widgets and footer options to help customize its look and feel.

Zerif Lite

Zeriflite

Zerif Lite is a clean and modern one-page theme that works well for web agencies, corporate sites, and sites running an e-commerce or subscription platform. It’s optimized to support many popular WordPress plugins such as WooCommerce and WPML to create a multilingual (and highly responsive) user experience. Again, it’s totally free.

Avada

avada

If you’re looking for another fast site with a large amount of creative control over appearance, Avada is the perfect multipurpose solution. It features a drag-and-drop Fusion builder, intuitive tools, shortcode generators, and, best of all, it’s fast and fully responsive.

Auberge

auberga

This (FREE) theme has a 5 out of 5 star rating and has been downloaded over 30,000 times, making it one of the more popular and high quality themes you can find on the market today. Auberge is built almost entirely with mobile in mind, ensuring that mobile users experience the same visual appeal as users on other platforms. Plus, it’s easy on new programmers and developers.

Improve your responsive WordPress themes using these 6 simple strategies.
Click Here