Search This Blog

Changes to the navigation menu

Well, my navigation menu you see on the top of the right widget bar is starting to get messier and uglier that I have decided to do a brand new one from scratch. Actually, it got ugly and bulkier from the last update. Not only in appearance, but also the code involved. They are originally supposed to all look the same, with only the title and type of blog changed.

(extracted from an earlier post)The navigation menu featured here is what it looked like when I first made it. Clean and simple. That empty space there was intentional, but I added random quotes or "Haruka Takahashi's Network". For ones that had the former, it was latter replaced with my latest post from Twitter. Also, hovering over a link there would have a background, but as I found out later on, this also affected other links on the blog. That problem wasn't really fixed until just last month.

(From Updates and Anime blog (English version) blogs.)Shortly after doing v0030a, I replaced the image and have it aligned to the left. I have also made the links larger and if you hover the row where a particular link is, an image would appear. These are 60*60 images that are (at that time) also used for displaying my drawings on my non-main blogs, which itself, has now changed to 80*80 versions. In the case of the links to the Main and Technology blogs, new ones were used. If the blog does not already have a search box, I would add it as part of the menu.

(Japanese & English versions of my main blogs. Search box is not part of the navigation menu.)The pink/red colours were originally part of an experiment to try different colours of the navigation menu, but didn't really work out well, especially with the strong red for the title. Since both blogs uses mostly pink/red and matches more than the blue version, I have left it untouched.

Also, I found the images to be quite small and decided to have it occupy the entire row. At first, it was to have the image to gradually fade from transparent to opaque from left to right and have it aligned on the far right, but it looked horrible and editing the images to get it was too troublesome. So I gave up and have it to occupy it completely. Since the blog layout that has this menu the widest is the drawings blog (back then) at 280px, I used that as reference for the maximum width.

(Technology, Drawings, and Anime (Japanese) blogs)Not too long ago, Yukari changed her navigation menu and me changing my Twitter page (on the same day as I found images of both the avatar and background). Though simple, it actually looked nice. So in order to improve mine, I have to dump all the image codes except the avatar. The avatar is the exact same image used at Twitter, so the area for my avatar has been reduced from 80*80 to 73*73. Originally, they are supposed to have just a white background, but I use the same background as the blog background or any other image that are already used on the blog. This not only makes it looks nicer, but also save bandwidth from loading the images. Since having an image to appear when hovering over a link is removed, even more bandwidth is saved. That black semi-transparent background is actually recycled from the old drawings blog and helps reading against the textured image easier.

Except for the Anime blog in English, I'm not sure if I want to apply the new version to blogs that are still using the older version for legacy reasons or would actually match the blog layout the most. Currently, the diagonal length of the menu on the Japanese main blog is 5 inches, but the drawings blog is 3 inches. That is quite a lot. I might also replace the avatar of the new navigation menu with an identical-looking v0080 when I'm done with it.

4 June: v0080 is done and replaced all the images in the navigation menu that previously used the cropped source image (new version) or v0030a, (old version), and aligned it on the right just as when v0003 was used when the previous version was newly created. Also, the "Yukari-chan" (or "ゆかりちゃん") links are somewhat redundant and are removed.

Comments

Popular posts from this blog

The Autumn 2008 anime season has ended with the Winter 2009 around the corner. Some are 22-26 series that would continue into the Winter 2009 season (hence, fewer new anime) but I would still count them as Autumn 2008.

In no particular order, I would group these anime according to my likeness. (OVAs and live versions are not counted)

Didn't watch at all or dropped at the first few episodes:Penguin Musume Heart 2nd Club: It's a second season of something I didn't watch.Battle Spirit & Mach Girl: Just looking at the pictures alone tells me not to watchBonen no Xamdou & Hakushaku to Yousei: Doesn't seem to be my type to watch.Noramimi 2nd season: Looks like a kid's show and I never watched the first season.Rosario and Vampire Capu2: Had dropped in season 1 as there is no real storyline and the colours used were awful. It had a colourful opening though.Casshern Sins: remake of a 1970s anime. Good storyline, but the picture see…

For a list of the names of the Autumn anime and links to their official website (excluding OVAs), you can refer to here for the English names, or here for the original Japanese names. Some of the anime that are due next year (2009) on top of the Autumn 2008 ones can be found in the "アニメ新番組" or "New Anime" section.

There are no anime carried over from the previous seasons for Autumn 2008, but there are returning anime like "Rosario and Vampire", "Clannad" "ef - a tale of ----." "Nodame Cantabile", "Shougo Chara!" "Jigoku Shoujo", "Vampire Knight", "Mobile Suit Gundam 00" and "Junjo Romantica".

On some of my blogs, I have changed the images with this new style. I wanted to do this earlier, but didn't know how. Turns out that I could use an image-editing software that has been installed on the computer, but rarely used, to do this (GIMP). All the time, I was trying to see if the program I had always been using (Inkscape) has this feature. I still need the latter program for sizing and cropping to the exact dimensions though.

For example, if you were to hover over "Anime", the new version should display as the background. For the older version, it would be or, if I didn't modify as a result of the recent resizing of square thumbnails, . Notice the gradual transparency. As there are some problems with the colour scheme with these new images, I might need to do some adjusting or even replace with new ones. I might also have to remove the borders and that background colour when hovering over text links anywhere on that p…