Curiosita Labs

Thoughts on programming, web development and design.

Circuit Board

Category: Web Development Page 17 of 31

How to write usable error messages

By

On March 31, 2015

In Programming, Web Development

Have you ever come across a bad error message? If you have used a computer or any piece of technology, you may have seen them. What makes an error message bad? A bad error message is an error or dialog box that only makes sense to the person who wrote it in the first place. It doesn’t tell you what the error is, what caused it or how to approach solving it.
How To Write Usable Error Messages

How do you write good or usable error messages?

A good error message has three parts: what is the error, what caused the problem and how the user can fix it.

What is the error

Be Descriptive. Your error message should answer the five w’s: Who, What, Why, When and Where. An error message like “Invalid Entry” doesn’t answer the 5 w’s. A better message is “Your email address is empty. Please enter your email address.” It tells you what the error is, where the problem is located and how to fix it.

Make sure your error message focuses on the user. It should use simple and jargon-less words to describe the problem Your error message should be short and direct. No extra words. If you think it has too many words, cut out the extra ones.

What Caused the Problem

You want to explain what caused the problem. Was it a data entry error? Did they forget to fill something out? Was it something beyond their control like a lost database connection? Let them know in simple and easy to understand terms.

How can the user can fix it

Your error message should also have a way to fix the problem. If they forgot the fill out a field, tell them which field. Make it easy to figure out the problem.

Additionally, your error message should also be visible. Your error message should be displayed prominently so the user can see it and know that an error has occurred.

Summary

Why do you want to do this? Remember, you are not writing error messages for yourself. You are writing for the person who may be annoyed, doesn’t understand the code and just wants to get a task done. That person may be you.

Need more tips on writing usable error messages? Check out these 7 tips on writing friendly error messages.

Practical UX Methods

By

On February 28, 2015

In Design, UX, Web Development

Patrick McNeil share his practical, bite-size UX Methods: First Click Tests, SUS Questionnaire, Nano-Usabality Tests and Integrated Tests.

Have you used any of these methods?

WordPress Themes, Database Cleanup and More

By

On January 28, 2015

In Web Development

WordPressWhile working on a WordPress project, you may want to consider how to enhance your WordPress them, clean up your database and review your site before launching it. I found 4 articles that can help you make your WordPress site super.

Themes

WordPress themes allow you to customize and make your WordPress site unique. When you first considering building a WordPress website, you have two choices: build your own theme or choose a pre-made one. A pre-made theme get your site up and running faster than designing your own. Since there a lot of themes, you to narrow down your choices. Think about the price of the theme, what kind of features does it offer, will the theme work for your website and easy to customize. What To Consider When Choosing a WordPress Theme has seven items to help you find the theme you are looking for.

Once you found a theme or built your own, you may want to enhance it. There are WordPress functions that you can use to make your theme even better. In 10 Ways to Change the Way Your WordPress Site Works With Functions, you can use functions to customize your footer, add Google Analytics, or automate the Copyright Date of your site.
Computer Coding

Database Cleanup

As you add plugins, experiment with widgets or even theme designs, you may notice that your WordPress acts a bit slower that it did when first installed it. You may want to cleanup your WordPress database for increased website performance. Running a cleanup can help get rid of extra items that are no longer necessary and cause performance issues.

Launching a WordPress Website

When you launch your WordPress website, you may forget to do some things. You may forget to fill out the Site Title and Tagline or set the correct timezone. Check out
5 Things You May Forget When Launching a WordPress Website to see if you may have forgotten anything.

Summary

Whether you decided to use a pre-made theme or build your own, you’ll still need to customize it. Customizing a theme can mean making simple changes, adding plugins and functions. Whatever you decide to do to make your WordPress site unique, you need to know how to choose a theme, add functions to customize it, cleanup the database occasionally and make sure you double check your site before launching.

What tips do you have for WordPress developers and owners?

What is smart design?

By

On November 28, 2014

In Design, Programming, Web Development

Computer CodingAs we use mobile devices, they change how we interact with our devices and content. Developers and designers need to consider many things when developing a website. You have to think about responsive design, speed, UI/UX, patterns, touches and gestures. Sara Cannon explains how mobile design trends affect how we design.

Smart design is

  • Content-focused
  • Fast
  • Informed
  • Refined

How to you create a smart design?

Be content-focused

Your design should be Mobile First, Readable, Designed for Content and uses digital storytelling. It just works. A visitor can read your site on their computer, laptop, tablet or phone. They can read your website using what ever device they choose. Make the content the most important part of the design. Use web design techniques, like photos, videos, fonts and more to help tell a story.

Be Fast

Your design should be fast. People have a limited attention span when it comes to slow loading websites. Make sure your site loads quickly. Sara talked about balancing speed vs awesome. Some photos may make a design look awesome, but they take time to load. You need to decide if that photo is really necessary. If it is, you can optimize the photo for the web. A tool that smushit optimizes photos for the web. You can speed up how your site loads by using tools like Icon Fonts and SVGs (Scalable Vector Graphics). You can get Icon Fonts from Font Awesome, Fontello or IcoMoon. Nounproject is one place to get svgs. By replacing icons with fonts, you can increase the speed of your site.

Be Informed

Every website performs differently. You have well and bad performing pages. By using Google Analytics or another web analytic tool, you can learn more about how your site is performing and find out what works. Not enough people do user testing. User testing of your website can tell you a lot about what works and what doesn’t. You can also learn why someone uses your site in unexpected ways. Use usertesting.com to invited people to help you test your website.

Be refined

A little bit of motion can add refinement to your website. Add animated navigation icons with CSS Transformations. The motion lets people know that something has happened.

When you consider a new website or redesigning an old one, think about how to focus on the content and not just making the site look pretty. A site that is readable, fast and just plain works is going to have more people using it than one that looks awesome. Remember to make a site that is content-focused, fast, informed and refined.

Developing a website is a process

By

On September 12, 2014

In Design, Programming, Web Development

WordPressDo you have a process for developing a website? Buildings, cars and websites all require steps to build a website. Without a systematic process, you wouldn’t be able to consistently build houses, cars or websites. At WordCamp Seattle 2014, Morten Rand-Hendriksen, gave a talk on Web Design is a Process. He focused on first 3 of a 5 part process: Prepare, Plan and Build.

Here are my notes from the presentation:

Prepare

Content Strategy

  • Ask questions about the content: Why does it matter? Why should it be on the website? Who is the target audience?
  • Complete a website content audit. Create a list to know where all of the content is.
  • Create a sitemap of your website
  • Create a template map to match the WordPress hierarchy. Identify the templates that you are going to need to use.
  • Develop a wireframe for mobile only without any design elements. Use paper to create your wireframes.
  • Ask real people if your design works

Build the Site

  • Build the site with a blank starter theme and add the content
  • Add accessibility in before adding design elements
  • Add design elements in the browser. Use modular or atom design.

Summary

Website development is constantly changing. Morten provides different ideas on how to design a website. He suggested matching the WordPress templates with templates that you are going to use. This will save you time when you build your theme. Morten’s suggestions can help you to speed up the design and development time, so you can finish project faster and get paid sooner.

What changes are you going to make to your design process?

Page 17 of 31

Previous

Next

Powered by WordPress & Theme by Anders Norén