Tag Archives: article

Local Delicacy: Making Your Website More Appealing to a Local Audience

web development tips

There’s being famous and then there’s being ‘famous’, or infamous, for the proper word. The person who first said that any kind of publicity is good publicity has clearly never met Martin Shkreli, a man so hated that his own lawyer once said that they felt like punching him in the face from time to time as well. Fame isn’t just fame; there are actually several different layers to the term fame itself that you might want to know about.

In another example, there’s the term famous and ‘locally famous’. KFC is famous, almost everyone around the world knows about it while a place like the Seven Seeds might only be known to those with a familiarity to Melbourne. On the outset, being locally famous might seem like the lesser outcome but for small, homegrown businesses, being known by people in a 10-mile radius is better than being known by people across the Pacific, which is why in terms of web development, increasing your website’s local appeal is preferable for small businesses.

Locally famous in a globalized world

Yes, I know that it sounds slightly oxymoronic but trying to appeal to the widest audience possible might not always be in your best interest. Anyone who serves food and or beverages would have no use in attracting customers from a thousand miles away and professional services such as in the legal and financial field wouldn’t work beyond borders since each state, not to mention country, has their own specific laws.

Sure, we’ve now come to a point where say, Indonesian boots maker can garner customers and a write-up from a New York-based publication or how going to Hong Kong just to have a custom suit made are now actually a thing but the fact remains that for the majority of small businesses today, it’s the people around you that’s the most important. Appealing to the local audience then, should be your goal and your website should always reflect this intent.

Think of this as the difference between running an ad in your local newspaper and starting a marketing campaign in YouTube. Yes, YouTube’s global reach means that you have the potential to reach a much wider audience but you’d also be jostling for attention against the millions of videos that are uploaded to YouTube every day. By contrast, a local newspaper would limit the competition to just a handful and while your audience will be considerably smaller, it doesn’t really matter as that’s the kind of audience you were trying to court in the first place.

Search engines as of now are automatically tailored to the location of the user. A user in Melbourne typing the word weather into Google would be presented with a different result compared to a user in Darwin for example. This rise of location-based technology, combined with the reasons mentioned above, is why making your website more appealing to a local audience should be a priority and here are some things you could do to achieve that.

Get to know your audience

Darwin’s tropical climate and their population of merely 150,000 would present a vastly different challenge than Melbourne’s four seasons and their 5 million citizens. Each region would have their own quirks, personalities and stereotypes. If you’re willing to go deeper into the various available demographics, you can start differentiating by gender, age, economic status and even political views. All of that is just a roundabout way of saying that when trying to attract a local audience, you have to be specific.

Get to know what’s currently trending in the city or which aspect of the city they actually like or any other information that might help you in courting them. You know the saying, when in Rome, do as the Romans do and to do that, you actually have to figure out what it is the Romans actually do in the first place.

Add a local flavor to your website

Before people get to see what’s written in your website, their eyes would usually gravitate around the images first so it might be a good idea for you to consider adding images that properly represents your city. A landmark such as Sydney’s Opera House might seem like a good option but that’s actually a very generic choice and is more representative of what outsiders think of when they hear the word Sydney. Instead, dive into the local scene and try to come up with an image that would imply an insider’s knowledge of a particular city.

One of the things that we’ve learned about the internet is that instead of acting as a place where different ideas and viewpoints are exchanged, it actually acts more like an echo chamber, where users seek out information that reinforces their existing views. In other words, familiarity is an appealing trait in the internet and by highlighting the fact that you and your audience share a similar place of origin and/or residence, you can use this sense of familiarity to your advantage.

Incorporate locally-relevant trends and/or topics around your content

Say your local sports team just won something or a local politician might be embroiled in a scandal, anytime anything interesting happened where you run your business, try to insert yourself into the conversation whenever appropriate. Include winking references to those events or if it’s possible, try to tie your business with those stories. If there’s nothing interesting going on around even talking about the weather might do, Lord knows how big of a deal the recent drought was in some parts of Australia.

Get together with other local businesses or sponsor local events

Technically, this advice doesn’t actually relate to your website but if you are collaborating with other local businesses or partaking in a local event, you can include that information in the homepage of your website as some sort of a badge of honor so I’m including this anyway. Now, this might seem small but by connecting your business to other local institutions, you are indirectly adding credibility to your website. They’re not as good as genuine reviews but I’m sure I’m not alone when I say that I have more faith in businesses that are connected to others compared to those that seemingly exist in a vacuum.

Rolling Out the Red Carpet: 4 Tips You Could Use to Make Your Homepage Better

Rolling Out the Red Carpet- 4 Tips You Could Use to Make Your Homepage Better

Late last year, there was this interesting tidbit on the story of Playground Games, the company behind the popular open-world racing video game series Forza Horizon, and 2016’s Forza Horizon 3. It was revealed during a talk at the Nordic Games Conference that Playground spent 18 months of the two-year development cycle continually going over and polishing the first 10 minutes of the game. 18 months of work for only 10 minutes of playtime isn’t exactly proportional, is it?

Forza Horizon 3 isn’t the only video game to do this, 2009’s Uncharted 2 also pulled off a similar trick. Instead of easing players into the game, Uncharted 2 tasks you immediately tasks you to guide Nathan Drake, the main character of the series, to escape from a derailed train over a cliff in the Himalayas, which chronologically happens later in the game, a storytelling technique referred to as in medias res, dropping players literally in the middle of things. This practice of starting your video game with a bang is actually something the world of web development could definitely take a page out of.

The perfect opening salvo

What Playground Games did with Forza Horizon 3 might seem a little bit excessive but it works. Horizon 3 was my first entry into the series but I had a passing familiarity with the series so I had an idea of what I was getting into but the opening of the game still blew me away. I distinctly remember oohing and aahing and practically giggling to myself as I drove past some of Australia’s landmarks (the Maroondah Dam, the Glass House Mountains and the Twelve Apostles to name a few), first in an exotic Lamborghini and then literally off the beaten path in a trophy truck.

The reason Playground did what they did isn’t just because of some random quirk, it’s because the cliche of people judging book by their covers is for the most part true. Roger Ailes, former CEO of the television arm of Fox, who was responsible for turning the Fox News channel into little more than a mouthpiece for the current American administration once famously stated that you have seven seconds to make a good first impression.

The seven seconds is far from being a scientific truth but I do think it’s true that there’s only a very limited window of time that you could nail this impression. If we transplant this idea into the internet, then the burden of giving out this first impression lands on the shoulder of the homepage. Just like how Playground spent three-quarters of their allotted time into perfecting the 10 minutes of their game, you should also prioritize the development of your homepage as long as it doesn’t interfere with the rest of your website and here are 4 tips you could use as a guideline.

Emphasize your value offering

Instead of putting you on the seat of a crappy little hatchback, Horizon 3 gave you a taste of the Lamborghini Centenario right at the start of the game and gave you a route that takes you to some of the greatest vistas the game has to offer before switching into a trophy truck to show you that if the route isn’t to your liking, you’re free to make one of your own. In the first 10 minutes, the game managed to successfully convey how much fun I’d be having in the version of Australia that they’ve cooked up in their game, which is no small feat.

By the same token, your homepage should make it clear just what it is that sets you apart from similar companies in the industry and what your customers would be getting if they side with you. The start-up culture has what is referred to as the elevator pitch where companies need to have an idea that can be conveyed meaningfully over an elevator ride. That should be what your homepage is like.

Be original with your words and images

Your homepage should also clearly states what is it that makes you ‘you’. In practical terms, this would mean ditching the generic stock photos for something that is truly your own. Earlier this year, the internet had a little bit of fun when Nicole Paulk, an American biophysics professor posted a stock photo of a scientist that makes absolutely no sense, which started the whole trend of #BadStockPhotosOfMyJob. Stock photos and/or phrases are a plague to be avoided when it comes to your homepage.

Make use of whitespace to keep your homepage from being cluttered

You might think that because of the short time you’re given with to nail your first impression, the solution is to cram everything noteworthy into your homepage to make sure they’re not missing anything. This is not a good idea as it’s not just your time that is limited, their attention is also limited, which is why you need to figure out what part of your business you’d like to emphasize and focus your homepage around that idea.

One way of achieving this is by using whitespace, which results in a less cluttered and considerably friendlier website. Additionally, try to figure out a way to convey both your originality and value offering in the least amount of words and elements possible. Anyone could convince people with a 100-page manifesto but to do the same thing in 140 characters or less? Now that’s what I call art.

Make sure your homepage is as gorgeous on a mobile screen as it is on the desktop

Once you’re happy with the homepage design you’ve come up with, the next step is to see how it’d look like in a diminutive phone screen. Mobile internet traffic is now bigger than desktop internet traffic and your priorities should adapt accordingly. Check if your homepage looks and works as it was meant to on your phone in addition to on your computer. The easy way to do this is by using a responsive design, where the webpage adapts itself to the size and orientation of the device it’s being displayed in without you having to manually adjust every element of the page.

Getting in Shape: Using Geometry in Web Design

web design tips

Raise your hands if you recognize any of these notations; 2d10, 20d6, 2d20, 3d6. If you do, then I salute you gamemaster, but if you don’t, here’s a crash course on the beautiful world of tabletop role-playing game. These notations, referred to as the AdX, refer to dice notations. A 2d10 for example would mean that the players are required to roll a 10-sided dice twice, most usually used to calculate damage.

The reason I brought this up is because when I was rummaging through my desk looking for my nail clipper, I’ve lost at least 3 nail clippers this year alone so this was a pretty big deal, I stumbled across a pair of 10-sided dice that I haven’t seen in years. My affection for 10-sided dice doesn’t just stem from the fact that I love RPGs in general but also because I love the shape of a decahedron. Obviously, a decahedron doesn’t translate well to web design, not until VR is widespread anyway, but other geometric shapes still has a place in web design.

Geometry in web design

To sum up, geometry is the visual study of shapes and patterns. Shapes and patterns occur in pretty much all walks of life, not the least in the field of design. Architecture, art and design are all mingled with geometry and even Mother Nature itself is filled with geometric shapes. A honeycomb for example is simply an array of beautiful hexagonal wax cells arranged in a cluster by honey bees as their nest.

The beauty of geometric shapes is that they can be used both aesthetically and functionally. They can be used simply to inject some visual pizzaz on your website or used as visual cues to guide reader’s attention on to certain elements. It’s this exact versatility that makes them so attractive to use in web design and other user interfaces in general. The thing that people need to keep in mind when it comes to geometry is that it’s not just about the shape itself.

Geometry also deals with how those shapes are related to each other and how those shapes relate to the space around and between them. If that description strikes you as familiar, it’s because that is what functional design mostly concerns itself with. The screen the webpage is being displayed on has limited space and deciding what to communicate and how to communicate them best is pretty much the question every web designer should ask themselves.

Geometric shapes in web design

Quite possibly the most simplest shape there is, dots or a circle when it’s bigger in scope, is the most common shape you’re probably going to see. Circles are most commonly seen as standalone icons, such as on your phone for example, due to their shapes, which is an indicator of fullness. Circles are also widely used when dealing with a gauge of some sorts or when you wanted to display some statistics using a chart, especially of the pie kind.

The second common shape we’re dealing with is rectangles. Rectangles as a shape are foundational because they are used as the basis for the grid layout that is widespread in a lot of websites. Check out the homepage of the tech blog The Verge for an example. Headline contents are arranged on a rectangular grid at the top with other most recent articles spread out on a list below them. This grid layout is also quite commonly seen on booking websites such as Airbnb and Booking.com.

The third shape we’re dealing with is a collection of shapes referred to as polygon, which is any 2-dimensional shape formed from a collection of straight lines. Yes, rectangles technically fall under this definition but we’re focusing on less common polygons such as triangles and hexagons. Because of their sharpness, triangles are commonly used as navigational cues, guiding viewer’s attention into an element on the webpage.

How geometry is used

If you’ve ever used an Android device in the past 3 years or so, you should be familiar with the words Material Design. For those unaware (read: an Apple devotee), Material Design is the design language Google has been using on their mobile interfaces since the release of Android 5.0, Lollipop in Android parlance. Geometric shapes, the grid-based layout and the use of shadows to create an illusion of depth are the hallmarks of Material Design, creating simple, consistent yet attractive user interface across all of their devices and services.

I’ve stated before that geometric shapes is notable for their versatility, which is why they’re perfect for Material Design. Whether stuck in on the upper-right corner of a desktop screen or sitting right there on your phone screen, geometric shapes are universally relatable and customizable to a degree than you can use them for any goal you could think of. Recently, Google has updated this design language with softer colors and gentle curves in place of hard angles but I won’t be surprised to see this style to be used for many years to come.

One other use of geometric shapes I’m particularly fond of is isometric projection. For those of you who grew up with video games back at the dawn of the 21st century, you should no doubt be aware of isometric video games. Back then, 3D graphics was still very rough so video game developers played around with 2D video games to give players the illusion of depth using isometric projection.

Think back to classic strategy games such as Command & Conquer: Red Alert 2 or the first game in the Age of Empires series. By displaying elements in such an angle, you can create illusory depth even though the images are still flat. For something contemporary, check out the game Monument Valley and its Escher-like aesthetic. The isometric viewpoint isn’t just a stylistic choice in that game; they also form the basis for optical illusions central to the game puzzles.

The simplicity and versatility of geometry

Good design is simple, yet understandable. In a way, designing using geometry is no different than the approach taken by companies like Muji and Uniqlo with their products, taking a simple, minimalist approach that is borderline industrial but still pleasing to the eyes. In good design, form and functions lives in harmony and using that standard, there is no way to describe geometric shapes as anything other than good design.