Tag Archive for: web design

Tips in Reducing Your Website’s Bounce Rate (Part 1)

Bounce rate is the number of web visitors who enter your website, and then, leave instantly. In an ideal setting, you would want your web visitors stay a little longer and browse your website. The main goal is to keep the bounce rate low. Your website should be inviting for visitors to stay. That’s why I thought of sharing ways on to how convince your web visitor not to bounce away.

A Keyboard and Two Flat Screen Computer Monitors

  • Keep Your Blog Posts Short
    • Your bounce rates will most likely skyrocket if you continue to blabber nonsense. Your paragraphs should be direct to the point. There’s no point for you to add flowery words.
    • When explaining something, a list post really helps. It doesn’t seem too difficult to understand when things are shortened.
    • Cut the chase and stop wasting time in discussing certain things.
    • Usually, you can elaborate a specific point using 2 to 3 sentences.
    • However, if your list has like 3 or more points, then, you should add numbers to avoid confusion. For example, you should say, “This is the 2nd option.”or “This is the last factor to consider in web design.” You are web visitors with the pacing. They now know how many items to read in the succeeding paragraphs.
    • Lastly, when you are keeping your words short, you are accommodating the whitespace. Seeing whitespace will help readers to be calm. Thus, they won’t easily leave your site, and will read more blog posts instead.
    • Here are a few tips to make your content readable:
      • Arrange your posts. Use the different formatting options (h1, h2, h3, etc) for the title, the body, and other important subcategories.
      • Add horizontal lines to break into paragraphs into different sections.
      • 2 to 5 sentences should be long enough to create a paragraph. This is NOT a contest on who could write the longest.
      • Write using bullets or numbers. Adding a multilevel list will not overwhelm readers. (like this blog post!)
      • Bold or italicize terms when you want emphasize your point.
      • Lastly, add pictures, or any colorful visual. It breaks the monotony of texts.
    • Add Related Posts at the Bottom 
      • We are done with writing tips. This time, ask yourself, “What more can I offer my readers?”
      • Once they are at the bottom of the page, try recommending other posts to read. They’ve reached the bottom because they like what they are reading.
      • It’s useless not to list all related content after each post.
      • This is an effective way to convince people to stay. If they’ve completed one blog post, they probably be interested in reading another post.
      • Try adding widgets on your web page so your readers can easily look for new articles to read. This will help in lowering your bounce rates, and at the same, it will keep your readers entertained.
      • For WordPress users, you can use a plugin called WordPress Related Posts. This plugin will help choose similar posts, but you can freely choose what to display. There are options to like displaying the posts as a list or adding images. It really depends on your preference.

Trendy Modern Web Design Elements (Part 2)

Previously, I have discussed importance of having a card base design, enormous product photos, and product videos. If you need to catch up, part 1 is here. Now, let’s continue discussing and I will share 5 more tips in achieving a ultramodern and extraordinary web design.

Unique Typography

  • One way to be distinct is to select a remarkable typography. There are now a lot of websites that sell unique typography so try browsing for something that catches your attention.
  • It’s now easier to express your own style and character. Through your preferred typography, your customers can easily pinpoint your brand.
    • It’s helpful when:
      • you want to be strikingly obvious.
      • you want to introduce a different side of you.
    • Whatever you choose to show, whether it’s happy, serious, friendly, make sure the typography is compatible with a wide array of browsers and devices. If not, the font won’t show properly.

Massive Hero Images

  • Hero images are enormous banners that are on the center of a web page. The picture below is an example of a static hero image. When the photos are changing, then, that’s what you call dynamic. You can combine both image and text to create huge hero banners.
    • It’s helpful when:
      • you want to promote in a creative way. Visually appealing images are more convincing than plain text.
      • you want to give emphasis on a new product, or you want to inform everyone about your bestselling product.

Macbook Pro Beside Mug

Background Videos

  • Another effective alternative aside from hero images is putting background videos. It’s intriguing and quite impossible for someone to just ignore a playing video. Plus, human brains are visual, meaning we remember things better when we are watching rather than reading it. When you are explaining through videos, the things are easier to understand, and information flows seamlessly.
    • It’s helpful when:
      • you want to give emphasis on a new product. this way, you can elaborate on its features.
      • you want to save space. A video can does everything; no need think on what image or text to include.

A flat design

  • When a web design element is not 3D is considered a flat design. A concrete example is when a photo has no shadow. Did you know that Apple applied a flat design back in 2013? It’s because pages to load instantly when the elements used are flat.
    • It’s helpful when:
      • you want to prioritize the speed of your website.
      • Because things are faster, your users can better understand what you are trying to point out.

Hamburger Menu

  • When you have a lot of buttons and menus, it tends to complicate things. To simplify things, you can just add one menu button called hamburger menu.
  • Nope, you won’t need an actual hamburger. Take a look at Google Chrome. They have removed the distractions and the only menu is on the right corner. Notice the 3 lines that are lined up and formed a hamburger-like shape.
    • It’s helpful when:
      • you want to make things easy for your users, and improve user experience.
      • you want to remove the clutter and delete options that causes confusion.

Trendy Modern Web Design Elements (Part 1)

The web design elements 5 years ago may not be applicable now. Since it’s already 2019, it’s time to renovate your website. I will share with you 3 web design elements. More tips will be discussed on part 2. If you want to go there right away, click here.

Shall we start revamping your website into something in the mainstream and trendy? Let’s get it on!

Card Based Design

  • The card layout is becoming a stylish addition to websites.
  • Basically, the concept of this design is that the content is presented in a card. A variety of cards are presented on your screen, and it’s up to the users to choose what card (or featured image) they are going to click..
  • Pinterest is a popular example of this. Why is it popular though?
  • The card base design allows users to be a glimpse on the content without opening the link. In other words, it is convenient and saves time.
  • Web visitors won’t have to click on every link just to see if it’s something they like. A snippet is provided for people to read.
  • It’s helpful when:
    • you are displaying products on one page. Users can easily decide what products they like basing on the featured image. Shopping is made easy this way!
    • you are focusing on your mobile users. The card image is almost the size of a phone screen.

Enormous Product Images

  • Let the pictures do the talking. Words, sometimes, do not give justice to the product. To emphasize on your product, you need to highlight the features and show your customers the product images.
  • For example, look at Apple’s iPad. On its product page, there are only a few words, and more pictures. The vivid images speak for itself. Basing on the pictures provided, you can conclude that the device is slim, powerful, and it can do what a huge computer is capable.
  • It’s helpful when:
    • you want to show your customers visual proof that your product is exceptional.
    • you want your customers to have a better understanding about your products.
Two People Watching a Video Online.

Two People Watching a Video Online.

Product Videos

  • This is related to the product images. Videos are a popular alternative. Websites are adding a short clip of their product. With videos, you can combine both text and images. Thus, the product is explained more clearly. Customers can decide right away if the product suits them or not.
  • According to an article by Inc. Magazine, product videos are the best marketing weapon in B2B websites. Why? When B2B customers were asked, they openly shared that they look for product videos when researching online. Most of them mention using platforms like YouTube.
  • So, B2B companies should give thought to this study. There is clamor in creating product videos because 92% of B2B customers look for it.
  • It’s helpful when:
    • you want to demonstrate how to use the product.
    • you want to explain unique features of the product.

So, that ends part 1. If you want more, don’t worry because there will be more web design trends discussed on Trendy Modern Web Design Elements (Part 2)!

What Makes a Product Page Impressive?

Creating an impressive product page is important for your website.  It should not just be a dump of information. Instead, these product pages should be convincing enough to invite people to click. For it to be effective, the page should be able to attract attention. Nowadays, most websites make it a point to make their product pages are more interesting, inviting, and irresistible.

Person Shopping for Watches Online

Person Shopping for Watches Online

Let’s discuss specific elements on another post. First, I will discuss the basics. What makes a product page impressive?

An effective product page should have…

  • A product photo: 

    • I think this the most important aspect of a product page. A customer wouldn’t buy a product without a preview of it. Like shopping in real life, buyers should be able to see the product first. Providing a product photo allow potential customers to look at it. So, make sure that these photos are sharp and crisp.
  • A bulleted list: 

    • With the product photos available for customers to view, they won’t be needing long product descriptions. Most of the time, they even skip reading. Preferably, add a bulleted or numbered list for them to easily look through the descriptive words. If the product details are organized in a list, your customers can easily find the products he actually wants. For example, in online bookstores, sellers usually provide the publication date, book dimensions, publisher name, genre, and ISBN in a list format.
  • A general overview:

    • Not every description is brief. You also have to provide 2 to 3 sentences about the product you are selling. For books, the ISBN and genre would not suffice. It doesn’t give the customers an idea on what the story is. Of course, you have to provide the book’s synopsis. When there’s a synopsis given, they can easily decide if the story appeals to them or not.
  • Call to action button, and social proof

    • It depends on you if you want to add a shop now, buy now, or add to cart button. Lastly, there’s should be proof that you are selling high-quality product. Don’t forget to feature customer reviews too.

Basically, these elements constitute an impressive product page. Don’t just solely focus on improving the product. Give importance to the product descriptions because it will help convince customers to check it out. Let’s continue to use the book example. Without adding an overview or synopsis, customers would not know if this book is enjoyable for them.

Allocate time in getting to know your customers, and design creative descriptions that appeal to them.  Personalize product descriptions for your customers and not for you. Write about the different features and benefits of the product. Experiment unitl you find the perfect mix!

Learn from Amazon.

Let’s take a look at the different strategies you can learn from Amazon: part 1, part 2, and part 3. Learn how they design their product page. Being the largest e-commerce retailer in 2017, Amazon is definitely an authority in the field. Companies such as Apple, Wal-Mart, and Macy’s were next in line. It’s only natural to grasp what they know, and learn from what they do best!

Product Page Essentials (Part 2)

If your online store is not so much clicks, most probably, it’s not the product that needs to be replaced. Perhaps, it’s the product page. Your product page needs a little spring cleaning. It’s time to delete old web elements that’s not working anymore, and add certain elements that will help convince people to buy your products.

Two Women Looking at their Smartphone

Two Women Looking at their Smartphone

For this blog post, I’m going to share 4 product page essentials to covert more lurkers to customers. Previously, I already shared 4 tips so this post is basically a continuation.

Time to revamp the product page into a better version:

    • Product descriptions are extremely important, and they’re just there to fill an empty space.
    • According to OneSpace’s detailed research, websites gained an 84% increase in web traffic by redoing their product description. The survey only stated editing 10% of the description. Imagine, if you would  edit more than that, the potential of convincing web visitors to buy would be higher.
    • Try to be different, and don’t just add a generic description given by the manufacturer. This is your chance to give a thorough description about the product you are selling.
    • Make it easy for your customers to imagine your products using the right words.
      • Pro Tips:

      • In a previous post, I already discussed how to write product descriptions.
      • Product descriptions should not follow a certain structure. Instead, it should follow your brand’s voice. Whatever you decide, please make it scannable for everyone’s convenience.
      • Customers will always be doubtful because there hard-earned money is at stake.
      • If you answer all the commonly asked questions on your product descriptions, it will just make it long, boring, and uninteresting.
      • So, dedicate a page strictly for the frequently asked questions. There, you can address your customers’ question. Erase their doubts by explaining how you do business.
      • As stated on the photo on this post, there’s an huge increase of mobile users. People are shifting to using their mobile for online shopping. With that being said, over 34% of web revenues were all thanks to shopping on mobile devices. This data is only in 2017 alone so it’s expected to greatly rise in the coming years.
      • It’s going to be a shame if your online store is only optimize for desktop computers. Time to give priority to your store’s mobile version. Both desktop and mobile versions should ensure clarity, readability, and scannability.
      • In this digital age, people have developed a fear of missing out. When people see that you have an ongoing a flash sale that’s only for 12 hours, they will surely hurry and move the items on their wishlist to their shopping carts. Add a sense of urgency so that your website will invite more people and more sales.
      • People can feel the urgent need to shop if you add countdown timers too. Remind them through timers and banners that the sale will end soon so they better buy the items now. If you are looking for more psychological tricks, you can view them here and add them on your site.

Product Page Essentials (Part 1)

Sometimes, you are wondering why a website is not gaining much attention. Perhaps, it’s time to revamp your product page. Sales are affected by how to you design your product page so I will share web design tips. These suggestions are pretty easy to do and it will make your product page stand out.

Men's Assorted Dress Shirts

Men’s Shirts Available in Different Colors

Read the 4 tips below:

    • No customer would buy something they haven’t seen. So, on your product page, try to add high-resolution images of your product. As an online store, you need to provide a satisfying shopping experience by providing a preview of your product.
    • You can also provide the exact dimension of the item along with the product photo. Attach pictures from different viewing angles.
      • Pro Tips:
      • Keep the background white because your colorful products will definitely stand out more on an achromatic background.
      • Include photos of people using your product so buyers can anticipate the size. The picture may give the wrong impression that a product is large when, in fact, it is just tiny and pocket-size.
      • If a product is available in multiple colors, provide product photos on the all the available colors.
      • If you read my previous post regarding Robert B. Cialdini’s book, I shared that people respond to offers when you give out a freebie. Surely, they are more likely to buy from your website when they receive a free shipping voucher from you.
      • So, offer a limited-time offer discount or a free item on their first purchase. People can’t say no to FREE items. You can use this as leverage for people to take action. To prevent abuse, you can limit the number of freebies. For example, there is a maximum of 3 freebies per customer.
      • Whatever you say, web visitors will not instantly believe you. They will only trust fellow buyers. So, they don’t really care about your “outstanding product.” They are interesting on reading what other people are saying. Allocate a space for your top-rated products and thorough reviews. For sure, other customers will be curious on why this person recommended a particular product.
      • If you read BrightLocal’s survey, it reported that 73% of the customers agreed that they’re most likely trust online stores more when they see positive reviews on their website. This 2017 report just proved how affects that behavior of consumers online. Just remember to not share too many 5-star reviews because it’s obvious you’re selecting only the positive ones.
      • When people click on your products, there’s a chance they might not like what they click. To avoid dead ends, try to suggest related products at the bottom of the page in case they don’t like what they just viewed. Suggest other items they might like.  They wouldn’t immediately leave your website because of your interesting suggestion. You might end up recommending a product they actually want.
      • Learn from Amazon’s strategy! They always remind their customers that you might want to add this in your cart. There’s a section that says, “Customers also bought this item.” So, don’t forget to your share recommended products on your own product page.

How to Design Your Website’s 404 Page (Part 1)

What’s a 404 page in the first place? For those who don’t know, a 404 page appears when someone clicks a faulty link. It’s a typical response to a defunct page. Not a lot of websites personalize the given error message on the 404 page. Usually, the page will just let you know that the link you clicked is “broken” or say that “page not found.” These days, web designers venture out and experiment on the 404 page.

Man Holding a Map.

Man Holding a Map.

In this post, I will give you tips on what to add on your 404 page. I will give you unique ideas on how to present your error message in a helpful and creative way. After all,  the page isn’t all fluff. It should offer assistance to the web visitors who have lost their way.

  • Lessen the impact of the error.

  • When your web visitors see an error, they already disappointed. What you can do is to lessen their frustration. Grab this opportunity to pacify the atmosphere. Remind them that you are doing your best to resolve the issue.
  • A generic promt would not help appease the situation. It will only give a very cold and uncaring impression. Ultimately, it will make your web visitors more disappointed. and abandon the page.
    • What to do to lighten things up?
    • Be like a friend!

    • Number 1 tip is to be friend. Draft a 404 page using a friendly tone. Design the page with a welcoming and amiable atmosphere. Remind them to check their link. Say something like, “Hi there, I’m sorry that you’ve stumbled upon this page. Perhaps, you clicked an incorrect or outdated link. Kindly check the link again.”
    • You can even tell a joke.

    • People feel bad upon seeing an error, but you can always lighten up the situation by adding puns, or sharing a corny joke. Add something funny to ease the disappointment. For example, “Oh no! The link is broken like all the broken hearts out there! Will fix this before Valentine’s Day!”Below that, you can add more options for them to click.
    • Be bold.

    • Grab the attention of your web visitors by adding you own personality. Blizzard’s 404 page is literally a broken page. It’s shocking for first time visitors, but it’s an awesome and unpredictable response at the same time.
    • Add interactive games.

    • Kualo‘s 404 page is more than just funny meme. When you’ve stumbled upon a broken link, it will notify you that space invaders took over the web page. An actual game similar to Space Invaders will appear.
    • See, the page, what once was considered a bearer of bad news, is now a very fun and exciting game.
    • The error will also give you the chance to get a discount. If you score over 1000 points, the game will grant you a web hosting discount. This proves that 404 pages are not always full of disappointment.
    • Be informative!

    • Aside from being sassy, friendly, and funny, this is also your chance to be of help to your web visitors. You can suggest resources and links about things that got lost.
    • The National Public Radio’s 404 page offers a list of informative posts about people who mysteriously disappeared like Amelia Earhart. Instead of thinking about your broken link, you will be more curious on what really happened to Amelia.

For more 404 design tips, you can check out part 2 right here!

How to Design Your Website’s 404 Page (Part 2)

Man looking for safety

Man looking for safety


A 404 page does not always have to bring disappointment in our lives. As a web designer, this is your chance to make up for the mishap. Guide the web visitor back on the right track. You can suggest taking them back to the previous working page or suggest reading another article that may interest them. You can present all your navigation options through a 404 page.

Follow these tips when designing an error page:

  • A 404 page is not all text.

  • Yes, you have to convey well your message. Apologize for the mistake, but you also have to ease their frustration by adding an image. Some websites add a funny image to lighten up the mood. Why empathize on the image? Because the first thing that people will notice is the image on the screen. The image displayed will help lay emphasis on your message.
  • Don’t overwhelm your web visitors.

  • You have to understand that they are already frustrated. Don’t add up to their stress. Images may help them cheer up, but you also have to offer a clear navigation.
  • Help get out that 404 page by presenting a limited number of options. They are lost so there’s no need to further confuse them by presenting so many options on where to go.
    • When your web visitors encountered an error, these are the 3 basic things you can offer:
      • They go back to the previous page so they can track where it went wrong.
      • They can also go to the home page of the website so they start over.
      • Lastly, they can report the error. Allow your web visitors to help you out. Perhaps, you are not aware that such problems exist. When you have an avenue for your web visitors to report an error, invalid page, bad link, you get to immediately take action. You are given a heads up that hey! This page ain’t working. You know what areas to improve on, and you know what needs to be done instantly.
    • Aside from giving 3 navigation options, you can also add these tools on your website to help more customers in the future.
      • Live chat feature.

      • Most of the time, chat bots are annoying. They just pop out of nowhere. However, when someone needs help, chatbots are really helpful. In a situation where a customer is lost, chat bots can be a lifesaver. Adding a chat option can help customers get on the right direction. You create automated messages that will guide web visitors to the main parts of your website.
      • Search box.

      • Another brilliant way to help is to add a search box on the 404 page itself. Web visitors don’t need to go to the home page to start a new search. They can do it right there. Perhaps, the 404 page appeared because they misspelled something. This search box can offer immediate assistance.
      •  FAQ.

      • Lastly, you can use this chance to answer questions regarding 404. You can why they are seeing an error, and answer common questions related to it. Grab this opportunity to inform your web visitors about the causes, and at the same time, alleviate their frustrations.


Scottsdale Web Design – Apply These Psychological Tricks on Your Website (Part 3)

Psychological tricks of colors and more.

Psychological tricks of colors and more.

We have finally are down to the 3rd part of the different psychological tricks you can use on your website. If you want to catch up, you can do so by clicking part 1 here, and part 2 is posted right this way. Reminding everyone that these concepts are not my own. This is based on a book called Influence: The Psychology of Persuasion.

  • The price is right.
    • Nowadays, consumers don’t buy something at first glance. They utilize internet and research for the product that offers value for money.  Before deciding to buy an item, they look at the best available deals out there.
    • One way to stand out from the rest is by using the classic example of the “.99” price tag. For example, competitors priced their items at $25.00, but you priced yours at $24.99. This pricing strategy convinces customers that the product is only $24 even though it’s a cent away from $25.
    • It’s a way of telling the customers that are saving some bucks.  In reality, the price difference is not that huge to be honest.
  • Find the right timing.
    • Amazon always knows where to put things and when to offer them. For example, when you put an audio CD in your cart, Amazon gives you more music recommendations. Once you are about to pay for the CDs, it will tell you that some customers also purchased these albums.
    • Similarly, if you are selling mobile phones, why not offer accessories while they are reviewing their cart? Perhaps, you can suggest phone cases, earbuds, or portable speakers.
    • Do not them these accessories while they’re still pondering on mobile phone brand to pick. It’s unnecessary to bombard them with add-ons. Once they’ve actually bought something, that’s the time you can introduce the compatible accessories.
    • You can do this by sending a “thank you for your purchase” email. In this email, you can include a list of products they might enjoy based on their latest purchase.
  • Colors of the wind.
    • When you are selling a product, you have to master art of persuasion. One way to convince people to purchase is through color choices. Did you know by changing the appearance of your CTA buttons, it can actually help your website gain more clicks?
    • In one survey, 93% of customers bought a product just because they liked how it looked. The remaining 7% said that they bought it because the product smells nice and feels nice as well.
    • Furthermore, 85% of customers revealed that they bought a product just because the color appealed to them. This proves that choosing the right color is important in brand recognition. Aside from color, design and word choices play an important role too.
    • If you are selling food products on your website, avoid a blue color scheme. No popular fast-food chain ever used blue because it is a color for weight loss. Blue, however, calms the mind and encourages trust. So, it’s ideal for services like banks, high tech products, and more.
    • Top brands like McDonalds, KFC, Popeyes, Chick-fil-A are using a blend of red. The color red and orange brightens your website. It exudes a live and fresh vibe.
    • If need a guide on choosing the right colors for your website, this post will help you a lot. If need details on many uses of different colors, it is all here. Lastly, I’ve also discussed the role of color contrast in web design.

Scottsdale Web Design – Apply These Psychological Tips on Your Website (Part 2)

The psychological tips and tricks presented on this posted below are based on Robert B. Cialdini’s book. If you want to read part 1, you can click this link. For this 2nd post, I will still discuss the importance of personalization, recommendation, and other ways invite more web visitors:

  • Tailor-made for every user.

    • Don’t make everything about business and money. Take time to get to know your audience, too! Interact with your followers. That’s why social media is there. It’s an avenue for you to connect with your existing customers and future ones.
    • When they see how much you take time to answer their questions, they will appreciate it. When you are active on social media to address issues, they will know that you are dedicated on giving the best to your customers. You are NOT just another website that’s after the money. Your customers will consider you a friend that’s definitely worthy of their trust.
    • When replying to inquiries online, be personal and address them by their names. You are talking to someone needing help. This is not the time to speak formally. Don’t be afraid to show your personality because it makes the company less generic and more human.
    • You don’t need to follow a template because it’s ends up pretty unconvincing. This is you, and you don’t need to act like this website because they are well-known. Go through your social media posts and blog posts and check if it seems fabricated. If you can’t see yourself saying it, then, don’t include it.
  • The power of a positive review.

    • Whether it’s from a from a popular internet star or from an ordinary citizen, a positive review will boost your credibility and trustworthiness. Never undervalue its ability to motivate other people to try your products.
    • These reviews will push the undecided to go and try your products. They don’t have to worry because a great number of people vouched for the usefulness and quality of your products.
    • If someone famous mentions your product and puts in a good word for you,  spread it on social media. Highlight positive reviews on your website so new customers will immediately feel confident when transacting with you.
    • Whether the review is from a celebrity or not, make it a habit to share the review, and to respond to these positive reviews. A simple thank you is nothing compared to the boost they have given your brand.
    • To be honest, no amount of sales talk can compare to the reviews given by actual people. So, gather all the promising reviews and share them the world!
Paper Bags Near Wall

Of course, no one can resist the word: SALE!

  • Limited-time offers.

    • When products are only available for a limited time, people feel like they shouldn’t miss this “once in a lifetime chance.” As a result, the demand for a product increases because everyone has the same mindset.  Everyone is compelled to participate and grab this exclusive offer.
    • Everyone is buying it so I’m buying it! It may be silly reason for some, but it’s still an effective marketing strategy. People don’t want to miss out on what’s popular.  They want to do what others are doing.
    • So, if there’s this sale ends in 48 hours, I should shop now because other might beat to it. It’s human nature; there’s always a need to be constantly updated.  If there’s a sense of urgency, then, definitely, it will motivate everyone to shop before it’s over.