• Home
  • Blog
  • About Me
  • Contact
Table Of Content

Mobile Version Update

27 September 2019

Over the last week, I've been doing light testing on my blog usability, and sure enough, after one day, I feel like there's a lot that I can improve. To cut to the chase, for the last week I'm changing the header layouts since the old one waste too much space. chibi

I run out of pics, this will serve as a cute placeholder

Old Layout

old header

There are few considerations why I feel like it must be done. Sure the old one has big and clear title, uncluttered menu (or so I hope) but there is a big downfall here: it wastes too much space. In the end, I decided to rebuild the header with the following consideration:

  1. The logo is not-so-important. It is important to have, but making it very big is not a priority. Just having one is enough without making it too big.
  2. Since the page transition is quite seamless, I tend to forget that it is a website, not an app. I got into a habit to look for the back button (which did not exist). Due to this, I want to put the back button somewhere on the top.
  3. The hamburger menu is not relevant to the current position. The hamburger menu usually placed on the top left or right of the pages, but since it will only appear on the blog page and post page, it feels wrong on so many levels.

New Layout

In the end, This is the new layout I came up with: new header

This new header has a few advantages compared to the old one (at least for me)

  1. The header takes fewer spaces and can achieve more function (in particular, back button) and make it looks a little bit cooler to boot.
  2. The back button is provided for devices that did not have an obvious back button (such as gesture-based android navigation, which I used right now)
  3. It is clearer which categories you are now. The hamburger menu was ditched since it was not a 'true' menu to begin with.

Other Stuffs

Meanwhile, Google gave me a report on some usability issues that came from the mobile version of my site. It involves a usability issue such as text too small to see, clickable elements too close together, etc. This update also pushed the update for the mentioned problem above. chrome inspect A lot of it was things that I was unaware of, and I found a lot of this problem has something to do with the old imported post which sadly breaks a lot of things. Since it was fixed, I would need to wait until their crawler finishes inspecting my site again and see whether my site still has a problem or not.

That's all for now. I don't think I will update my site's layout again for quite a while (except for changing the comment section, which will be done on this weekend). As of now, I want to waste my time to learn blender 2.8 to make a 3D version of Hourai (again), that, or finishing my backlog of FAG/Megami Device fag

In my defense, once the item sold out there's no guarantee I can get it later.


~Hourai Etealune~