Archived Review

I'm not going to critique your design. Frankly, I don't care what your site looks like overly (because I'm not a "design person") and I can read the text -- that's the important part for me. (Plus, many other reviewers here do design much better than I do anyway.) As it happens, and for what it's worth, I quite like the look. I think you should swap the green accent text though -- making the links green and the highlight text a darker/lighter brown would make your links stand out more and make it easier to navigate.

The general standard of English is pretty good, I have no complaints in that regard. You're right about looking 12 though. I'm sorry, you probably hear that a lot, but you're spot on. You'll probably love it when you get to 30 though, and the rest of us have bald spots and wrinkles and you're there looking 20 still. Given that I'm 22 and already have a sprout of grey hair, you can probably tell I'm a teensy bit jealous.

Right, on to your tutorials...

Firstly Cpanel > Adding Email Accounts - the tutorial is... well, not a tutorial. You've written two lines of text, and linked some images, which I very nearly didn't see because your link text is too close in colour to that of the normal text. You need to go in to more detail here. "Log into Cpanel" -- where would I find cpanel? -- point out that most hosts have it available through website.com/cpanel or link to your "What is Cpanel" tutorial to give some background info. Make note that different versions of cpanel will appear slightly different to your screenshot, put the images in the tutorial so that people don't have to click on extra links, etc. All little things that make a real tutorial, useful.

In Cpanel > Adding FTP Accounts you write "If you are new to cpanel then this tutorial might be useful"... clearly if I'm looking for a tutorial on adding an FTP account in cpanel, it's because I'm new to it, and don't need to be told it's useful. Again, include images in the tutorial rather than linking to them. Explain the details in the image, what quota is and why one needs to be set, etc.

Under Cpanel > Adding MYSQL Databases you state "I've found that you can only add one user to one database" but this isn't strictly speaking true. You can have many users associated with one database, or one user associated with many databases. It's a good idea to have one per database though, and would be better put across in this way. Again, include images in the tutorial (I'm going to stop repeating this now, assume the advice is good for all tutorials.)

CSS > Add Borders To Images misses out two important values from the border property: style and colour. You should also be defining a measurement for the border width (1px rather than 1). Strictly speaking, you should use border-width if you only want to specify a width.

In CSS > Background Image you ask the user to "Copy and paste the following code into your CSS code" but don't expand on what or where the "CSS code" is. If I were a noob at this stuff, I might just put that randomly in my HTML document somewhere, and expect it to work. You don't explain what background-repeat: no-repeat is and how to change it/why I might want to change it.

CSS > Colour First Letter again misses out what CSS code is supposed to go, and doesn't actually tell me how to change the colour... it's akin to handing the keys of a truck to a 10 year old and saying "drive kiddo". You need to teach a person how to steer the truck (metaphorically speaking).

CSS > Custom Headers instructs "go to your CSS code & find your first header (H1)" ...but what if I've just learnt about CSS, and have created a stylesheet, but don't have anything in it yet? I'm not going to have that 'first header' that I should be finding. Believe it or not, most people don't populate their stylesheets based on the code given in a dodgy tutorial, they write it from scratch (that said, the people who do wouldn't need this tutorial anyway). You tell me, the user, to "paste the code below, somewhere under your H1 code." So, when I come to your with my stylesheet set out like this:

h1 { }
background-image:url(URLHERE);

...are you going to admit your tutorial is faulty or blame me, the user? Be more specific about where the code should go.

CSS > Custom Textarea falls in to exactly the same trap as 'Colour First Letter'. You tell me to edit code you've provided, but don't tell me where. On top of that, the CSS you've put as demo code is a) bloated and b) mostly pointless. Instead of giving people your dodgy code, why not teach people how to write their own, properly? Explain what "font-family" is and how to use it, instead of dictating Tahoma or another given font.

CSS > Double Underline is redundant, <u> tags are presentational AND deprecated.

CSS > Navigation Blocks 1 / Navigation Blocks 2 don't really make sense to me and I'm a competent web developer. What exactly are you trying to get people to achieve here?

The FanUpdate > Categories tutorial is probably the most useless thing I've ever read. With all due respect, my niece is 4 and she could work out how to add categories to FanUpdate because the script is not hard to use. I will give you some advice: don't make tutorials on crap that is REALLY EASY to do. If a person can't figure out that the words "New Category" adds a new category, they are frankly retarded and shouldn't be using the Internet. The same goes for Showing Fanupdate. (Don't take this personally... stupid tutorials are a pet peeve of mine. I'm not the only one)

Your 3 PHP tutorials are the same regurgitated crap I see everywhere so I won't even bother critiquing them.

More useless tutorials in WordPress. Come on, if you use this, there's so much more you could be teaching people.

Moving swiftly on... under Reviews > Criteria, you say "CSS- How neat and well put together your CSS is. Whether it compliments your layout or not." This puzzles me, what exactly has the neatness of someone's stylesheet got to do with anything? Don't get me wrong, I appreciate nicely tabbed code, selectors sorted by precedence or tag, but to grade it in a review seems a bit of extreme. (This is sarcasm btw, I am well aware you're referring to the way a layout looks based on the customisations done via the stylesheet, but this is abuse of the term 'CSS' and is another pet peeve.)

Reviews > Your Content: "I look at how well your tutorials are written" ...given the quality of some of your own tutorials is lacking, shouldn't you be thinking about fixing those up first? I mean, don't get me wrong, I've seen tutorials worse than yours and some of them WILL be useful, but you need to practise what you preach really.

The reviews themselves are of the quality I expected... i.e. you specialise in reviewing sites that are very similar to yours. Take for example your review of Heartless Wind (familiar to me, I gave her a Pants Award) - you tell her:

"All your tutorials are very well written and easy to understand."

Of course, all of her tutorials are absolutely identical to yours. Generally badly explained, don't use the correct terminology, and of absolutely no use to the average visitor because they also have the exact same tutorials on their sites. The only one of her tutorials that is potentially of any use is "Using Code Instead Of Textarea" and that's because the ripped the general idea off me, and dodgied it up a bit.

The "Under other? put Bob Marley" rule is lame and I thought those had gone out of fashion 5 years ago. Apparently not.

Given that you've got a decent looking site, nice big headers, easy to read text etc. I expected the code to be of a higher standard. It's not terrible, don't get me wrong, but there are definite mistakes that I expected not to be there.

You've not got any meta tags; I'd recommend adding a content-type at the very least. It's not just me being arsey, you'll need one if you want to properly validate your site at any point.

Diana/skyefairy are right about your image map. In my *professional* opinion, inaccessible and useless with images disabled (this potentially risks the "indexability" of your site -- i.e. whether or not you'll end up in Google properly); in my *personal* opinion, images are just plain ol' 1996 and need to stay that way. ;)

For some insane reason you're marking up headers as <div class="h4"> and so forth... what's wrong with using the perfectly good header tags? <h1> etc were invented for a reason, use them :)

Not really entirely sure why you're using <A> to hightlight text as green. The only time <a ..> should be used is when coding a link. You really can't just make up tags to suit your needs because there's no guarantee how a browser will react. It's bad enough that Internet Explorer makes up rules as it goes along, you don't want another browser refusing to display your page because you're not using 'real' tags.

I suggest swapping out your crappy bulky JavaScript ad rotator for a PHP equivalent. Try Diana's replacement, or:
http://www.tutorialtastic.co.uk/tutorial/basic_image-ad_rotation_script
http://www.tutorialtastic.co.uk/tutorial/image_rotation_take_two

In the links in your footer you're using target="blank", which is incorrect. You probably mean target="_blank" although evangalists will tell you that you shouldn't force new browser windows upon a user. Most prefer to choose whether or not they want a page to open in a new tab or not, or to replace the existing window. Indeed, I have Firefox set to force any new window links in to a tab instead.

Your stylesheet is referenced twice -- you only need one set of <link href ...>

In your stylesheet, in the body { } selector, you specify Arial with quotes that aren't needed, but don't give a generic font family. Change font : 12px/18px "Arial"; to font : 12px/18px "Arial", sans-serif;. Kudos for specifying a decent size, and a good line-height AND for using pixel measurements instead of the incorrect "pt" which a lot of people use.

Still in body {}
background: #6d5c3e url(http://i292.photobucket.com/albums/mm28/ohpanic/Image117-1.png);
background-attachment: fixed;
can be merged in to one, like so:
background: #6d5c3e url(http://i292.photobucket.com/albums/mm28/ohpanic/Image117-1.png) fixed;

You don't need to put font : 12px/18px "Arial"; in #footer and #footer2 because you've already specified the font you want in body { }. Divs, paragraph tags, links, etc... these all inherit font information from the body. The only normal exceptions (tags that don't inherit the font styling) are input fields/textareas and tables.

Ouch.. I spy a "12pt" in #navigation2 li a { .. } - you were doing so well, too :(

In .comments { }, this:
margin-bottom : 0;
margin-top : 0;
margin-right : 0;
margin-left : 0;
could be squished down to: margin: 0;

Your header styles (h1, h2 etc) don't need cursor : default; as headers don't have anything other than the default cursor as standard. Might as well 'trim the fat' as the saying goes. Again, the margin property value combos can be trimmed to margin: 0;

Ideally, you *should* get rid of the .h4, .h5 classes and just the proper heading tags instead. It'll make your document more "semantically correct" (semantics, in HTML, is about using the right tag for the job... i.e. heading tags for headers, divs for dividing blocks, tables for tabular data etc. Your earlier use of <a> just to highlight the colour of the text is very "unsemantic". I just made that word up, btw, but you get the gist.)

In blockquote { } you don't need letter-spacing : 0; because letter-spacing is always 0 by default anyway, and your margins can be compressed again.

Unless you prefer the extended version of CSS properties to make it easier to read, the following border info on textarea { } could also be compressed from:

border-width : 1px;
border-style : solid;
border-color : #6da102;

to:

border: 1px solid #6da102;

(Once you get in to the habit of doing it, you'll keep doing it, and it will not only make it faster to write and update your stylesheet, but will also keep the size down. You may not think this an issue now, but one of my work sites has some 1300 lines in the stylesheet and so every tweak like that has helped to keep bandwidth usage minimal.)

...and that's it! Phew!

Don't take it personally that I ripped apart your tutorials. It's not a reflection on you that I find most of them redundant. I have an extremely high standard when it comes to code and because I've helped so many people that have been "burned" by bad tutorials, I'm cautious to give anyone a high rating if I see the slightest imperfection. Overall, I found your site easy enough to read, the layout was nice and simple but not visually dull. I like the colour combination of the green and brown (and brown I normally dislike, so you've achieved something there!)

I think you should improve the standard of your tutorials by expanding on how and why the user should do something, and keep images inline so as not to create extra, pointless clicks. I think it's so cliche to say it, but you definitely have potential to expand and improve :)

UPDATED 19 Nov 08:
Just a minor correct, in my review I said "images are just plain ol' 1996 and need to stay that way" but I meant "image MAPS are just plain ol' 1996".

Categories

Latest Reviews