An About Us Page Design That Tells “THE” Story

Nowadays it has become a trend and a must to showcase the people behind your projects. Companies, creative collectives, organizations and associations  have seen how presenting the people behind their works gives users a feel of trustiness and professionalism and you can even showcase team members work to add weight to your company.

Breezi

In the example above the site uses a rotating image banner to cycle through each team member.

Creating the proper “Meet the Team” or “About Us” page requires a little bit of time and the quality of the page depends on the amount of guidelines you follow. Today we present you with a few basic concepts and aspects of the process to create your Meet the Team page that you can follow to achieve success on this chore.

Whether you use software like Dreamweaver, a website builder as Breezi, Flash or HTML to build your page you can follow the next tips to assure that your page will be successful.

Why Do I Need A Meet The Team Page?

If by any chance you have ever stumbled upon a big company that says nothing about them or the people they worked on you may have felt some mistrust towards them. Would you confide and trust in a company that promises will work on your project and that you have to paid them if they don’t mention anything about who will actually is behind them?

Are you looking for WordPress Theme?

Get Startup Framework for WordPress now!

Modo

Adding a Meet The Team page not only increases the level of trustworthiness that your website gives, also, showcases that there are real people, humans, working on this and not some shady project that has no backup.

It will also prove to be a resourceful way of showcasing your company assets by presenting work from your coworkers or the ones involved in the company.

Design without Content Is Just Decoration

There are several things that you can show on a Meet the Team page. It’s not only about placing pictures and photographs, it’s also about the words and the information you showcase.

Placing the name and even last name or even nickname of your members is the first thing to do. Adding a name to pictures ensures identity of your members, also, as a subtitle line, add the position or field they have on your company.

See on the next image courtesy of the Amanda & David wedding how a somewhat About Page has been used for a wedding to showcase wedding members and they only show their first names.

Amanda & David

Writing a piece of paragraph about the team member in question is a good start, don’t go over the top and make sure information is conscience and does precisely what it’s term says, inform. Add information about your coworker, background, abilities, their role in the office and current and previous work they have done.

See on the picture below how a brief description has been placed, a Twitter icon has been added for social media purposes and the pictures all are head-shots resembling each other.

WinForever

A spin to the previous content can be done by letting the members of your team talk about themselves, Mention the fact that it has to be brief and it will also be good to place some guidelines on what they talk about, do this so at the end most content is similar and homogeneous. The good thing about doing this is that the information feel personalized and let’s your visitors know that they are dealing with real human beings, improving empathy, confidence and trust.

Another thing that you can do it’s add data and information about social media. Adding links to their Facebook accounts, work related sites, blogs, and other projects can help you boost confidence and adds background information that can be corroborated.

Level and kind of expertise can also be added. When adding this you can either use wording or graphics. Showcase technologies your team workers feel capable and comfortable working with.

Last but not least you can also add contact information. Phone numbers, emails and even work addresses can be added here. Make sure you talk about this with your team members to make sure they feel safe displaying personal and work information on your site. Keep it simple and make sure this is just a way of customers to contact your team members in special and work related cases.

See on picture below how illustration, phone numbers and emails have been added to assure proper contact with each team member.

FoodStudio

At the end is best to choose what elements to show. Showing all elements at the same time can make your page look clumped and stacked with too many elements.

A Picture Is Worth A Thousand Words

Regarding visual elements there are lots of things that you can display on your Meet the Team page. Pictures, portraits, menus, illustrations and personal items can be used to add visual aid to your page.

Adding a portrait photo can be the standard for Meet the Team pages, and there are several ways to do it. You can show a head-shot of your team members, this adds a face to the piece of content that you have. There are other trends that you can follow, use full body images or ¾ images of your workmates, this feel less formal and shows you a higher degree of personalization. It is also ok to somewhat show a small gallery of pictures of each one of the members.

Another thing that’s has become common is the use of illustrations on Meet the Team pages. This is done in order to fit website motifs and keep them within design homogeneity. Illustrations are popular within creative websites and creative collectives. Designers, developers, artist and also unusual companies may use this to represent their members with a certain degree of cleverness and wit.

NgenWorks

There is something that you have to keep in mind while adding pictures and illustrations to your page, and that is that they have to be similar. The more the images look alike in terms of lighting, color and kind the site will look more coherent and consistent.

The previous stated does not mean that your team members have to lose their individuality, Be clever enough to represent who they are and still find some coherent and uniform way of presenting your visual elements.

Pictures and illustrations are not the only thing that needs to be visually represented on your site. Navigation menus between the members and having each photo clickable to access their information are a must.

Set the Mood

Once that you have selected member to show, the visual and content elements that you can place and have everything ready it’s time to select the tone that your page will follow.

Fun and creative Meet the Team pages have been a trend for years and it’s one of the best ways to exhibit your designer skills and come up with illustrative ideas, Use illustrations, head-shots, body shots or portraits that enhance your design.

Grayden Popper

You can be authentic and fun, try to engage the user into your Meet The Team page by the use of animations, clickable menus and fun writing. The more you have the user interested on your page the more they will learn about your company and their assets.

Being serious does not mean you have to be dull and boring. Sober and clean pages can still leave a good and lasting impression and if that fits your company mood and website tone then go for it.

Focus Lab

The usual way of displaying team members is represent each one of team in their own section, either showing them all at once or having clickable or rotating menus. Other convention includes using grids of pictures and also pop-able menus to show their information or also single pages of each of your team members.

Teaching By Setting the Example

One of the best ways to learn how to create Meet the Team page is by taking a good look at them. There are several places where you can browse through them but right now we are going to show you just a few of the best ones.

Best about Pages

This may not be an About Page itself but it’s actually a curated About Pages collection where you can see the best of the best. Go to Bestaboutpages.com and take a look at them!

Best about Pages

Viens-là

The Viens-là is one that really placed a creative mind, one picture is not enough. This three guys made the pictures follow your cursor and once pictures are clicked a new page opens explaining their services. Click on Veins-la.com to check them out.

Best About Pages

Check picture below and see how pictures follow your cursor and clicking on each one brings additional information to their team members. Making clickable menus is one way to keep your users focus and interested while saving some space.

Viens La

L’École supérieure de ballet du Québec

A simple but effective layout works on this page. Their Team page shows their coworkers and partners in a simple way, hovering over them brings a red overlay that once clicked opens another page with specific information about the member in question; biography, previous works and extra information can be found there. This is simple, properly done and effectively carried. Go to Esbq.ca to see their page.

L’École supérieure de ballet du Québec

The best way to learn the process of making the best “about” pages is to practice and practice. Take a look at all these tips and apply our own style to them. There are no specific rules to follow and the only way to get better is within time and hard work. Thank you so much for reading.

Chaz

Chaz is a Graphic Designer at Breeziwebsite builder, which allows designers to easily create and manage websites with pixel-level control. He is also a part-time self-proclaimed geek who enjoys web and print design, freelancing, cinema and continuous learning.

Newsletter

2 Comments
  1. Steve Nov 11, 5:48 pm

    Thanks for the post, Chaz… we just spent a bit of time on the revamp of our site, and really wanted to find a way to spotlight our people and their personalities. We settled on a scrolling thumbnail page design (randomly loads thumbnails each time to keep it fresh), and expands to a full profile. A bit of an undertaking to complete this in house (photography, clipping, coding, etc.), but fully worth it.

    Chickity check it, if you’re interested. http://www.clarusmarketing.com/team/

    Reply
    +1
  2. keletso Nov 12, 11:44 am

    Thanks Chaz… This info will help indeed, im working on my first personal website.

    Reply
    0

Leave a Reply

*
* Minimum length: 20 characters