Use Better Fonts On Your Website
Written on May 24, 2012, by MLollar
For a long time, websites were limited to using fonts that were deemed “web-safe.” This term essentially refers to a handful of ubiquitous fonts – Arial, Georgia, Times New Roman (and a few others). Because designers knew that these fonts would be installed on 99% of computers, they could be sure that text would look consistent for most, if not all, users.
If a designer wanted to use a more unique font, it could be created as an image, or with flash. This got the job done, but wasn’t really scalable or dynamic (it required several steps, from opening Photoshop to FTP uploading), and it’s not search engine friendly.
In the past few years, a number of solutions have arisen to allow more effective use of a wider range of fonts. However, as someone who builds websites, I’d say it’s only been in the past year or so that I’ve felt confident in available tools’ ability to render unique fonts consistently across multiple browsers and devices (tablets and smartphones included).
My current favorite tool is called Google Web Fonts.
Google has collected a wide range of free-to-use, open source fonts. They store the fonts on their own web server and when a user visits your website, the fonts can be easily displayed on your website – without anyone having to download or upload anything, or worry about usage rights.
So why do we think it’s important to use unique fonts?
- It maintains brand equity. You can find a font similar to what you use in your logo, or something that compliments it well.
- It helps promote your uniquity. Is your company the same as 500,000 others? Didn’t think so. So why use the same fonts? A yoga studio might want something relaxing and clean, like Raleway, or a florist might want something flowery, like Allura.
- It lets your website stand out from the crowd. People are used to seeing Arial and Times New Roman – This is an opportunity to surprise them with something different.
However, as with any great power, it’s important to use restraint: We recommend restricting the use of fancy fonts to just titles and subtitles, and continuing to use the standard web-safe fonts for your general body text. This will help:
- Improve legibility. Nobody wants to read a paragraph of script text.
- Reduce the impact if something goes wrong. If, for some reason, your custom fonts can’t be loaded, only your titles will be affected. Given the smaller amount of text, this shouldn’t have a huge impact on the length or overall appearance of your pages.
Are you already using unique fonts on your website, or have we convinced you to check out the possibilities? Just, please, no Comic Sans.
What to do with negative feedback
Written on May 11, 2012, by Rachel Layser
So, you’re John Q. Business Owner. You have an awesome business and a really good website. You update your site regularly, you keep a blog and you try and implement the various forms of social media to keep your customers involved 
and happy. What could go wrong?
With each new customer you attract, there is an increased chance that something will go wrong and someone will be unhappy. And with the increased forms of interaction that exist, there is also a chance someone will post something negative about your company. This is inevitable. The most important thing is how you react to this negative feedback whether it appears on your site, on your Facebook, or on your Twitter. How you interact with your audience can be just as important as your product and it could be argued that responding to negative feedback may be more important that responding to positive feedback (though you should of course respond to both).
It can be tempting to defend your actions, or ignore the feedback altogether, but neither of these are going to earn you any points with current or future clients. The best course of action is to respond, respond quickly, and fix the problem without passing blame. The old adage of, “The customer is always right” continues to ring true.
It can be equally as tempting to delete a negative comment, but this is comparable to hanging up on a customer. If they posted it on your site, or your social media sites, someone has seen it, and deleting it will not make the problem go away. Some companies with the best customer service actually view negative feedback as an opportunity to impress their customers. The business models for companies such as Zappos, Amazon, and Ritz-Carlton, among others, are something to be considered. You should try and view each interaction with a client – positive or negative – as an opportunity to dazzle them.
There are very good articles out there that go into detail about how to deal with feedback. For more information on steps you should take when responding, check out 7 Rules for Responding to Customers Online or HOW TO: Deal With Negative Feedback in Social Media
What does $100 on Fiverr get you?
Written on April 23, 2012, by Chris Yoko
Recently there has been a lot of hype around Fiverr and several similar sites. As far as marketing goes there have been a lot of comments that hail it as a great cheap resource for businesses, and other comments which remind potential users that you get what you pay for. To find out what, if any, benefits are derived from some of the Fiverr, the team here picked out 20 gigs that are in some way related to marketing, and we’ll put ‘em to the test.
I’ve broken the list into 4 basic categories, along with our best guess as to the outcome of each category. As we see results, we’ll track them, and share with you the best and worst Fiverr has to offer.
- YouTube videos / testimonials.
- Twitter/Facebook blasts and paid posts.
- Twitter/Facebook followers/friends.
- Random stuff about your logo – drawing, painting, etc.
Are there any Fiverr gigs you want us to test out? Link us in the comments.
Is Your Website Secure?
Written on April 19, 2012, by MLollar
Recently, we encountered a situation on one of our development servers where a test site was hacked and infected with some malicious code. When this happens, the goal can be anything from turning an innocent website into a spam center, stealing user data, or something even worse.
Fortunately, the hack was only on a test site and isolated on a sub-domain and we caught it very quickly, without it spreading beyond just a handful of individual files. Because it was just a test website, security was minimal and we were able to repair it without much issue. However, it was was a strong reminder that any opportunity or vulnerability can be quickly exploited, especially online.
While having an extremely extensive security solution isn’t practical for many websites, due to the high cost and time requirements of implementation and maintenance, there are a number of things you can do to reduce your risk.
Here are a few of the best practices that we often use on our client’s websites:
Keep your CMS up-to-date.
By standardizing a framework, websites that are built on Content Management Systems typically enjoy a great functionality/cost ratio and large development communities. This standardization can also present a problem: If a vulnerability is found in the framework itself, many of the websites using that framework are also at risk. However, the most popular CMS platforms (WordPress, Drupal, etc.) are very good about releasing updates to fix security flaws. But remember, you can only get these benefits if you keep your platform up-to-date.
Of course, there are also situations where you may not want to update your CMS, especially if you’re using a private or heavily-customized install, so it’s best to speak with knowledgeable folks (like us!) before you click that “automatic update” button.
Don’t share passwords or admin access unless totally necessary.
We know, this should go without saying. But remember, the threat here isn’t always the individuals whom you’ve granted access to your website or server, but also the security of their computers and networks. Lapsed virus software and a saved password can equal disaster.
Back up your data.
We all hope nothing will go wrong. And often, it doesn’t. But by having a full backup of a recent working version of your website, you can rest assured that if worse comes to worse, you’re covered.
Of course, there are many additional security measures that can be taken to protect your website – we just wanted to get your brain on the topic, since it’s a much better idea to prevent than to repair.
Without revealing any sensitive information, what are your best security tips? Are you doing everything reasonable on your website to prevent fraudulent access?
Employment and social media
Written on April 12, 2012, by Rachel Layser
I’m pretty sure every single person I know is on Facebook. Until recently, the only person I knew who wasn’t on Facebook was my dad, but he finally caved a few months ago and joined… and now calls me twice a week to ask me questions like, “how do I put this picture on my page?” and “how come I can’t see Andie’s pictures?” (The answers to those are “hit upload” and “because my little sister is 16 and refuses to add her dad as a Facebook friend. No, dad, I can’t make her”)
Now that we’re all on Facebook and posting pictures of weddings and bar crawls alike, where do we draw the line with employment? Mashable recently posted an interesting infographic about the controversy surrounding new employment and social media. In 2011, some employers were asking for Facebook passwords as a prerequisite of employment in order to ensure they know the “real” person they are hiring. Some people refused, others allowed it, and the ACLU put a stop to the practice.
However, now we’re seeing a new issue arise: employers are asking for applicants to show them their personal Facebook pages, which said applicants were smart enough to make private in the first place. Times are changing, and the economy isn’t what it used to be. Rather that everyone refusing such an invasion of privacy, there are cases where potential employees have given up their privacy in exchange for a much needed job.
Of course, what most employers (and colleges, in some cases) don’t realize, as that by gaining access to such content, they are potentially liable for it’s content and any associated behavior. The ramifications of allowing employers into our person lives are huge.
So, what can we do? Well, it’s doubtful that such requests by employers will stand up in court, but the fact remains that everyone should still be using social media responsibly. I can’t tell you how many times I’ve seen friends and acquaintances posting negative things about their employer… or posting things that would make others blush. The bottom line is you should be mindful of what you’re posting, and perhaps follow the same guideline I try desperately to make my little sister understand: Once it’s on the internet, it’s forever. Don’t post anything you wouldn’t be comfortable with your employer, your mom, and your spouse seeing. There is such a thing as “oversharing.” And finally, try and use some common sense.
If you’d like a “preview” of what the future may look like if checking Facebook becomes a standard practice, check this out. It’s a fictional letter, but the implications are real.
Catering to Your Customers
Written on April 6, 2012, by Chris Yoko
We all have personal preferences
websites we prefer to visit, stores we shop at, cars we drive and so much more. All of these decisions reflect back on who we are, and who we present ourselves to be. The more personalized the approach and pitch, the more likely you’ll react positively to it. This is just as true for the web as it is for a face to face meeting.
The advantage of the web being you can interact with a significantly larger number of people than you could in person over the same period of time. And the technology has long existed for you cater how your website presents itself based on who is using it. While some organizations take advantage of this to some degree, it is rarely used to it’s full potential. I’d like to share a story with you about an organization that has tested their customer log in site to such a degree, that it looks entirely different depending on who is logging in. A system they refer to as The Chameleon Dashboard.
The organization is a financial consulting firm, and works with tens of thousands of wealthy individuals. These clients range from young musicians to middle age business executives, from retirees to lotto winners (like megamillion winners.) And, if you couldn’t guess, these different clients have very different goals, desires, and preferences. While their financial advisor may not always be available, they always have access to log into their account management dashboard through the firms website. Here is where it gets interesting.
Through years of testing, and generation after generation of design iterations, they’ve developed custom dashboards for their different users. Users are categorized by a number of categories and behavioral triggers as well as selected preferences. For the examples below, I’ll use age as the primary metric.
- Younger clients see a dashboard that is more similar to Facebook’s interface.
- Middle aged clients, who have shown a penchant for more advanced research see a dashboard that looks like the Wall Street Journal’s stocks page.
- Older clients (generally) who have a preference for reading text encounter a dashboard like Wikipedia.
- Users who prefer to browse graphics interact with a site that has some copy, but provides data in a format similar to a Flickr gallery or Pinterest.
Since the implementation of the chameleon dashboard not only have they increased their client retention statistics, it has dramatically reduced their customer service requests and the time spent on the phone with the financial advisors themselves. Users log in significantly more often, and spend more time using the dashboard itself. The end result is advisors are able to better leverage their time, and support a larger client base ultimately bringing in a significant amount of additional revenue without increasing overhead or HR expenses.
Does anyone else happen to know of other industries that are leveraging this technology?
Test Your Website for Cross Browser Compatibility
Written on March 28, 2012, by MLollar
Here at Yoko Co., we build websites for a wide variety of clients, whose target audiences use a wide variety of web browsers. Sure, in a perfect world, we’d all use the latest version of Chrome or Firefox (or Safari, or… IE10 – maybe?).
However, in many cases – particularly with larger organizations – security, IT and network restrictions force the use of older web browsers (often Internet Explorer 7 or 8). So, fact is, one way or another, everyone who looks at your website won’t necessarily be using the latest & greatest technology.
You need to know what your audience might be seeing when they hit your website. Maybe that important Call-To-Action button is getting messed up in IE. Maybe your contact forms are getting jumbled together in Firefox.
The point: You should test your website on different browsers.
Even if you’re not a web designer, this is worth doing. If you or your web team tested your site at launch, great – But remember, as you have modified it, or added new content, you may have also inadvertently broken something that was working. Or perhaps the new content you added wasn’t cross-browser compatible to begin with.
And if you don’t have multiple web browsers installed? There are a number of cross-browser testing tools available online, but here’s the one I keep coming back to:
- It’s free (you just have to sign up for a free adobe.com account)
- It’s fast
- There’s a wide browser selection.
So check your websites! Unless there are special circumstances, we typically shoot for full functionality on IE7 and up. I think it’s OK to lose a rounded corner here and there, or experience very minor aesthetic differences on older browsers, but the important thing is that it works like it should.
What about websites that want less traffic!?
Written on March 22, 2012, by Rachel Layser
Does this phenomena exist? Apparently, yes. Before you jump to any conclusions, let me back up. I’ve previously blogged about how Pinterest is taking off and why your business should join. I think it’s an important social media tool and one that allows an ample amount of customer interaction, with limited effort involved on either end. This relationship is easy to maintain and beneficial to both parties. Wins all around, right?
Well, there seem to be some companies jumping on the ‘anti-Pinterest’ movement because of lack of enforcement of Pinterest’s Terms of Use. Specifically, the lack of enforcement of crediting sources. Mashable recently published an article about this and points out that despite being aware of the problem, Pinterest doesn’t seem to be doing much to correct the problem, aside from reminding users nicely in their Terms of Use that before posting content you “…either are the sole and exclusive owner of all Member Content that you make available through the Site, Application and Services or you have all rights, licenses, consents and releases that are necessary…”
Ok, so what does this mean? Well, for anyone who’s on the site, you know that while a lot of things are credited, there are certainly those who aren’t. A simple Google search could (and has) shown me an original location, but this is clearly in violation of the Terms of Use and not fair to the owners of the material. Pinterest has, of course, gone a step in the right direction by allowing the “Pin It” button to be used on sites, allowing the user permission to post content so this ‘new kid on the block’ site is working out its kinks and continues to be a viable marketing tool.
And now we’re back… to those who want less traffic…
Pinterest has also responded to those protesting loudly about the lack of enforcement of uncredited sources and gone a step further…
If you hop on over to Pinterest’s support section you will find a code for blocking users from pinning images from your site. If someone tries to pin from you site, and you’ve enabled this code, the user will see: “This site doesn’t allow pinning to Pinterest. Please contact the owner with any questions. Thanks for visiting!”
I personally think this is going a step too far. Pinterest is moving in the right direction by actively removing uncredited pins and allowing companies to add a “permission” button to their site, so is blocking Pinterest really helping your business? There are hiccups in all areas of life – and there will always be people who take advantage of the system. Blocking users from pinning your content doesn’t help prevent anything, it discourages users from using your site and drives less traffic to your website.
Driving qualified traffic to your website is ultimately the goal. My advice to any company worrying about uncredited images would be to add a “Pin It” button to your site… and watch the traffic grow!
Marketing on the pot
Written on March 15, 2012, by Chris Yoko
- Pre-Smartphone Bathroom Media
A recent study by 11mark revealed that 75% of smartphone owners have used their phone in the bathroom, and over 90% of Gen-Ys use their smartphone in the bathroom. With the average American spending at least 15 minutes in the bathroom a day for facilities, and another 15 for hygiene, you have over 3 hours of time per week, or over a full week per year! It brings up an interesting point for businesses; is your content able to be viewed and make an impact in the time someone is on the can?
Of course the user may be on the metro or bus, sitting on a bench, or just surfing the web from the couch (maybe while their wife watches The Real Housewives of Someplace.) None the less, here is a simple checklist you can follow to help make sure your content is easily used by these viewers, whether they’re in the bathroom or just sitting on a bus that smells like one.
- Is your content easily discovered, through either search or social (including email?)
- Is your website easily viewed on a tablet or smartphone?
- Is your content engaging, grabbing the user and quickly making it’s point?
- Is your call to action easy to take from a smartphone?
- Do you provide the user with multiple options, to exercise what’s easiest for them?
- Is your follow up easy to receive and react to on the go?
What do you, as someone who views content on the go, appreciate while your surfing the web from your phone?
Is Your Website Ready for the New iPad’s Retina Display?
Written on March 8, 2012, by MLollar
So it’s official: Apple’s new iPad will have a “retina” display, doubling the device’s resolution. This implies that everything will look twice as sharp.
But will it?
Warning: We’re about to geek-out. Consider this: Previous iPad models and the new iPad have the same screen measurements (9.7″). However, the new one crams four times as many pixels into the same amount of space. This means that an image taking up a one inch by one inch square on the old iPad would measure at 132×132 pixels – but on the new iPad, a one-inch-square image would need to measure 264×264 pixels – or quadruple the amount of data. Stay with me here.
Before considering the web, let’s take a brief look back at a few things that happened when the iPhone 4 made the jump into retina display territory:
- New “HD” apps had to be designed, to take advantage of extra pixels. If an app designed for the iPhone 3 would run on an iPhone 4, it wouldn’t look quite as sharp.
- Within the User Interface, two sets of graphics had to be created – one set at a higher resolution (for the iPhone 4), and one at the original resolution (iPhone 3). This is illustrated by the graphic on the right.
- However, websites, which are generally designed primarily for viewing on a computer monitor, were unaffected. This is because the overall resolution on the iPhone 4, while super sharp on a small screen, was still less than the average computer monitor. So, graphics created for large-format display still contained enough pixel information to fulfill the iPhone’s small, yet dense, screen.
This changes with the new iPad. Its resolution of 2048×1536 was typically reserved for only the largest monitors – 27 inches and up. This means that an image that would take up 20% of a typical computer monitor might only take up 10% of the screen on a 27″ monitor. But, because the 27″ monitor was so much bigger, this wasn’t an issue – you’d just have more available room on the sides.
With the iPad’s comparatively small screen area, this becomes an issue. 10% of the screen on a 27″ monitor is still about a 3″ square. On an iPad retina display, this would be about a 1″ square. If you’re looking at something with a lot of detail, you can imagine this could be an issue.
Of course, this didn’t go unnoticed by the brilliant engineers at Apple. The new iPad knows to automatically enlarge graphics to a legible scale. Here’s where this gets weird: Certain types of graphics – text, or vectors – graphics that are created using mathematical calculations – can be enlarged infinitely and will still look just as sharp. If you want to test this out, look on your computer for a PDF with selectable text and open it up – then zoom in to 1000%. You’ll see it stays just as crisp. The other type of graphics, called bitmap (90% of website graphics are bitmaps, as are all photos), can’t be enlarged without losing quality. This is illustrated in the graphic on the left.
This brings us to the problem: A photograph on a website that is appropriately sized for your computer display will be enlarged automatically on the new iPad – maybe magnified at double resolution, depending on its size. And this will look fine – but not amazing.
See, by stretching an image out to double its size, the WOW factor of the iPad’s new retina display will be negated. To really maximize the new iPad’s graphics potential, you need to be able to display an image that actually IS double the size. Here’s the trouble:
- If you double the size of everything on your website, it’s going to look broken for normal computer users – there would be scroll-bars everywhere.
- Much larger images mean much larger file sizes – that’s longer load times for your users, and more burden on your web servers.
So what’s the solution?
You need to have two sets of graphics for your website – those at higher resolution for the new iPad (as well as some other tablets in the pipeline with similar display technology), and your “regular” images for everyone else. And, maybe a third set for smartphone users. When a visitor hits your website, their web browser/device should be detected, and the appropriately-sized graphics will be served to them.
I haven’t heard of any examples of people doing this in the real world yet – which isn’t to say there aren’t websites prepared for this – but once the new iPad hits shelves, this is bound to becomes a new design trend. And, in time, a new design standard.
So, have you given any thought to optimizing your website for the new iPad display?
