In this Quick Tip, Treehouse WordPress teacher Zac explains the options you have when choosing your WordPress site’s URLs. Choosing the right permalink structure can have an amazing effect on your website’s SEO value. Do you have a blog or news site where a date-based permalink structure would work best? Or do you need those all important title keywords in the URL? Find out in this helpful tutorial from Treehouse.

Connect with Treehouse!
Website: http://www.teamtreehouse.com
Twitter: http://trhou.se/treehouse-twitter
Facebook: http://trhou.se/treehouse-facebook
Google+: http://trhou.se/treehouse-google-plus

Each week, we’ll release:

- New episodes of ‘The Treehouse Show’ – up to date news and tips on web design, coding, and more.
- ‘Quick Tip’ videos – these are short how-to videos on today’s most relevant web technologies.
- and much more!

The post Customizing Permalinks in WordPress | Treehouse Quick TIp appeared first on Treehouse Blog.

A record number of shoppers are turning to their smartphones to research potential purchases. Meanwhile, the bigger question — are those same users willing to complete the purchases on their mobile device? — is quickly being answered. The US, for example, saw an 81% spike in mobile e-commerce (m-commerce) sales in 2012, comprising a $25 billion market.

And it’s not just apps. By a landslide, users prefer mobile websites to apps for shopping. For every shopping activity, including researching products and prices, reviewing products, participating in promotions, and purchasing, most respondents (61 to 81%) preferred using a browser to a native app.

In the days and months to come, it will become increasingly important for retailers to fuel this growth by creating seamless, user-friendly checkout processes that inspire trust and that make full use of all of the advantages the medium has to offer.

Let’s dive into some examples of mobile checkout processes and see what we can learn.

1. Include Only Vital Fields

We’ve all answered those dreaded questions, such as “How did you hear about us?” While they may serve the vendor, they do nothing for the buyer, who is offering up their hard-earned cash and deserves to call the shots here.

While these questions are annoying on a desktop, they can be fatal in mobile. Take these two examples:

On the left, the responsive mobile checkout process by Moby succeeds by reducing the fields to the bare essentials, condensing the entire process into one cohesive page.

On the right, Kay Jewelers shows how a simple experience can quickly become extraordinarily cumbersome. Three pages in total display unnecessary fields such as “Evening phone” and “Mobile phone,” while breaking fields apart — the “Address” field is given three imposing lines (instead of just one for a ZIP code), and the user is required to retype their email address.

2. Allow Checkout As A Guest

Providing an option to check out as a guest should be standard practice across media (although 24% of e-commerce websites don’t), and especially on mobile. A user is much less likely to complete an order if they have to go through the process of creating an account and confirming it. The statistics back this up, sometimes shockingly so. One major retailer reportedly saw a $300 million leap in sales by removing the “Register” button!

Burton starts its checkout process by hedging its bet, giving the user all three options: “Sign in,” “Create an account” or “Checkout as a guest.” Larger view.

3. Leverage Mobile UI Elements

Fandango has a fluid mobile checkout experience. One big reason why is that it leverages the advantages of the medium, often relying on touch controls, which a user is much more likely to use than typing.

Fandango’s desktop UI versus mobile UI. Larger view.

In Fandango’s desktop UI (left), a user is prompted to select quantities using a typical drop-down menu. In the mobile UI (right), they are prompted to update quantities using increment selectors (with an option to type as well), which is speedier in that medium.

4. Remove Distractions, Not Content

Once a user is in the checkout process, they have obviously expressed a willingness to buy. Put another way, the website has switched from being a salesperson to being an order fulfillment center. With that in mind, remove anything that draws their attention anywhere other than the task at hand.

Conversions can rise in enclosed checkouts, a tactic you may have noticed when purchasing from Amazon. With this technique, the vendor removes the standard header, including the menu links and search bar, which could drive the user elsewhere. A checkout page can be made especially simple on mobile.

Once a user is in Dillard’s checkout process, their only escape is to tap the logo in the top-left corner.

Social media links, like these in GNC’s shopping cart, should have no place in the process and could drive users away. Larger view.

A content-rich checkout page might seem like a good idea, but it will distract the user from their purchasing decision.

This doesn’t mean we should remove all content. Mobile engagements typically last 80% as long as desktop ones, and that number is rising. Users might still have questions about shipping guidelines, delivery, terms and conditions and more. A good experience should give them the option to find answers.

On Crate & Barrel’s mobile website, standard questions are showcased at the bottom of the shopping cart page, enabling the customer to get answers without leaving the checkout funnel.

5. Show Progress

A user wants to know where they are, where they are going and how much longer until they’re done. Progress bars alleviate anxiety here.

Recent studies show that the majority of major e-tailers show a progress bar, although many implementations leave much to be desired.

While Under Armour’s mobile website leads users through the process with a simple, sensible progress bar, it would improve by describing the steps to come.

6. Build Lightweight

Above all, time is precious. 74% of mobile visitors will leave a website if it takes longer than five seconds to load. Users have come to complete an action, and they are already convinced that it’s the right thing to do, so it’s best to get out of their way.

Adhere to the “Seven Guidelines for Designing High-Performance Mobile User Experiences.” And use a testing tool to optimize loading times; Mobitest by Akamai is my choice.

It’s not going to win any design awards, but Tom’s Shoes has a quick-loading, bare-bones checkout page that does the trick.

7. Provide Security Reassurances

One of the biggest reservations users have left about mobile e-commerce is security. To get over this hurdle, designers needn’t be subtle: provide as many reassurances as possible that the experience is secure, and drive the point home. This means using iconography, SSL certificates and dedicated callouts in copy.

1-800-Flowers.com actively reminds users of the security of their order using a variety of tactics.

8. Google Wallet, PayPal And Amazon Are Your Friends

Instead of forcing users to fumble through checkout forms and type their address, use a trusted service such as Google Wallet, PayPal and Amazon to get users two taps away from completing their payment. Their information will be automatically populated, and the process will be nearly complete.

No-frills mobile e-commerce experiences on Shopify.

Mobile e-commerce experiences on Shopify, like this one for DODOcase, aren’t visually exciting, but that’s not the point. They hush any noise, while allowing users to quickly check out using trusted third-party applications.

9. Take Advantage Of Geolocation And One-Touch Calling

The Home Depot’s mobile website lets users pick up items in store and uses GPS to find the closest location and check inventory.

Use GPS information to easily point a user to a physical location, as an alternative to a Web conversion. By using a URL string like http://maps.google.com/maps?daddr=BEST+BUY&saddr=Current+Location on mobile, Google will automatically retrieve the nearest location and provide directions. Best Buy observed that 28% of users visiting its mobile platforms were using it to make an in-store purchase, making it a successful value proposition.

Also, use one-tap calling with the tel: protocol to enable users to call for support with one tap — a much easier experience than jotting down a phone number.

10. As Always, Test Across Systems And Setups

Mobile testing with the User Agent Switcher for Chrome. Larger view.

Mobile testing can be difficult and time-intensive, but with the market split between an array of operating systems, prioritizing by market share and testing at multiple resolutions is important. Getting your hands on a phone for each OS is always best, but if that’s not possible, you can use a browser plugin named User Agent Switcher for Firefox and Chrome. It can be an invaluable time-saver for testing, allowing you to bounce between different OS experiences on your desktop.

The other factor in the OS conversation is design. Many designers of mobile Web experiences make the mistake of borrowing interface elements from their OS of choice. For instance, a designer who uses an iOS device might adopt Apple’s button styles. While this would make sense in a native app, a mobile website is a cross-browser experience, and a native aesthetic will likely turn off users of other OS’ — or, even worse, might just plain look bad.

Conclusion

At long last, the promise of m-commerce is starting to be fulfilled. Never before has the gap between a good and bad mobile checkout experience affected revenue so much.

If retailers give the user a clear, focused, streamlined and lightweight path to making their purchase — while recognizing the advantages and limitations of a mobile experience outlined above — all parties will benefit.

(al)

© Derek Nelson for Smashing Magazine, 2013.

World Leaders

UMBC is connecting students around the globe through a new online community leadership class for teenage English language learners administered by UMBC Training Centers.

The idea for the course was sparked when Joan Kang Shin �08 Ph.D., language, literacy and culture (LLC), and assistant professor of education, was contacted by the U.S. Consulate General in Brazil. Shin trains teachers for the U.S. State Department�s English Access Microscholarship Program, which provides English education to talented teens from economically disadvantaged areas, and Brazil�s English Language Officer was looking for a way to continue these students� education once they graduated.

�They go through this really great program and improve their English, and then they�re like �ok now what?�� said Shin. The English Language Officer was hoping that the answer might be a program that would prepare these students, already given an advantage through their English education, to be leaders in their communities.

Shin contacted her former LLC classmate and UMBC Colleague Joby Taylor �05 Ph.D., and director of the Shriver Peaceworker Fellows program, about developing an online course.

Taylor immediately saw the potential, and set to work adapting community engagement content from the Peaceworker program into an online course that teaches leadership while supporting students� still-developing English skills. The resulting class, the Access Alumni Community Leadership Challenge, leads students through a variety of self-reflection, community understanding and leadership exercises, culminating in a proposal for a project in students� own communities.

�We end at the proposal stage because we don�t pretend to know how to implement these, but we wanted the students to have a concrete takeaway and to put their ideas in a form that would be as easy to present or implement as possible,� Taylor said.

The class was a success in Brazil, which offered it twice, and news of it spread to other countries. This semester several Central American nations have partnered to offer the course to their Access alumni, and a class is being planned for students in Yemen.

�I wanted to build this in a way that it can go anywhere in the world with very modest adjustments,� said Taylor. A Peaceworker Fellow is currently serving as the teaching assistant for the class, and Taylor said that, with Fellows as teachers, UMBC could potentially offer classes in several countries simultaneously.

Now that the class is off the ground, Shin and Taylor are eager to find ways to enhance it. One is through a new partnership with Arundel High School�s global studies program. UMBC has partnered students at Arundel High with students enrolled in the Access class, and the pairs will complete parallel activities and hold biweekly conversations.

Taylor hopes that these conversation partners can be just the first step of a lasting partnership with Arundel. �If there�s a way for the Arundel students to be registered in the class and co-participating, we�d love it,� he said.

The class is also serving as a research opportunity for Heidi Faust �15 Ph.D., LLC, the class�s English language instructor. She realized that the pre- and post-course conversations in which she evaluates students� English proficiency were also great opportunities to gather data for her research on how educational institutions can mediate the impact of their power status and cultural background.

�We don�t want to come into the course and say we�re going to tell you how to make your communities better,� she said. �Our hope is that it�s not this top down, unidirectional flow of information. We want them to come back to us and say, �this is how we think we can change our communities.��

Finally, UMBC is bringing this online class into the offline world by inviting participants to campus. Students from Arundel High school will visit later this month, and this summer, Brazillian students will come to campus for an experience that will include activities with the American high school students, a trip to Washington D.C. and a homestay.

�We�re creating our own intercultural camp experience for them,� Taylor said.

(3/8/13)