(Originally posted, May, 2011) We posted this article a few years ago as a guide to the icons found on mobile apps. In general, “icons” mean emoji for grown-up developers. If you notice a missing icon or wonder what one means, send us a link of where you see it and we’ll help all our users learn what the new or confusing icon  means: [email protected])



As more and more people are using mobile devices to run their lives and businesses, the people who develop applications for these devices face a challenge. Smaller screens mean less space to use words that instruct the user where to go and how to use the mobile website or app. For that reason, a whole new visual language of small symbols called “icons” is evolving. These icons are supposed to convey to the user what will happen when they tap onto or click the image.

The only problem is, sometimes Developer A and Developer B use the same image for various things, or different images for the same thing. For instance, what does and “i” in a circle mean? How is it different from a “?” in a circle? Or, for that matter, an “!”? (We included that last one, as it’s an on-going debate we have among ourselves at SmallBusiness.com.)

Here are some common icons and what will likely happen when you click or tap on them. The following icons are from the folks at Font Awesome who have open-sourced them as part of development framework called Bootstrap that was created at Twitter and became an open-source project in 2011.


Cog, Widget or Gear

cog-760x240

We started with this one because it demonstrates some of the confusion. First off, it’s a symbol that goes by different names. In the real-world, the symbol can mean “widget,” a word that has a meaning among developers that has nothing to do with that real-world meaning. On an app or website, it typically means “settings.” Click it and you can adjust something.

Wrench

wrench-icon-760x246-2

This, also, is what we mean by a confusing icon, as it can, like the cog-gear-widget, also mean “settings.” For example, Google Apps used to have a wrench icon for settings but now uses a “cog-gear-widget.”

Envelope

envelop-760x237-2

An envelope should mean email, right? It may. Or it may have a broader meaning, like “click on this to contact us.” Look for one on SmallBusiness.com and click it and the latter will happen.

Right Swirving Arrow

share-icon-760x241-2

This means share. Click on it and you’ll likely see a list of ways to post the content you’re seeing onto social media sites or email it to friends or co-workers.

Another Sharing Icon

share icon

Perhaps we didn’t mention that the internet has no governing board that controls how many symbols can mean the same thing, as this one means “share” also., but wait, there’s more.

Yet, Another Sharing Symbol

share-icon-2

We feel certain there are some nuance differences in the two previous  sharing icons and this one, but on SmallBusiness.com, we’ve narrowed it down to the middle one. This one is especially confusing because it can also mean “print.” One day, this will all be worked out by the UN.

Exclamation Point

exlamation-icon-760x253

The exclamation point in a circle means, “take note and watch out.” If it’s in a triangle, it means “TAKE NOTE and WATCH OUT.” Or, if it’s part of the logo of SmallBusiness.com, it means, “here’s your answer!”

Home

home-icon-760x243-2

This should be obvious. It means, click here to play a game of Monopoly.

Ellipsis

Font_Awesome_Cheatsheet_pdf__page_4_of_6_-3

Sometimes (say, if you use Google+), you may even see a stack of ellipses. We’re guessing this icon is a visual pun that means “the stuff we couldn’t…fit here.”  Clicking or tapping on the icon will reveal options related to what you are currently viewing. (Coincidentally, the next icon means and does about the same.)

Parallel Bars (hamburger or a stack of hamburgers or hot dogs)list-760x219-2

When used as a navigational icon, either of these two “lists” mean there are lots of things the app or website couldn’t fit on a tiny screen. Typically, if you click or tap on them, some form of the navigational bar will slide in from the side or top.

Pencil

pencil-icon-760x247

This means “edit” pretty much anywhere you see it.

Triangle in a Circleplay-760x243-2

This is a play button icon. That, or a cattle ranch brand.

Circle Arrowrefresh-760x205-2

This means refresh. Refresh means stay on the same page, but try to make it work, this time.

A Dot with Two Curved Lines

rss-icon-760x235-2

This is an RSS icon. It’s a magical tool that far too few people use. If you want others to be more informed than you, ignore it.

Magnifying glass

search-magnifying-glass-icon-760x275-2

This means “search.” Even if you don’t see a search box, click on it. In fact, you can test what we mean by looking for one at the top of this screen (depending on the device you are using). Tap or click on it. We promise a search box will appear.

Beer Mug

beer-mug-icon_760x213-2

This icon means “turn off your computer and go have a beer.”

Related Articles

8
Tips for Using the New Facebook Like and Share Buttons on Your Small Business Website

Facebook updates Like and Share buttons, updating the way small business owners use them as well.

9
10 Tips for Managing a WordPress Website

From its start as an open-source blogging platform, Wordpress is now a powerful website content management system. Here are tips to simplify using it.

10
Why You Can’t Delay Making Your Small Business Website Smartphone Friendly

Smartphone friendly infographic: U.S. Adults now spend more of their time online using smartphones than either computers or tablets.

11
GoDaddy Upgrades, Expands its Small Business Ecommerce Service

GoDaddy is announcing today an upgrade and expansion of its small business ecommerce service, GoDaddy Online Store.

12
Webbly Updates its Website Creation, Management Platform

Carbon is a relaunch of Webly’s web creation and management drag-and-drop platform.

13
How to Cure Writer’s Block When it’s Time to Post Something on the Company Blog

ideas for posts on your small business company blog

14
By The Numbers | Small Business Websites, 2016

A new survey of 350 small business owners reveals that nearly one-half of their companies do not have a website.

15
SmallBusiness.com’s Guide to Selecting a Web Host

Here’s the small business guide to help you navigate the twisted world of web hosting.

16
How To Test Your Website’s Performance on a Mobile Device

Nine out of ten people will leave a mobile website if they can’t find what they’re looking for right away.

17
Wix Adds ‘Artificial Design Intelligence’ to Its Website Creation and Hosting Platform | 2016

Wix says its new feature uses artificial intelligence and a human design sensibility.

18
Google Will Start Penalizing Your Website on Mobile if You Don’t Stop Doing This | 2016

To improve the mobile search experience, Google will start penalizing the use of mobile interstitials.

19
How to Hire a Developer to Help You Make Your Website Mobile-Friendly | 2017

Need help making your website mobile friendly? Here’s what Google suggests.

20
How Small Business is Using Online Marketing | February 2017

While they are using more online marketing tools, small businesses voice frustration, need for improvement.

21
What Percentage of Small Businesses Have Websites? | 2017

The law of small business websites: There are more and more every year.

22
Google Searching for Why More Small Businesses Don’t Adopt Digital Tools | 2018

From Deloitte research commissioned by Google, a snapshot of the state of digitally advanced small businesses.

23
The #1 Small Business Lesson From the Facebook-Cambridge Analytica Data Breach | 2018

Facebook.com is home to only one business: Facebook.

24
Scholars Claim These are the Best Times of Day for Social Media Posts

What times are consumers more likely to engage with your social media posts?

25
Google’s Beginner Guide to Small Business Search Optimization (SEO) | 2020

From Google, a collection of search engine guidelines, best practices and a wide variety of the basics.