Mystery meat & hidden salad

Mystery meat – A term given for an option that you don’t know what it’ll do until you choose/select/click it. The metaphor as I underswtand it: You’re choosing tinned meat, but don’t know what’s inside until you buy it and open it.

I especially hate this used in navigation, where in recent years it’s become common practice to replace words with icons, to easily translate the interface into different languages, and fit more onto the screen for mobile.

Hidden salad – I went to a resetaurant recently and asked for a side salad with my burger instead of fries. The burger wasn’t supposed to come with a salad, so I expected to pay extra. As it turns out, the salad WAS a legitimate option, but a hidden one.

“Hidden salad” is what I call options that are valid but completely hidden from the user. Similar to mystery meat but instead of being presented with a cryptic option, you’re not given any option at all until you discover it. This is used especially in interfaces where you have to type, like command-line tools (which I especially hate). Or a more fun use might be Google’s hidden easter eggs.

WordPress have ditched the title tag in links

WordPress have previously always asked for title text when adding a link, but from version 4.2 they’ve abandoned this.

LinkmodalChange…Which is quite a good thing imo.

I wrote an article about how bad the title tag is for accessibility, because some web developers assume this is read aloud by screenreaders, bit it isn’t. I wrote an article about this here: I thought title tag improved accessibility, I was wrong.

I learned this after pretending to be blind for a week, and learning how to use a screenreader. I learned loads, and recommend every web developer to do the same!

Image above is from this article which is where I was first alerted about WordPress’ change.

 

All media queries in one place? That’ll be confusing surely?

image

I downloaded HTML5 Boilerplate today to use on a new project. In the CSS it has a section titled “Media queries”, I assume encouraging developers to put all their media queries here.

All media queries in one place?! I think it makes sense to put the media queries as close as possible to the rest of the styles. I don’t want to go hunting somewhere else for a media query about the navbar, keep it next to the styles for the navbar, surely? That way you’re keeping all relevant styles close together.

Don’t do “skip to content” links wrong

In the last few months I’ve been doing a lot of research on how blind users use webpages using screenreaders, including spending a lot of time blindfolded and using these for myself. I discovered a few things, and found that a lot of what I thought was true, were actually myths. Continue reading Don’t do “skip to content” links wrong

That time I uploaded a fictional criminal to a client’s website

warning stock photographyI’m a frontend web developer. My job is to turn a web designer’s creative layouts and mockups into working HTML & CSS webpages to the best of my ability.

This is the story of how I ended up uploading a fictional criminal to the homepage of a client website without even knowing! Continue reading That time I uploaded a fictional criminal to a client’s website

Why splash pages suck

barrier

Splash pages are quite old hat these days, but occasionally you will see a site that uses them. Sometimes there are legitimate reasons for using them but these occasions are rare, and the splash pages are just an unnecessary obstacle that stops your users from getting to the content in your website.

Splash pages can be more than just slightly irritating, they can turn users away before they even get to the content of your website, and they can have severe negative impacts on your site’s SEO.

The worst types of splash pages

  • Flash animations or video – There used to be a trend that websites would force users to watch an animation before they were allowed to see the full website. This can irritate users as they have to watch the animation before getting in to the site they want to see.
    Also an animation might start to play without any user input, not great if embarrassing sounds start to come out of your speakers. And it’s even worse for the user if they can’t skip this – see below.
  • Where the user can’t skip – Sometimes a flash page will have a long animation or video, and won’t have any ability to go straight to the rest of the site until the video or animation has finished. This forces the user to sit and wait before they can get to the content they’re really interested in. Also not providing a link to the rest of the site is incredibly bad for SEO, which we’ll explain about below.
  • Where the link to get into the site is not obvious – Your visitor wants to move onto the next page, but the link they have to press isn’t obvious. If this takes too long to find they’ll give up before ever reaching your site.

It’s not user friendly

On your website it’s very easy for your visitors to leave. If they’re not having a good experience using your website, they might just give up and go away. When you create websites you have to think about your audiences and how they will navigate your site. If a splash page prevents them from getting to the content they want, they’ll get annoyed and so will be less likely to buy your products or services.

If your splash page uses technology like Flash or Javascript, remember that not all users will have these enabled on their computers, and so might not see your splash page at all.

No content on your homepage

The classic splash screen will be an image, logo, or animation and won’t contain much text. This doesn’t give your users much to read, so they might well be left in the dark about what your site represents. You might think that your 2 minute animation or video clearly explains your website and your services, but you can’t be sure your users are going to stick around to watch it all.

Users on slow connections have to wait longer

If your splash page has an animation or video, chances are that your user might have a slow internet connection and have to wait for this to load. This increases the time your potential customer spends waiting before they can get into your website.

Splash pages are bad for SEO

Splash pages can have a negative impact on your websites SEO for many reasons.

  • No text on the homepage – If your splash page is just an image, video or flash animation with no text on the page, this reduce your chance of ranking well in search results.
  • Difficult for search engines to index the website – A splash page makes it more difficult for search engines to index beyond the splash page. This is especially true if the link to the homepage is kept within the flash or within the Javascript, which means that search engines won’t even be able to discover the other pages of your site. You can counteract this problem these days by providing an XML sitemap which will give Google knowledge of all your pages, but ideally you want to make it as easy as possible for your site to be indexed. Also if Google can’t index your site, neither can website analysing tools like Nibbler.

Bounce rate is high

Studies of splash pages show that the bounce rate (the percentage of visitors leaving after seeing the page) is higher than on pages with standard content.

Think about what your customer wants

Imagine your customers, and try to think about what they want to get out of your website. They might be looking for information about your company or product, or they might be an existing customer who wants to find your address or phone number. With a splash page you’re effectively putting an obstacle in the way of them getting to the information they want.

Content from the splash page could just go on the homepage

There’s really no reason to show a splash page and a homepage, there should ideally be just one page. The advantage of this is that the homepage has links to all other sections, rather than just one which says “click to enter”.

Instead of having a splash page, put the important messages on the homepage. At least then if the user is only interested in a certain page on your website, they’re only one click away rather than two.

There are exceptions for splash pages

Every website is different and you might have a valid case for using a splash page. These reasons might be:

  • To display a specific message to the users, which could include an important update to the website, or some information that is crucial to show before they visit your site.
  • To display an important disclaimer about the website, for example it contains adult content or something that you don’t want certain people to see.
  • Users are required to set their language or location. Although there are better ways to do this automatically, without the user needing to take any action.
  • Additional advertising. Drawing attention to a new product.

There are some legitimate reasons for using splash pages, but it’s not recommended. If you’re absolutely certain you want to include a splash page, make sure you use some website analytics to track how many visitors are not through to your homepage.

If you really want to use a splash page, follow these tips:

  • Add a clear link to skip the page.
  • Make sure the link is in the HTML and not in Flash or javascript.
  • Check your website analytics to see is any users are being turned away by your homepage.
  • Make sure you have at least some content on your splash page, rich in keywords for search engines.