Personally, I am not too fond of your layout style, which I feel guilty for saying so. There is no implications that your layout suck; On the contrary, it looks pretty and I really like the chosen scenary, but I was never a big fan of using nature scenaries for layouts. The only downfall is the colorization. The photo creates a sense of calmness, but the black throws in an air of darkness, which is rather contradictory.
Site: Hirokache
Type: Personal
Owner: Hiro
Reviewed By: Misao
Date Received: 06/14/06
Date Completed: 11/09/06
Preview
Now that I feel guilty for not liking the layout as much (don’t be angry at me Hiro), I do wish to say that from an objective standpoint, the layout is really nice. The quality of the digital image is unquestionable and so is the creativity. Two thumbs up for that.
Had the black colour scheme been replaced with… say a shade of blue found in the photo, the feeling of calmness and serenity would be widely portrayed. The white border again provides maybe too much of a contrast with the black - mainly for the reason the width of the border is quite wide. The white would collaborate well with blue or a reduction in the border width would appeal better with the current colour scheme. I like how the glow in the title is only apparant in the bottom half of the letters. The caption underneath the title sounds awkward. It is missing an ‘in’ before the word winter.
The HTML needs a bit of work. If you’re going to use external style sheets, at least make sure that you make good use of it. For example, the following code:
<BODY bgcolor=”#000000″ bg-repeat=”y-repeat” background=”bg.jpg”>
<IMG src=”1.jpg” mce_src=”1.jpg” style=”position: absolute; left: 0; top: 0″>
<DIV style=”border:0; position: absolute; left: 46; top: 450; width:135;”>
can be replaced with the following:
<body>
<img src=”1.jpg” mce_src=”1.jpg” width=”##” height=”##” alt=”" border=”0″>
<div id=”nav”>
Of course you’ll need to specify the statements in the style sheet similar to this:
body {
background: #000000 URL(bg.jpg) y-repeat;
margin: 0;
padding: 0;
}
div { position: absolute; left: 46px; top: 450px; width: 135px; }
Although the pixel measurement is not necessarily required in the HTML for proper encoding, it is good practice to include it. The link reference to the style sheet appears in the HTML twice; one in the head and once in the body. This link reference is only to appear once in the head. Make sure to enclose your tags in quotations (eg. p class="head"). Again it isn’t necessary, but it is good practice with keeping consistency in the style of coding. As it stands, some tags use quotations while others don’t, and some use lowercase letters while others use uppercase letters. Personally, this creates confusion for me.
If you ever decide to validate the site’s HTML, there will be three required properties: width, height, alt. If Mozilla Firefox is the primary browser, an extra title property is required. Correct me if I am wrong but BR clear="left" isn’t a valid tag because there is only one kind of tag for line breaks, which is <br>. I am not too sure of what you were trying to get at.
In the style sheet, there is a table header statement. I haven’t browsed through the rest of the site yet to determine whether table headers are used, but if not used, there is no reason for this to be included in the style sheet. All declarations for the body can be combined into one statement, rather than separated to two locations. The northwest cursor on link hover is not working because it isn’t complete. It should be ‘nw-resize’. If certain properties are by default set at zero (or none), there is no need to declare them. Properties of the same selector can be condensed into one declaration. So the head selector can be reduced to:
.head {
font: 11px verdana;
color: #FFFFFF;
width: 100%;
text-align: right;
border-bottom: 1px solid #FFFFFF;
head-align: center;
}
One more question in regards to the head statment. Are you trying to center-align the divider layer or are you trying to center-align the text within the divider layer? The head-align: center is doing neither. A really extensive and thorough Complete CSS Guide can be found at WESTCIV.
There is no site introduction? There a small welcome blurb but nothing to indicate what the site is about. It would certainly be helpful for people who randomly stumble on your site to catch a small glimpse of what it has to offer before going any further. In this sense, the welcome message could have something similar to “Welcome to Version 7 of Hirokache.com, Hiro’s personal domain complete with graphic designs and web resources.” In order to incorporate the counter into the page (to make it look less awkward floating next to an avatar up top), include it at the end of your intro like “You are visitor #— since January 5, 2005.”
If the solitude avatar is meant to go with the layout as an update avatar, it should appear next to the updates, and not by itself at the top. Currently, it looks out of place without a purpose. The banner link to Kirukki de Oshieru… should be placed either after your introduction or at the bottom of the page (I couldn’t read the other kanji and Editpad refuses to allow me to type Japanese). The reason being that it has no direct relationship with the site and serves as advertisement. Your primary focus is the site.
For a visual presentation of the things mentioned above, click here.
There are way too many updates on the main page. There are 14 updates in total, dating back to July 10th. That’s nearly four months ago. Although the updates are fairly short, it is overcrowding the page. The fact that you update quite regularly with little content one at a time, the most updates I would log on the page would be six max. I like how you link the pages in your updates though for easier access. It is a smart idea.
A final note on the copyright disclaimer before moving to the rest of the site, there are two small mistakes. The first error is a missing word that was overlooked. The second is a suggestion for specific clarifications (IE. who the permission is granted by).
Hirokache.com, its contents, graphics, layouts, etc. is copyrighted to Hiroko Nishimura; 2005~2006. Nothing may be reproduced without permission expressed within the site or with specific permission granted to an individual by Hiroko Nishimura.
About - The name of the site came about in an interesting way, but you fail to mention what hirokache means. When your “classmate commented that [you] give him a hirokache”, what did s/he mean by that? The italicized word in the in-sentence quotation illustrates a typo in the original content. A suggestion for the domain subcategory, perhaps a list of the number of sites (yours, friends, and hostees) currently hosted on the domain could be provided. Just so the section is more than a sentence long. I really like the Paypal donate button. It is very cute, but because the blue background is extremely light, I can barely make out the words in white.
Layout - I like how a larger preview image of the layout is provided. Most people only provide a small screenshot. I really like the previous layout, Butterfly. More of my style. The organization of this page is a little funny. Most commonly, the most recent layout is displayed at the top of the page. This page is the opposite. Not that there is anything wrong with that, but if this page gets bigger (at six layouts and more), it would make more sense to have the layouts listed with the most recent up at top and older ones further down. It places importance and emphasis on the current layout. I like how version 5 is explained, but it is different from the others in that it is written in third person.
Awards - Wow! You’ve certainly participated in your fair share of contests. Hirokache also have received her own share of awards for the site. It must be a hassle to update this page for broken links. To cut your work short, here is a list of broken links (including those who have moved): Anime Circuity, Alyse’s Awards, Stardust, Jaded-Hopes.NET, 4 Eva Wishes, GreyObsessions.NET, Ruby Fire Design, Aerial Designs, Kokoro’s Dream, FFD, Melodie Designs, HTD, Fairy Dust, Sakura Drops, Ambrosial Designs, Forgotten Illusion, Frozen-Hope, Crescent Dreams, Graphic Inuyasha, Illumine Graphic, Quiet Nights, Clyne Faction, Anime Palace, Black Rose, Lost Reality, Wishful Awards, Simply Divine, Ethereal Vision, Project-Infinity.net, Flammepersona, Seiya, Crystalwings Studio, Anime Kidd, Anime Paradise, Espo, TD Designs, Hexed.Pixelled.com, Clarisse, and Angelic Reflections. The awards are listed in random order (the dates of awards received are not chronological) and some lines have a period at the end while some don’t. All award images are properly linked.
Credits - This page is self-explanatory, although the Creative Commons License disclaimer is not as clear. “This work” does not refer to a specific object; the various writing and photography offered on the site or the site itself? The use of front slashes to separate words mean one or the other. In the case of copyright clarify, I would word the sentence to mean one or the other or all of them. “This site and all work found on the site are licensed under a Creative Commons Attribution-ShareAlike 2.5 License. Problems with stolen graphics, codings, and/or content from this site will be dealt with according to the Creative Commons DMCA Notice & Takedown Procedure.” The CC License banner should be moved after the written disclaimer.
The credits list is fairly comprehensive. I like the separation by headings. However, a few extra links could be added such as tutorial links for various photoshop design techniques, and links to sites where images are sometimes taken for layout design. There is an enhanced version of Notepad called Editpad, which provides more options and flexibility for coding.
Link Us - Considering that this site is a one-person job, this page would probably make more sense if it is renamed to ‘link me’ or ‘link back’. I like Hirokache’s linkware buttons, especially the DN Angel and animated ones. This is optional but the page should include a brief instruction on how to link back. “Please link back to http://hirokache.com by saving one of the linkware graphics to your desktop and then upload to your server.”
Link Exchange - Instructions for sibling, affiliation, and link exchange is straight forward. Your rules are easy enough, but where will these links appear?
Links - Scratch the last question, I found my answer. For less confusion, I would combine these two pages into one they’re both related, and the link exchange/affiliation page is rather short. The small snippet of link exchange and affiliate request can either be placed before or after the links. Whether the two pages are combined or not, the link to ‘link us’ need to be removed. The link already appears on every page on the left column. The link to Pink Garden should be moved from the top, and placed either under a topsite category on the page or after the links in the navigation menu. The links provided under the credit category would be more appropriate on the credits and copyright page.
The following links require updates: Digital Hoshiko, Hidden-Tears, Blind-Paradise, Rinicrown, Peachy Pixels, J-Muse, Lacrinae Spiritus, and Angelic-Essence. You should probably make a requirement where your link exchanges must contact you if they decide to close down their site or put the site on hiatus. At least, you could move them to a ‘temporary absent’ category or something so there won’t be as many broken links. Did I mention I like the use of linkware graphics for this page?
Network - Since Autumn-Storm is linked on this page, there really isn’t a need for the same link to appear twice in the ‘links’ page. There is no need for another network header to appear before the links to your other sites; just start listing the links right after the little snippet about making Hiro happy. =D Of which, I really like Noir. When I find time, I will browse through the site with my Japanese dictionary next to me for practice. A <br> tag is missing after the link to Hirokache Oekaki. Under hosting, I believe you meant to say “you can check out Autumn-Storm for hosting though.”
Reviews - A nice extra page, but to avoid confusion, separate each review to its own page, and provide the links to them here. That way, you could also add in your own comments to the review if you have any disagreements.
Listed - The page is self-explanatory. I like the use of linkware graphics rather than text links. ‘Another-Place Listings’ has been suspended, and I’m not sure if they will be coming back online or not.
Guestbook - I normally don’t comment on guestbooks or tagboards, since they’re more of a chat-related contact thingy that is not related to the overall content of the site, but I simply love the organization of the guestbook. Kidori make pretty layouts! There is one mistake though. The link to Megabook is broken.
Basics - The identity is very cute, but I had to put my face really close to the screen and squint before I could make out the words. The image source for the identity need to come after the head div layer so it doesn’t overlap the header’s bottom border. I like the use of small blinkie images and links to portray certain characteristics about yourself. This is very interactive. However, the blinkie for your birthday is a little odd on the page. I see a big gap between the left pixel border and the birth month. Ambidextrous was used twice. I like the use of the heart symbol rather than a word to categorize your likes and hobbies. The prohibited circle symbol doesn’t do as great of a job at symbolizing as the heart though. ‘Mayonaise’ is spelt wrong; it should have two n’s in the middle.
Wow.. you’re watching quite a few anime series at once. I barely have the time and effort to watch one and finish it. I was a little confused with the stuff category, until I found Momo. It all makes sense now. By the way, ‘gaurantee’ is spelt wrong on Momo’s page. The link from Daisuke’s avatar needs to be updated as Crystal Wings Studio has moved. The contact information is self-explanatory. When contacting you, is there a need to include a subject title in case the email gets mistaken for spam? Someone once told me that even though we substitute the @ in email address with [@] or {@}, people who do spam emails get around it anyway.
Purofairu - Why is it the content of this page is in Japanese but the headers are written in English? I had a little help in reading this page, but it is nearly the same as the basics page, with a few extra facts. One question though, isn’t birthday ‘tanjoubi’? If so, then the kanji for day (nichi) is missing.
Portfolio - I’m sure your rules/warnings will most certainly scare all the stealers away. No one likes frying pans. XD I like the blends, especially Wind, mostly because I am going through a pink phase right now. Two grammatical mistakes on this page. The first concerns the ambiguity of time reference in the description of wind. The blend was created “a couple of weeks ago” as in from the moment I visit your site, from the day it was uploaded, or the day the site was opened? I think you understand what I am getting at. The second mistake is a spelling error. ‘Wierd’ is spelt wrong in the description for Explosion.
Randomness - The things found in this section certainly are random. I like the contents of my purse page. You certainly are a junk food addict (but so am I). I really like your monthly planner. It’s very cute! Why are your quotes all political ones with the exception of one? Not that there are not interesting or funny, but I expected a longer list and a wider range of quotes. On the randomness main page, there was a snippet that said visitors could learn a little bit about tennis and some of your favourite players on the tennis page. But there’s only info about two of your most favourite players. Of course, the instructions on how to play tennis and such is not required - since this is a random page - but it would be interesting if you wrote a bit about yourself the way you did for Rafael Nadal Roger Federer. You could make a tennis player ID card sort of thing with type of play, wins, losses, etc. It would be kind of cute.
I don’t like the organization of the autographs page. There is no organization. Instead of giving divider headers to each person you received an autograph from, display them together under one heading and use alt tags for their names (which you already have). If you choose to display the autograph previews in paragraph form, then it would look more organized and be very helpful if a snippet was provided about who these people are, what they do, and what you think of them (similar to the description on the autographed sheet). Click here for a visual. There are errors in the description of Leo Bretholz.
“He is the author of a World War II Holocaust novel, Leap Into Darkness.” - Use ‘a’ instead of ‘the’ since there are more than one novel about WWII and none of them are named ‘the’ novel of WWII.
“He visited our high school (which he seem to do periodically because he is a friend of our English teacher’s), and I was privileged enough to have his autograph.” - Misuse of the past tense, use of a comma to separate different ideas in the same sentence, and a spelling error.
Photography - I really like your photography skills. I can never be able to capture the essence of a location or object with the camera. I guess some people have more talents than other. I really like Winter Sky. I like how you designed the photo previews, although half of them don’t have the hirokache.com watermark. I like your camera too; it’s very fancy.
Writing - All links are working properly. The funny thing is that most people write better poetry in times of depression, because that is when they are most in-tune with their inner feelings and are better in expressing them by words. However, I am not one of those people. Since the writings are not really novels, why not rename the page to stories?
Adoptions - The adoptions are so cute. I really like the blue penguin. The penguin is so typical of you. The problem with adoptions is that you must check the websites periodically to make sure they are still up and running. For example, Hamha, Candied, Kawaiiness, So-Cute, and StitchxKitty Adoptables are no longer online; and Elemental Graphics is on hiatus.
Quizzes - I like how you keep a page of the quizzes you’ve done. I did the same thing for my blog a long time ago until I got bored with keeping track of them. The two results from the mental age quiz should be displayed one after the other for better comparisons. But let me get this straight, you used to behave mentally like an old granny, but recently your mental age has dropped to that of a toddler? Star-girl.org has moved to Blossom.nu, and the last quiz link is not linked to a new window.
Contests Joined - No problems here.
Fanlistings - All the codes are displayed properly, and categorized correctly. The page looks very well organized. The following links require updates: Kyou Kara Maou, Sesshoumaru, Sanada Genichirou, Kyuu, Kokoro-chan, Graphic Design, Green Party, Pro-Choice, and Right to Die Movement. Armed Forces of Amestris is linked in the same window; and Shinshi Doumei Cross, Edward, Frozen-Rain.net, are not linked.
Gifts - Those are really cute gifts. I wish I was able to do computer generated art. Two problems: the first being that the second gift of the tennis player exceeds the width of the content divider width, and the second is the use of indirect person reference in the description of how you received the Ed drawing. The artist is referred to as ’she’ but we don’t know who she is. I know the artist’s name is given in the image alt tag, but providing her name in the description gives a direct and active subject.
Graphics - The rules are very straight-forward leaving no room for misinterpretation. The avatars are well-made, although the white background fill to your avatar table column provides too much contrast. Perhaps set it to black like the layout background. Although some of the avatar are obviously images of nature, an alt tag categorizing them (eg. flowers versus scenary) would match what you’ve done so for the other avatars. The same goes for the button templates, of which I really like the star one. It is very creative and original. I also really like the wallpaper titled Wing. Those fire wings look awesome. You must give me the tutorial for that. The dog pixels are really cute too. The Exquisite Award must be really hard to win since there have yet to be a winner.
Interactives - The Programs and Product Reviews page is interesting, yet the format of the page is not very well organized. For starters, the Hiro’s review image is displayed before the page title heading, so the title is and text look too condensed. The image itself doesn’t really relate to the page. It looks more like an image preview of an Apple software much like the previews for Quicktime and Videora. The white background is really bright compared to the dark background used consistently throughout the site. The three ipod image previews used for comparisons are mislinked. Since you’re a graphic designer, you should consider a comparison between photoshop programs like Paint Shop Pro versus Adobe Photoshop.
The Google search link is working properly (although I don’t see its usefulness). Seven of the nine linkware buttons in the plug board are not working, and the links are mostly spam pages. I’m not sure if this is your intention, but three of the links are to webpages promoting Viagra. Instead of using a direct-add plug board script, you could make it so links have to be manually inputted. This help controls the amount and types of links allowed on the plug board.
I enjoyed the funny videos, especially the TMX Elmo. You’re absolutely right, laughing is great for our body and mind, and it certainly brings us out of the blues. The manga artist links have been very helpful to me. I really like the artwork at Vert Information, so I should be visiting that site again very soon. The site title is not appropriate. It should read “Anime Voice Actor Sites”, and there is no need to capitalize the first letter of the first five words on the page. Just the first letter of the first word in a sentence is sufficient.
I never anticipated such a large personal webpage. Hirokache is a a great combination between a personal and a resource/graphic site. There are, of course, the typical small errors like a mispelled word or a missing end tag. There are plenty to learn about you, and there are also plenty interactive activities to keep me occupied. I have a very enjoyable visit at Hirokache.
Hiro Says:
November 12th, 2006 at 9:25 amThank you
I shall read this thing over when I have time… >_>
Because my mom is about to eat me. ;A;