user interface

Digital Makeover: 5 Steps to a Successful Web Redesign

Posted on by Mario

web development tips

Every now and again, I got dressed for work or a wedding or whatever, look at myself at the mirror and says, to no one in particular, wouldn’t it be nice to try and style my hair a different way? We’ve all been there at some point in our lives. Whether it’s with our own looks, the way your kitchen is arranged or with how your phone’s home screen is styled, we’ve all had a moment where that makeover itch is waiting to be scratched and it’s no less true for web developers.

Planning a website makeover

When it comes to redesigning a website, sometimes the underlying reason isn’t purely about looks, it’s also about functionality. The realm of the worldwide web, just like every piece of technology in existence, progresses fairly rapidly. Take a look at how much Facebook has changed for example or compare the difference between the website of every American presidential candidate since 1996 for a more pronounced difference.

That is not to say that aesthetics doesn’t matter in a website redesign. Aesthetics or to use the cooler name, design language, is one of the core tenets of your brand identity. There are times when your company has tilted enough from its original purpose that a reformed identity would be needed, which means that it’s time for a redesign. Other times, it might simply because your design language hasn’t aged well, and a redesign is necessary to keep up with your competitors.

In the end, it doesn’t really matter what your reasoning is as long as it’s a good one. A redesign shouldn’t be approached haphazardly, even if it’s a minor one. When done wrong, the backlash, as has been proved by what happened to Snapchat earlier this year, could be detrimental. Both the planning and execution has to be done correctly in order to not mess with the user experience while still achieving your specific business goals.

Step 1: Identify what you want to achieve that’s currently not being met

Before you begin the makeover process, the first step you’ll have to take is outline what you would like to achieve from this redesign. These goals should always be concrete and not vague, ambiguous goals, such as because you’re bored of the current look. If it’s related to a new functionality, ask yourself if it’s important enough to warrant a redesign or if it’s something that could be added to the current design.

A redesign doesn’t always have to start from zero. You have to determine which part of your website works the way it was intended to and which is falling short. Keeping some of the old parts intact might save you both time and money once the actual work has started. This is the stage where you, as the business owner, need to determine whether this redesign is actually needed or not. Don’t forget to set an acceptable timeline for this process.

Step 2: Get an opinion from your users and/or a neutral third party

Once you’ve outline your own goals, the next step is to cross-reference your own goals with what your users want. They’re the ones who’ll be spending time in your website and if it turns out that what they want is in conflict with what you want, it might be a good time to reconsider your own position. This doesn’t mean that you should always take their word over your own, because actually, the customer isn’t always right.

People have a tendency to resist changes, even if those changes are actually in their benefit and even necessary in some cases. Apple’s idea of selling one song at a time when iTunes was first launched was unpopular within the industry but it proved to be a hit and managed to drive established businesses like Tower Records to bankruptcy. If you have the necessary data to backup your views over the customer’s, it might be worth it to stick to your guns.

Step 3: Figure out the sitemap and information architecture

Once you have an idea on how your website is going to look, the next step is to design the layout of the pages in that website and how they connect to each other. You do this by using the concept of information architecture that maps the hierarchy of every page in your website and how they interact with each other. Think of these as the foundation for your website, something you have to take care of first before you could paint and decorate them.

Step 4: Start the design process, with a focus on your homepage

Whenever you go on a first date, a great first impression is the number one thing you’re striving for. Every subsequent interaction will always be informed by what you think of your partner in those first few moments. Transplanting that idea into the world of web development, that first impression is the kind of burden your homepage is going to carry. As such, always stress the importance of your homepage in your redesign.

Step 5: Prepare mockups and prototypes

Before you put pen to paper, do a simple prototype of all of the ideas you’ve accrued in the first 3 steps to see how they would work in real life. Great ideas don’t always translate well into the real world and it’s common for those ideas to require some fine tuning before they can be unleashed to the public. While it is possible for you to perform some on-the-fly changes to a website once it’s live, this is not advisable. Always make sure your product is fully prepped before they’re out.

Once you have your prototype and running, you can evaluate for yourself whether the design you’ve created works the way it was intended to. If you’re completely satisfied, you can proceed with the actual development according to the timeline you’ve set. If it doesn’t, which is more likely, then you could go back to any of the previous steps to figure out things that could be improved. Feel free to take your time with the redesign; it’s too important of a task to rush through.

5 Essential Elements of Small Business Websites

Posted on by Mario

The Important Elements for Small Business Websites

For a business to operate in 2018, having a website is indispensable. It’s not enough to have an Instagram page or a Facebook account; you need to have a space that you could call completely your own in addition to your actual place of business. That space is your website.

Gone are the days where you need substantial skills and experience in web development. The advent of user-friendly web builders means that you could set up a website of your own, for a fee, in the time it takes for me to finish this piece, perhaps even quicker. Contrary to popular belief, these do-it-yourself web builders actually enable you to design a website that wouldn’t look out of place sitting next to a graphic designer’s portfolio.

Small business websites, explained

When designing a website for a small or a new business, there are certain considerations you’ll have to take. You can’t just look at what the big companies are doing because you don’t have the kind of influence, recognition and standing that these companies have. For small businesses, website should act as an introductory course, communicating clearly just what does your business stands for and how you can help your potential customers.

What you should put in your website is obviously going to be informed by what kind of business you are running in the first place. The website for a design & marketing firm for example would be drastically different when compared to a boutique shoemaker but as each are small business websites, they inevitably share some common essential elements and features inherent to their nature.

A short introduction on your main or landing page

As stated before, websites act as an introductory course for small businesses. They tend to act as the first place of meeting between a business and their potential customer. It’s like whenever you enter a new job, the first thing you’ve got to do is introductions, to your new coworkers and superiors, to your new position and to the company itself.

Big companies don’t necessarily have to enunciate who they are because chances are, the public already know. Small businesses don’t have this luxury and as such, the main page of your website should communicate clearly who you are and what do you do. For businesses that deal in tangible products, displaying images of your product is one way of achieving that goal. For professional services, using a simple tagline would suffice.

Background details on your company and your value proposition could be tucked in further down the page but it is important that customers know what you’re selling the second they access your website.

A definitive guide on who you are and what your company stands for

Once the short introduction is out of the way, you still need to include detailed information on your company’s background in your website, usually in the ‘About Us’ page. Ideally, this page should include what vision you have for your business, what exactly drew you to be in the business and your value proposition, what makes you stand out against the competition.

Your customers are human, which means that they aren’t entirely objective. Sometimes, having the right personality and a vision that is in line with your potential customers is enough to nudge them over to your business.

Reviews and testimonials

Again, not a concern for major companies but could be a game changer for small businesses. Professional services rely on reviews and asking previous customers to put in a good word for you to display on your website has been a mainstay of small business websites. For business that deals in products, including a selection of photos of your products being used or worn by actual customers is a good idea.

A simple web address

There are a lot of ways you can be creative about your business but the URL is not one of them. Your URL doesn’t have to be an actual word, the important thing is that it’s short, uncomplicated, and easy to remember and preferably, has your company’s name in it. Dashes are a nightmare and ideally, it should not include a number unless it is a part of your company’s name. For domain, stick with .com as that’s the default setting for most users.

Easy-to-find contact information

This could be achieved in a number of ways. The most obvious recourse is to include a ‘Contact Us’ page and your social media links in a fixed navigation bar. A fixed navigation bar is a navigation bar that sticks in place even after the user scrolls down the page, which would ensure that you will always be easily reachable at all times. If you have a physical place of business, including your location in Google Maps is a preferable way than merely listing your address.

Additional considerations

In addition to the considerations listed above that are specific to small businesses, the usual best practices for general web design also apply. Mobile friendliness, text legibility, and minimalist design are some of the additional considerations you might want to think about. Remember, you only have one chance to nail your first impression and you definitely don’t want that impression to be a cheap mess of a website that is somewhat common for small businesses.

The Professional and the Personal: How to Differentiate between B2B and B2C Web Design

Posted on by Mario

web design for b2b and b2c

Until our A.I. overlords takes over the world, businesses are all about people. The disappearing milk bars, once a ubiquitous feature of the Australian suburbs, cater to people. Large multinational banks cater both retail customers and corporate clients. But you know what’s behind those large corporations? More people. B2B and B2C marketing aren’t diametrically opposed to each other like the Montagues and the Capulets, they’re more akin to first cousins once removed.

Understanding the subtle and the obvious differences between the two is a critical factor in marketing. While there are a lot of similarities between B2B and B2C marketing, the balance between the subjective and objective varies between B2C, B2B and companies that cater to both. In web design, now considered to be the frontline and most important part of marketing, these differences manifest themselves in a number of different ways.

The tone and aesthetics

The basic difference is of course, the look and feel of the website itself. B2B websites are usually sanitized, adopting a cooler color tones and minimalist design. B2C websites on the other hand is usually loaded with personality, especially those targeting a younger demographic.

For a direct example, take a look at the website for MSI, a Taiwanese company specializing in computer hardware for both retail and enterprise customers. The main page for retail products is heavily stylized, featuring personalized fonts and colorful banners with a black background and splashes of red. By contrast, the main page for enterprise products is heavily muted, adopting a clean and minimalist design with only the banner displaying multiple colors, which are nowhere near as eye-catching as the one from the retail page.

The call to action

If you’ve ever been in the middle of a tendering process or have worked in a procurement division, you know how laborious business purchases can be. Even for relatively small purchases, the process of bargaining with a vendor can take quite a while. B2B marketing is a slow and methodical process and as such, B2B marketing is usually independent of the sales department, compared to how B2C marketing practically doubles as the sales department.

In web design, this translates to the prominent of the call to action button in product pages. For example, take a look at this page for one of Juniper’s core routers and compare that to this page for Microsoft’s latest Surface Pro tablet-notebook hybrid. You can’t just go and buy Juniper’s routers but look at how the ‘Request a Quote’ button is placed compared to the prominence of the ‘Buy Now’ button in the page for the Surface Pro. In B2B marketing, closing the deal is usually not part of the job description.

Differentiating between choosers and users

In B2B marketing, there are moments in which the people charged in acquiring the goods aren’t the intended users. Proper division of labor is after all how large corporations work. An employee of the engineering division might be the one doing the research but the decision has to be signed off by the managers or the procurement division. As B2B marketers, understanding how to appeal to this divide is important as this is never an issue in B2C marketing.

The engineering team (the users) is purely objective, their primary goal is finding the best product they could find. The manager (the decision maker) have to look at the bigger picture and have to take into account a myriad of other factors, like cost-and-benefits or potential return of investment, product integration issues or technical support. Making sure that your product page is loaded with the relevant information could help in convincing your potential customers.

The subjective and objective appeal

In B2C marketing, appealing to the emotional core of your audience is usually the right approach. Individual customers aren’t looking for productivity; they want something that makes them feel good. That’s not to say that they lack objectivity but since doing a thorough objective evaluation of two competing products is close to impossible, they gravitate to brands that they like, brands that they feel understand them.

B2B customers on the other hand are looking for an objective valuation. They are looking for goods and/or services that could best meet their needs at a certain price range. Brand cachet is less of an importance in B2B marketing; I’ve attended enough tender bidding process to know firsthand that the value proposition is always number one.

In web design, this difference translates to what contents are displayed. Educational contents, statistics-laden contents and case studies of how your company has helped other businesses are a staple of B2B marketing. For B2C marketing, contents involving emotional storytelling are more preferable. This does not mean storytelling have no place in B2B marketing, framing a case study as a story, like the work of chipmaker Qualcomm with helping Saipan’s water problem, is one method we’re seeing more and more.

Closing thoughts

Whether it’s to a business or directly to a customer, people are the one doing the browsing, which means that the standard arguments apply. Website usability and functionality is still a key. For marketing, having a dedicated chat box for customers to drop a question or two could be particularly helpful, so long as you make sure that the response will be swift. If your business serve both B2B and B2C sector, it is advisable to have sections dedicated to both like the MSI example from above.