A URL is human-readable text that was designed to replace the numbers (IP addresses) that computers use to communicate with servers. They also identify the file structure on the given website.
- Use hyphens to separate words when necessary for readability. They should not use underscores, spaces, or any other characters to separate words. Overuse of hyphens in URLs can be seen as spammy, so it’s best to use caution and limit hyphen use in URLs when possible.
- Never be longer than 2,048 characters; otherwise Internet Explorer won’t be able to load the page.
- Avoid the use of parameters, if possible. If parameters need to be used, they should be limited to two or less.
From: Anatomy of a URL
SEO Best Practice
URLs describe a site or page to visitors and search engines. Keeping them relevant, compelling, and accurate is the key to ranking well.
The URL of a web document should ideally be as descriptive and brief as possible. If, for example, a site’s structure has several levels of files and navigation, the URL should reflect this with folders and subfolders. Individual pages’ URLs should also be descriptive without being overly lengthy, so that a visitor who sees only the URL could have a good idea of what to expect on the page.
Have you ever been to a website and couldn’t find what you were looking for on the page? Most websites today overwhelm users with content irrelevant to what they’re looking for. Users end up getting lost and distracted, spending extra time looking for the content they wanted. This happens because too many websites promote content discovery without considering content findability. It’s good for users to discover new content, but not at the sacrifice of being able to find the content they want.
Web Pages are Like Grocery Stores
Browsing a web page is like walking into a grocery store and looking at all the products. You might see some products with hot deals at the front of store, but soon after that you’re off to the aisles looking for what you came to the store to get. Users that visit websites do the same thing. In order for the store customer to find what they’re looking for quickly, they need to know which aisle to go to. They do this by scanning the aisle signs. However, not all stores with aisle signs have high findability.
Aisle signs with low findability
Aisle signs with low findability generally look the same. Even though each aisle is properly labeled, the signs are not distinct, which makes it hard customers to scan and find what they’re looking for. The lack of distinction forces users have to read each aisle sign. This uses up the customer’s time and energy and makes finding a specific product harder.
Aisle signs with high findability
Aisle signs with high findability are individually distinct. Customers can scan the aisle signs and quickly find the product they’re looking for. What makes the signs visually distinct and easy to scan are the color coding, pictographic icons, large label font and a general single word label representing all the products on that aisle.
Read full article…
Very nice tool to generate 100% CSS buttons: http://www.cssbuttongenerator.com/
Filling out web forms isn’t always an easy task. No matter how simple you make your form, users will make mistakes. When these mistakes happen, do your form error messages give users a feeling of worry or comfort? Error messages that are too alarming can make users abandon the form to seek safety from the unknown. Error messages that reassure users can make it easy for them to correct their mistakes and continue with the form. The form design techniques below will help make your error messages more reassuring so that users feel comfortable completing your form.
Avoid using words that have a negative tone
Words that have a negative tone have no place in form error messages. Negative words can make users feel like they’ve made a huge mistake, leading them to think the situation is worse than it is. When users feel fearful or anxious, it’s hard for them to think rationally to fix their mistakes. You don’t want to scare users to the point that they have to call on someone else for help when the issue is easily fixable. And you certainly don’t want to scare them so bad that they leave your form.
Signing up for a website is a big commitment for most people. Users that sign up for your website are giving their personal information and trust to you. If you misuse their personal information or violate their trust, you can upset your users. Most users today are more wary than ever about who handles their personal information. In a cyber world full of hackers and spammers, who can blame them? If you aren’t seeing many sign ups, your form is raising a red flag for users. Here are eight reasons users don’t fill out sign up forms.
1. Fear of getting spammed
2. Fear that a Facebook/Twitter sign up will spam followers & friends
3. No option to delete account
4. Feeling insecure with personal information handling
5. Too much work to fill out compared to value gained
6. Asking for information users don’t think you need
7. Asking for their credit card number for a free trial
8. Product/service is not clear or appealing
It’s all about user trust and comfort.
Getting users to fill out your sign up form is all about trust and comfort. Earn your users trust by taking security precautions with their information, and being transparent with why you need a particular piece of information. Make them comfortable by giving them control over their information, and only asking for what you need at the time of sign up. If you can do all this on your sign up form, users won’t have any reason not to sign up.
Have you ever wanted your users to click your links, but didn’t know how to get them to act? When some designers run into this problem they’re tempted to use the words “click here” on their links. Before you give in to the temptation, you should know that using these words on a link can affect how users experience your interface.
“Click” Puts Too Much Focus on Mouse Mechanics
Using the word “click” on your links takes the user’s attention away from your interface and on to their mouse. Users know what a link is and how to use a mouse. It’s unnecessary to call attention to the mechanics when clicking a link. Doing so diminishes their experience of your interface because it momentarily takes their focus away from it. Instead of focusing on the interface and its content, “click here” diverts their attention to the user and their mouse. Not to mention, you can also make them feel dumb by suggesting that they don’t know what a link is or how to use a mouse.
“view” relates to the users task, while “click” puts the focus on mouse mechanics
Instead of using the word “click”, look for a different verb you can use that relates to the user’s task. There’s always a better and more relevant verb to use than “click”. “Click” makes users think of their mouse. But a task-related verb makes users think of their task. It keeps users engaged with the content and focused on using the interface, not their mouse.
Read full article…
A form has many user interface elements. If you don’t know how to use them all properly, you could make filling out forms difficult for your users. One interface element that’s commonly misused is the select menu.
When to Use a Select Menu
Sometimes you’ll find a select menu with 2 options and sometimes with over 20 options. In both cases, the select menu is used wrong. When you have less than 5 options for users to select from, you should use radio buttons. This allows users to make their choice faster and easier because all they have to do is look at their options and click once. With a select menu, users have to click the menu, scroll to an option and click again. A select menu also keeps the other options hidden until the user clicks it. When you have less than 5 options, it’s better to visibly lay them all out on the form with radio buttons so that users can scan them quicker.
Stop Misusing Select Menus
There are a lot of misused select menus on the web. This happens when people lack a basic of understanding of how to use them. Now that you know, you can help put an end to it by making sure your site uses select menus the right way.
Read full article…
Everyone has scrolled to the bottom of a web page before and seen that row of numbers. That row of numbers is a website’s pagination. Pagination is a user interface pattern that divides content into different pages. It’s important to have one on your site to prevent your pages from becoming too long and overwhelming. But the way paginations are designed today are painful for users to use. It’s time to turn the page on painful pagination.
Stop Making Your Pages So Short
A web page is not like a book. The size of a book limits how much content can fill a page, but a web page has infinite height and can hold or load as much content as the website can handle. The only drawback to putting too much content on a page is that it can make the site load slower. However, most sites have enough bandwidth to support showing more content per page without compromising the loading time. The problem is that most sites show users very little content with short pages. By making your pages longer without compromising loading speed, users will get more content per page and won’t have to click the pagination as much. They’ll be able to easily scroll to see more content faster.
Users have better experiences with scrolling than clicking. The mouse wheels, touchpads and touchscreens of today make scrolling faster and easier than clicking. To get to the next page in a pagination, the user has to find the link target, hover the mouse over it, click it and wait for the new page to load. That’s a lot of work when you break it all down.
Read full article…
by Rudolph Musngi
In case that you have been stuck in a cave for the past few years, let me tell you this nice news: flat design is the current craze. We should now say goodbye to those intricate designs dominated by brushes, gradients, drop shadows and all those kinds of designs. I repeat, flat is the new trend.
The flat design is an emerging design style that uses flat shapes and icons. It basically revolves around the use of rectangles, circles, triangles and others shapes with the absence of other design elements like shadows, strokes and gradients. It was made popular by Microsoft in their computer systems, especially their new operating system they call Windows 8. Basically, the flat design style is rooted on two principles: simplicity and readability. These two principles guide the designers in formulating stylish web layouts, software designs, posters and many more.
Truly, the flat design trend has slowly but surely invaded our web pages, apps and computers. Soon enough it will totally influence us. And before that happens, let’s familiarize ourselves with the philosophy of the flat Design. We’ll talk about the elements of the design and how are they used to fully utilize the screen space.
There are actually five elements. They are:
- Absence of depth
- Use of simple elements
Before and after:
Read full article…
by Luke Clum
Is this the future of user interface design? Designer Luke Clum examines the emerging trend for flat design and what you can learn from it.
In the past, web designers put a particular focus on showing off their skills by packing sites with flashy illustrations and animations that supposedly wowed their visitors.
Today all that’s now giving way to the flat design trend, which opposes all of these ‘artificial’ design techniques, in favour of a more simplified, classically digital aesthetic. If you’re looking for a user-centric web design style, this trend might be just what you need…
What is flat design?
Flat design is a minimalistic design approach that emphasizes usability. It features clean, open space, crisp edges, bright colors and two-dimensional/flat illustrations.
Minimalist doesn’t mean boring
In flat design, ornamental elements are viewed as unnecessary clutter. If an aspect serves no functional purpose, it’s a distraction from user experience. This is the reason for the minimalistic nature of flat design.
However, just because it lacks any flashy design doesn’t mean this style is boring. Bright, contrasting colours make illustrations and buttons pop from backgrounds, easily grab attention, and guide the user’s eye. The purpose of minimalistic imagery also contributes to flat design’s functional character.
Read full article…