by

When I think of Japan I tend to think of beautiful design. Zen gardens, temples, shrines, tea ceremonies, manga, anime, wabi-sabi… the list goes on and on. Yet for some reason Japan just can’t put any of this together to make a decent looking website. Where did they go wrong? What in the world happened? Time to find out.

Japanese Websites

Let’s start out by looking at some bigger Japanese websites. These are just a few examples that will give you an idea about the “Japanese aesthetic” when it comes to web design.

Rakuten

Rakuten is a lot like the Amazon of Japan (with a bit of Ebay thrown in). Japanese websites love text, and this is no exception. While there’s a few images here, the more you scroll down, the more text you end up seeing. You’d think that a shopping site would want to have more images to entice you, but the Japanese web aesthetic of textiness is strong with this one.

NicoNicoDouga

NicoNicoDouga is like the YouTube of Japan if YouTube wasn’t already the YouTube of Japan. It’s particularly known for the ability to add comments right onto the video screen. Once again, we see a ton of text. We’ll delve into why this is in a little bit, but it must be important if you cover your video website with text instead of video, right?

Gigazine

Gigazine is a popular tech blog in Japan. It’s full of strange color choices, missing padding, and advertisements. Though this site is fairly image heavy for a Japanese website, just keep in mind that it’s catered towards the more tech-savvy, which is obviously why this is such a beautiful website. Speaking of which, how many ads can you spot?

Japanese Website Aesthetic

So what is the “Japanese Website Aesthetic?” There are quite a few patterns that show up again and again in Japanese web design, I think.

  • A lot of text, really packed in there
  • Smallish sized images
  • Columns, usually three of them.
  • Poor use of white space / padding
  • (often) blue URL coloring
  • CHAOS

What does this sounds like… does it sound like American web design in the 90s / Yahoo’s current design to you? It certainly feels that way to me. How did this come to be? Why is Japan, the world’s leader in robotics, hybrid cars, and Gundam models, so far behind when it comes to the web? Where did they go wrong?

Mobile Phones

Mobile phones have ruled in Japan for quite a while, though personal computers are definitely catching up. Back when Americans were getting heavy laptops and Gateway computers, the Japanese were texting up a storm on their futuristic cell phones. Because of this alternate tech history, a lot of Japanese websites were designed for flip phones and eventually this became part of the aesthetic. To make a website work well on phones like this, you need to do a few things:

  • Skinny columns (that just go on top of each other on a mobile device)
  • Textiness… lots and lots of textiness.
  • Smaller images (they load faster!)

If you look at the example websites above, you’ll see that they have all of these things. While a lot of bigger companies have the resources to create completely separate designs for mobile and computer, smaller companies can’t do this. What’s the solution? They just end up making a website that (sort of) works in both. That explains why so many websites kind of look like they’re supposed be viewed on your phone… because they should viewed on your phone!

Slow Personal Computer Adoption

Nowadays individual computer use is really picking up in Japan. Ten or fifteen years ago, not so much. As I mentioned before, it was cell phones that won this war of Internet dominance. Now though, more and more people are starting to use personal computers. Although the current aesthetic has been built up around mobile phone use, I expect to see a shift as more and more people hop on computers. I don’t think Japan will catch up right away (it’s kind of like how developing nations are supposed to go through their industrial revolution, or something), though I do hope it moves pretty fast. I do not enjoy navigating you, Japanese web. You hurt my eyes.

Internet Explorer 6

When it comes to Internet Explorer 6 usage, Japan actually rolls in at third for the entire world. Only China (23.8%) and Korea (6.3%) out-muscle Japan (6.1%) in this out-of-date-browser-war. When you have this many people using such a terrible browser, you have to design with it in mind. IE6 limits what you can do design-wise, which means you have to make a choice: Do I make my website look not as good as it could be? Or, do I ignore this 6.1% of people and design how I want?

This isn’t even when you take into account IE7, which is better, but still not all that great to work with. Until people upgrade to better and more modern browsers, better design will remain more difficult. Not impossible, but this certainly doesn’t make things any easier. How do you get around this? Flashhhhh.

Flash

Remember when America was all into Flash? I feel like Japan’s been going through that lately, which seems right on target because they’ve always been about 10 years behind in the game that is web design. If you design in Flash, you don’t have to worry so much about IE6. That being said, the most popular phone in Japan (iPhone) doesn’t work with Flash. Right now Japanese web design is a little too buddy-buddy with flash in my opinion. It makes for poor user experience, generally, which goes right along with all the other problems that Japanese web design has. Hopefully we’ll see them kick this “fad” to the side of the road here pretty soon, especially with touchscreen mobile getting so important.

It’s Not All Bad, Though

All that being said, there’s a lot of great web design coming from Japan as well. To round out this article, I thought I’d share some examples of beautiful web design. Click on the images to see the actual site in action.

Uniqlo

Ishiyama Senkoh

toyota art

Toyota Municipal Museum Of Art

Hanamichiya

Swiss

Taromagazine

Takeo Paper Show

While a lot of these websites are a lot better looking (in my opinion) than the examples shown at the top of this article, though some of them are done in Flash (ick). I suppose if you’re looking to design with IE6 in mind, Flash is a good way to get around that?

Whatever happens, though, I’m really looking forward to the evolution of Japanese web design. With everything except web design, Japan has such an interesting aesthetic. If it could be applied to Japanese web design, well, I think we’ll end up seeing some really innovative stuff.

So, here’s to hoping they don’t actually follow in our footsteps. If they can avoid the phase where everything’s a ridiculous gradient… well… I’ll be happy. Wabi-sabi it up, please.

  • Hatakikomi

    I disagree. Having built sites for a Japanese company for several years they wouldn’t hear of not supporting IE6 regardless of the limitations it forced upon us. To a customer centric company, as many Japanese companies are, 6% seems like a huge portion of potential users to willingly ignore. 

  • http://www.facebook.com/people/Cody-Dalton/27704471 Cody Dalton

    Is it bad I saw this articles title and immediately thought to myself:  Rakuten MUST be included in this list.

    It’s awful because it’s generally a fantastic way to get things on the cheap, but my god that website makes me want to gouge my eyes out.  Navigating it is impossible.  You may as well just do it blind…

  • http://mistersanity.blogspot.com Jonadab

    > To make a website work well on phones
    > like this, you need to do a few things:

    Perhaps, then, we are on the brink of a substantial change in this regard.  All the major web browsers have now added support for CSS rules that can be selectively applied based on the resolution of the available area for rendering the page, so you can, for example, tell the browser not display the large images if the page area is less than 900 pixels wide.  I recently implemented some of this for my employer, because the mobile-device usage on our site (www.galionlibrary.org) passed 5% for the first time last quarter, and we felt that it was time to start designing with mobile devices in mind.

  • http://www.vietamins.com Viet

    Yeah.. Our kanji site, WaniKani, is built around responsive design. It’s pretty awesome except a few flaws with the concept. One inherit flaw of it is all the unnecessary data that needs to be downloaded and loaded for mobiles users. Why should the mobile user download a high res image (extra data), and take away processing time to be downscaled? And if your site relies on javascript libraries, you have to make sure it works on the mobile side also ;|

  • Gabriel Alejandro Zorrilla
  • Davegallant

    When I first met my Japanese girlfriend, a year ago, she was using IE (ughhhh)… I quickly removed all shortcuts to it and installed Chrome. :-)

  • Carlos

    This is just great. I needed this explanation really bad.

    Keep up the good work!

    Carlos
    Argentina

  • http://twitter.com/arniebal Anand Balsekar

    Interesting and well written. IMHO ignore IE6 even if you lose short term market share. And Flash. HTML5.

  • http://e-accidentlawyers.com accidentlawyers

    Great blog. So many blogs like this cover subjects that can’t be found in magazines and newspapers. I don’t know how we got by 12 years ago with just print media.

  • Danania

    http://designnlogo.com – really great design

  • http://www.facebook.com/ausgeschlachtet Рибэка Хынсон

    but, i PREFER that style of web design. now, here, we have endless scrolling pages that are ridiculously heavy on images that we can’t force to be split into pages [ex: tumblr, deviantart], or comments sections that endlessly let you load more comments [ex: cracked]. we have entire pages done in javascript, and if one element of the design fucks up, the WHOLE PAGE is fucked [pretty much, like, 70% of english websites]. we have sites completely and utterly incapable of supporting COMMON browsers ["Please switch your browser to one of our approved browsers!" i've been booted from firefox because the site only handled ie and chrome, blegh. ex: most job apps]. we have sites that are so fucking image heavy, that finding text explaining wtf is going on is nigh impossible [ex: apple and apple imitators]. there’s many more design flaws.

    we have a lot of design choices that, quite honestly, do not make things easier, or better, especially for people who do not have an updated comp. my computer can’t handle endless scrolling comments and/or images, and i’m not the only one who can’t. and honestly, i hate the way western media in general has shifted to match up to apple’s minimalist bullshit. advertising now is almost literally ‘let’s tell you as little about the product as possible, while having a bunch of sensational words tagged on it, and a shitload of images in place of text!’ and it’s about as helpful as using a spoon to cut a steak. tumblr as a site is the most gaudy site i’ve used [you click a video, it doesn't instastart, it pops up in your fucking face, then you have to close that window to get to the original screen size, then it loads, blah blah blah.] maybe it’s my computer [that can run photoshop cs5 just fine], but i’m pretty sure it has more to do with how shit the web design is.

    and yes, i do like the ads from the 1950s more than today. and no, i’m not that old, i’m pretty young, haven’t even hit 20.

  • bsd_bsd

    What is that song on the Toyota Municipal Museum of Art site? It’s beautiful.

  • Rusubandenwa

    Visual-kei bands have so much 1998 realness going on with their websites. My favorite is that they still use splash pages to tell the user to differentiate between mobile and personal computer AND that the content on both versions of the site are completely different. Typically, the personal computer route is always unfinished and about 6 months out of date.

  • Dave

    Does anyone know the name of the font that the Japanese use when they write in English/Roman? The top photo that says “What place” and “Information gallery”. I’m looking for that old school crooked font look.