Monthly Archives: March 2015

Top 5 Icons of Web 2.0

20th century technology (via Rick Lindquist)
20th century technology (via Rick Lindquist)

When was the last time you used a floppy disk to save your work? For most people, the answer would be in the ballpark of “at least 20 years ago!” Floppy disks eventually gave way to storage devices like portable external hard drives, USB flash drives, memory cards. Now, the popularity of cloud computing makes saving work to devices seem like a quaint habit relegated to 20th century history. Yet, in every training session I have ever held, I do not need to explain what to click to save work. We all recognize the “Save” icon.

Semioticians argue that it doesn’t matter what sign we attribute to something as long as we all agree on what it refers to. That’s why it doesn’t really matter that very few people have used a floppy disk in the past 20 years–applications keep using it because it has been accepted as a universal sign for “Save.”

There are certain icons whose repeated use in the applications we know and love mean that when we learn new apps, we can be reasonably guess the icon carries out the same function. The floppy-disk-Save-icon in Microsoft Word does the same thing in Excel as it does in Adobe Reader. However, with the capabilities built in to cloud-based apps and services, learning a new set of signs takes some getting used to. Many people know that clicking a paperclip icon allows you to attach a document, and a garbage can icon means “Trash” or delete. Some Web 2.0 icons (especially those without reference to an actual object) require a little more getting used to, but the good news is that a little recognition can help you learn new apps quickly since you know what to look for.

Here are 5 common icons used across internet-based services. Learn them and go confidently in the direction of the cloud!

Pencil-as-edit icon

Pencil icon as seen on Facebook.

In many web-based apps or cloud-based services, changes to editable regions can be made directly on a page. Examples include Facebook profiles and Moodle pages.

Mechanics-as-settings icon



Mac users may recognize the gear icon as a way to access Settings, and this icon is also used by countless apps (including Google!) as a way to access info or settings. A related alternative to the gear is a toolset (usually a hammer and screwdriver). But if it helps, icons that invoke work or industry usually have something to do with settings.

Triangle-as-menu-expansion icon

How many menus are hidden on this page?
How many menus are hidden on this page?

If Google is notorious for anything, it’s hiding menus and options. Often, these menus can be accessed by clicking on an arrow icon. Depending on which way the arrow faces, it means you can access a hidden menu by clicking to expand (pointing left) or collapse an open menu (pointing down).

Three-dots-as-menu-expansion icon

Three dots after “Open”

You may be used to seeing three dots as part of menu text. Three dots means that when you click there, another menu or dialog box will prompt you for more information.

If you see an icon with three vertical dots, it functions the same way–something else is going to happen. This is another hallmark of a Google product



Down-arrow-as-download icon

Going down(load)
Going down(load)

If you see this icon next to something you don’t want on your computer, don’t click it! The down arrow, sometimes with a horizontal line underneath and sometimes not, prompts a file download. Most of the time (like when you’re using Google Drive), downloading a file is okay. But make sure you know what you’re downloading before you click!