Tag Archives: ux

Design Language: 4 Things to Consider when Choosing a WordPress Theme

Design Language tips

As of 2018, WordPress remains far and away the most popular content management system in web development, with the platform capturing a sizable market share of 31%, far eclipsing the second-placed Joomla, coming in at a measly 3.1% market share. WordPress owes its popularity mainly because of two reasons, its sheer versatility and the simple fact that at its most basic version, it is available for free. There’s just no denying free stuff.

Technically though, WordPress works under the ‘freemium’ model, in which plugins and themes, the very reasons for WordPress’ versatility, are separated into free and premium ones, just like with mobile apps and games. These themes and plugins come for the most part from third-party developers, owing to WordPress’ open-sourced nature and as such, WordPress is an embarrassment of riches when it comes to the number of options available. Some might say there are way too many options.

Finding the right WordPress theme

Choosing a theme is usually one of the first and primary decisions you’ll have to make when starting out with WordPress. Themes aren’t just about looks. Basic functionality, layout, aesthetic impressions, the overall design language of your entire website is going to be heavily informed by the theme you’re going with. Apple didn’t merely stumble into their cohesive design language, shaping every piece of product in their lineup, both software and hardware, by accident. They did it through careful research.

Now, due to its open source nature, it is actually possible for you to design and develop a customized WordPress theme of your own, either from scratch or working from what’s already available but for most small businesses, this is usually unnecessary. The decision then, boils down to a choice between the plethoras of themes available for WordPress. In one marketplace alone, Themeforest from Melbourne-based Envato, there are over 10,000 themes available, packed like sardines in a crushed tin box.

To help you navigate and differentiate between this overly crowded market; here are some factors to consider when choosing a WordPress theme:

  • Choose between simple themes or a comprehensive framework

To put another wrinkle in your decision process, WordPress framework is the current trend in web development. Remember at the beginning when I said that WordPress themes also account for functionality? WordPress framework works by pushing all of those functionalities within the framework itself while themes consist solely of stylistical options. In a WordPress framework, you basically have two themes; parent themes dictate the functionality while child themes dictate the actual aesthetics.

The benefit of going with a framework is that it makes WordPress more in line with full-on web builders like Wix or Squarespace by allowing easy, drag-and-drop codeless customization and seamless theme switching but with the caveat that you can’t perform under-the-hood modifications as freely as you’d like. Usually though, framework already has a lot of functionalities and widgets built-in that you normally won’t have to add one yourself.

  • Just the right amount of functionality

First, consider what functionalities you’d like to have with your website right now and those you’re considering in the foreseeable future. Now, choose a theme that fulfills those needs with the minimum amount of baggage. A feature-rich theme might sound attractive but if it consist of features that are irrelevant, don’t bother. Those extra functionalities are just going to slow down your website and since load speed is now a Google ranking factor, a slow website isn’t something you want to be burdened with.

Technically, you can still add functionalities with plugins but again, adding more baggage is going to slow down your website, so try to go with a theme that already has the functionalities you need built-in to the theme.

  • Responsive web design and mobile-friendliness

Mobile web browsing has overtaken the conventional desktop experience in 2016 and you need to adapt your website for optimal viewing on diminutive displays and gesture-based navigation. The one method of solving this is by using responsive web design, in which the webpage detects the medium it is being displayed and adapts itself. Choosing a non-responsive theme in 2018 is akin to connecting to the internet with a 56k dial-up connection. It’s just too anachronistic of a choice.

  • Finding the right aesthetics

Take a glance at the selection available in Themeforest. On the left-hand side, there are a lots of different tags you could use to filter out just what exactly what kind of website you’re looking for. Food & beverage? Technology? A design portfolio or a resume? There are tons of themes available for various specific needs and choosing the one that fits the aesthetic you’re looking for should not be a problem. There are various considerations to factor in before you jump the gun, however.

First is the available color palette. Assuming you’ve already settled on a logo for your business, you need to find a theme with a color palette that could complement your logo. Some themes are available with unlimited color options while some, usually the free ones don’t. The second factor is legibility. If you’re working in the creative and/or visual industry, this might not be a primary consideration but for businesses working in professional services, you should always balance style with substance. Fussy, visual heavy design tends to not work with law and accounting firms.

Additional considerations

The example marketplace I gave here, Themeforest, deals exclusively with premium themes. If you’re looking for the free ones, the directory on WordPress website is a good place to get you started. Here’s my advice though, try to avoid themes that are made by an individual. Those tend to be extracurricular excursions and since there are no professional obligations, questions of supports and updates are always going to be on your mind.

There are a lot of organizations dedicated to making WordPress themes and most usually offer free themes to go with the premium ones. The free ones are usually restricted in some ways, with less functionality and a limited color palette but if you can live with those restrictions, those free themes are a definite bargain because getting support will be much easier than from an individual designer.

Creating a More Accessible Website

In general, website accessibility is known as an attempt of removing online barriers faced by people with disabilities. The goal is to provide everyone with equal access to online information and functionality.

This website accessibility issue has been broken down by the W3C or World Wide Web Compliance organization into 12 points and the accessibility requirements will continue to evolve. But, don’t worry, as you can improve the accessibility of your website by following the best practices below for web design, development, and content management to improve the user experience on your website for all visitors. If you are a web developer, this article will suit you best, so keep on reading and learn how to create an accessible web today!

How to Design for all Users?

Below are ways that you can apply to make your user interface design and visual design more accessible. These tips can be applied both to a new website and to an existing site.

Applying the Right Color Contrast Ratio

Color contrast helps people see the text clearly as it gives sufficient contrast between the text color and background color. Therefore, it is important for you to provide a good color contrast ratio. As a best practice, your foreground text should have sufficient contrast from the background colors. A contrast ratio of 5:1 for normal text and 3:1 for large text are good standards to follow and also meet the minimum requirements for WCAG 2.0 Level AA.

Avoiding Sliders and Animations

Some studies reveal that user experiences and visitor engagement are not good for conversions and can cause low engagement. Therefore, it is better to avoid using any rotating slides and carousels on web pages because some website visitors may require more time to view and read a slide, besides, rotating and moving content will only create frustration for visitors.

Utilizing WordPress for Accessibility

Since February 2016, WordPress has released WordPress Accessibility Coding Standards which provide a compliant based on which custom themes can be built, most major themes and frameworks on WordPress, like Genesis or Avada.  Furthermore, all new or updated code released in WordPress must conform to the WCAG 2.0 guidelines.

Form Labels and Errors

Instead of using placeholder text, make sure all forms on your website have proper form labels. For example, the form pictured below has placeholder text for username and password, but once the form field is clicked, the user can no longer see what information should be entered into the field. This kind of form will create a hindrance for users that need extra time filling out a form.

Web Page Navigation

Another thing that you should bring to your attention is the accessibility in creating a website that can be navigated using a keyboard. This is because some website users with mobility impairments can’t use a mouse to navigate your website and rely on a keyword or keyboard-like device.

In fact, the better your page’s structure and semantics are, the more navigable and understandable it is for all users. Therefore, make sure that your WordPress developer is following the best practices in page structures by using proper heading hierarchies, enabling skip links, and using accurate semantic HTML.

How to Manage Content for All Users?

Don’t forget about content, because having an accessible website requires an adjustment in how you handle all website content going forward, so here are some of the ways that you can do.

Adding Alternative Text to Images

To describe the appearance of an image on a web page, alt text is used within an HTML. Visually impaired users rely on alt text to understand an image on a website. With WordPress interface, website administrators can easily update website content and add alternative text to images. In this case, alternative text is helpful for SEO, as search engines look for alternative text to identify and properly index an image.

Video & Audio Captions

Just like having captions on images, you should also put captions and transcripts on any video or audio. By giving captions, to multi-media, the visitors can easily enjoy and access the knowledge offered in the media. Furthermore, with captions, visitors can conveniently watch videos with the sound off. Today, it is easy to find numerous free tools available for adding and editing captions to your video and audio files.

So, whether you are creating a new website or upgrading it, it is important to protect all that work by ensuring the website is secure from hackers and security breaches. In fact, you may need to have a daily backup, not only for security, but also for breaking a component related to accessibility.

In summary, major online businesses are realizing on the importance of accessibility that is able to encourage closed captions on videos for users who are deaf and hard of hearing, so are you ready to start creating a more accessible website today? Remember that it is important to create a website that can be accessed by anyone, anytime, and anywhere.

How to Create a Design that Satisfies

Two-Types-of-User-Motivation--Design-to-Satisfy-ywf

Believe it or not, working as a designer or web designer will require you to know your users and motivate them. You might think that designers sound like phycology, but this is actually important for designers to acknowledge a little knowledge of phycology, especially about motivation and how to apply a good motivation in their design, since by utilizing good motivation on your design, you will provide strong reasons for users to take an action for buying your product. Take a look further on how motivation can really affect your design, such as follows.

What is Motivation?

Motivation is famously known as something that can encourage people. It gives motives, needs or wants that drive behavior and explain why people do something. In design, motivation is also needed; it could help designers see the direct way to make the product correspondent to users’ expectations and solve user’s problems. However, before your product can help users, first you have to create a product that can motivate users to try it.

There are two types of motivation that we know, extrinsic motivation and intrinsic motivation:

Extrinsic motivation

These motives come from outer sources, such as family, professional environment, competitions, contests, etc. In most cases, people who have extrinsic motivation are usually seeking of reward, such as money, prizes, diplomas, certificates, trophies, medals, praise, support, recognition, or the desire to compete with others. As a designer, we can discover users’ extrinsic motives through research for UX designers. Once we know their extrinsic motivation, we can create a design that can stimulate them.

Intrinsic motivation

Oppositely, intrinsic motivations come from inner sources, such as the need of self-improvement. This type of motivation is stronger than extrinsic motivation. If you can nail this motivation from a user, it will become a significant factor for retaining users. Therefore, it is important to get to know more about target audience at the stage of user research; in this way, designers can discover what their motives are and what kind of designs that will work for the specific users.

Knowing the types of motivation will surely help designers in creating a design that will attract and serve users best. In fact, this knowledge is necessary for UI/UX designers for several reasons, such as follows:

  • Building navigation and call-to-action elements that can truly engage to users and motivate them to take action.
  • Designing better layouts that can demonstrate key benefits or rewards.
  • Creating a process that can motivate users to try the product and test its functions.
  • Presenting aesthetic satisfaction so that users feel comfortable with your product.
  • Providing the copy that can stimulate users through describing the benefits and achievements of your product.
  • Encourage users to share their experience via various social networks; this can be a powerful extrinsic motive for other people nowadays.

Now that you know motivation is terribly important in design, by understanding users’ motivation, you can build the right design that can reach many users. So, don’t forget to analyze your users’ motivation before designing for them.