Fix My Site

News, Lingerie, and Role Playing. Really.

2006-12-13T18:10:00.001-05:00

Slashpix, anchor for www.news2.ca, reports,

The idea behind this site is really simple; to create a community organized web application that would be powered by users. All users together act as administrators, which decide whatever to promote news or delete it. Therefore only interesting news would end up on main page. Users can promote news by simply voting for it. Users can also submit news that is related to already existed categories.
I just wonder if you can review this website.

Slash, there's one thing that Canadians are really good at aside from hockey and lumberjacking, and that's being on top of things. Like America, for instance (in a geographical sense, of course). You seem to be on top of things with this news site. While the concept isn't new (see digg.com), and the design is kinda plain, I still believe that this site has some potential. However, usually what separates sites with potential from one another is not a colander, as previously believed, but whether or not they do anything about their potential. Think about it as putting a brazier on your site. You need to raise your site up, and separate [yourself from the crowd]. One way to do this is to pick a really sexy bra, like one that will make people really want to see more (I am loving this metaphor). Maybe throw on a little lingerie over it with some velcr...okay, now I'm just fantasizing, and it's weirding me out. Don't worry, readers, I was definitely not imagining a website wearing lingerie, because that would be filthy and creepy and I'm going to stop this sentence now.

So, Slash, how can you improve your site? Well, several ways. First, as I so creepily suggested earlier, come up with an engaging design. You can even go so far as to completely scrap the design you have now and just sit down and think about a design completely independent from what Digg has (but for the love of White Castle, not in that order). The importance of this is far-reaching; normally I emphasize to submitores (soob-mih-TORE-ehs [don't pretend you don't know how to pronounce that last syllable, eh?]) to work on their content first and their design later, but since your content is pretty much user generated, it's time to work on that design. Right now I go to your site and I think, I'm hungry, and then I think, oh, a Digg knockoff (completely independent thoughts, sorry). I do like the site preview on mouseover, but you don't even have anything there indicating that this is even possible. Also, this feature breaks in Opera, where if the user mouses over the area where the preview is supposed to display, the picture shows up instead of only on mouseover of the link.

Oh, you also have some pretty horrific coding. You declare that the site is XHTML 1.0 Transitional, but you clearly do not follow any of the protocols required by this Doctype. This is surprising, especially for as simple as your layout is. It shouldn't take much to set up a very simple div layout with some CSS classes and have a unique, scalable, and beautiful design.

And while you're at restructuring your code, you might as well try to refigure your navigation, and maybe your overall functionality, which is a bit, how you say, wonky. Upon arriving at the site, the user is presented with three navigation buttons, an ambiguous search box, and a few news stories, with some peripheral information on the side.

Let's pretend now that we're role-playing (don't worry, no mention of lingerie to follow). First, I'm going to be the insecure high school freshman who wants to see the "Popular News" aka your first navigation button, so I click it while thinking about video games and senior girls. Hmm...nothing happens. Click. Click. Clickclickclick. Wait a second (voice crack), this links to the homepage! If this is "popular news", why does the first news story only have three votes, and the one under it have five? You mean to tell me that the most popular news stories you have have three and five votes? Clearly this is not the case, and is something you should look into.

Next, I will be an information-hungry CEO needing my news right this moment so I can make mission-critical decisions while I sip my $10 latte out of my gilded mug made out of rubies and mink fur. I click on "Breaking News", cellphones already out of both breast pockets of my custom-tailored, double-breasted suit (with power tie, mind you), eager to fire off calls to my #2 through #7 guys to get things going based on the news from...two days ago? Huh? Where's the news from one minute ago? Where's the news about my stock crashing/skyrocketing because of a goat in Iran having a kid that looks like Mother Theresa? I believe there may be something funky in your algorithm, because the news I see in the "Breaking News" section, while news, is hardly breaking.

Now, I will play the role of a website visitor. I want to see all news regarding the internet. Where do I go? Well, I can't figure it out by looking at the homepage, so I guess I'll scroll a little...oh, there it is! Halfway down the page, there's a big blue box with a bunch of categories. Hmm... My suggestion here, Slasher, is to get rid of everything you have on the right side (don't worry, we're putting something there, hold your ponies). You have a ton of space in your "main navigation" bar (you know, with the buttons that take you to the aptly named "popular" and "breaking" news pages), so why not put your login there? Or if not there, under your search box, where you also have a lot of fallow real estate. If you really wanted to be hip, you could make a little javascript-enhanced expanding/contracting box (kind of like Technorati or your role model, Digg). Since logging in isn't that crucial to your site, there's no reason to have it taking up valuable space. As for the "what is" section, I mean, I suppose you could keep it, but I would limit it to a teaser with a "read more" link, and then a button in your main nav to an "About" page. I would also get rid of the "justified" type setting. All the huge spaces between words to fill up lines looks about as awkward as a blind date with an actual blind girl (what do you say?? I don't know either! [Note: the past reference was referencing the irony of said situation, not that blind girls are undateable or deaf and mute in addition to being blind]).

I would then move your categories up to the top (or under your "what is" module) and below them, actually put in a sampling of what is in your so-called "tool box", ie, show a sample tag cloud, show the first few "top story" links, and show the first few "top users", all with links that say "See more" that take you to a page with the full results on it. This would be FAR more intriguing than just seeing a link that says that stuff is there. I want to taste it and swish it around my mouth a little before I take another bite, and maybe sometimes a nibble is all I want.

One last thing I'll mention before concluding this review is that you have this love of white space. While at times this can be good, in your case, you are misusing it. In the space you use to display one story, sites like Digg display three or four. Your page is so long because you s p r e a d e v e r y t h i n g o u t so much. Tighten up your whitespace a bit (if you plan on keeping your current design) and you'll notice huge improvements in usability and in people actually getting to story number ten. Oh, and, uh, your logo? Yeah, the reflection should look a little bit more like a reflection. Right now it looks like you have "News 2.0" standing on top of the Russian version, which happens to be in version number "backwards-7.0".

Overall, like I mentioned earlier, any site utilizing this idea has the ability to take off. But, with a market this saturated (Digg, del.icio.us, Magnolia, Spurl, Furl, Girl, Jurl, Purl, etc etc) you have to come up with something truly unique to set yourself apart from the crowd, or you'll never make it into the congeries of little bookmarking icons that adorn the ends of most bloggers' posts. Can you do it? Well, that's up to you. Let's see if the Canadian in you helps you come out on top.

Blogger Sentenced to Life in Cleveland

2006-12-06T01:18:00.000-05:00

Okay, so enough self-horn tooting. Let's get back to my bread and butter, which is the mordacious destruction of fellow webmasters' pride, dreams, and love of life in an attempt to help them better their sites and themselves. The fangs have been re-cut. Onward, ho!

Hot Coffee Girl, brewer of, surprise surprise, hotcoffeegirl.squarespace.com, writes:

I like your site! I am also a web designer/developer...and I am going to crawl back through your archives to check it all out. There is always a lot of information out there, and your site is a good resource for people to go. I imagine I will end up blogrolling you...I keep my roll at 15 or less, but I just kicked someone off so I have been looking for an addition.
Feel free to review my site.

And feel free I will, as is my right guaranteed to me by the laws governing the land I pay tens of...millions of dollars in taxes to each day to protect my well-being, wealthify the unambitious, change my streetlamp lightbulbs, and buy really, really expensive toilet seats. Oh, and give me rights and stuff. And if you look up wealthify, it's like, number three on the list of words to be added to Webster's, right under "to ride dirty" and right before "joladb", which is a mystical Innuit creature who was able to ferment snow into Eskimo beer, otherwise known as "Eskibeer". According to legend, it was the first beer ever discovered, ironically explaining the correlation between Molson's and urine. Hmm...

Oh, damn, I forgot. I'm doing a site review. Well, HCG, I must say that I pity you, but I respect you. Putting up with life in Cleveland, Ohio is by far one of the most cruel punishments that a judge could have given you for that time you took a shovel to that litter of puppies and baby giraffes gamboling with the butterflies and rainbows in the buttercup field. Man, when I read about that, I nearly cried. But living in Cleveland, while cruel, serves you right. I've always wondered if when the children who are forced to grow up there draw pictures of their families, do they include a sun? I was just curious because I doubt they even know what the word "sun" means, unless it's in the form of, "Son, go git me a berrr." But, as always, I digress.

I think part of the reason I enjoy your blog so much is not the simple, straight-forward design, since design is like very thin icing on a huge, delicious ice cream cake, but because your writing is stellar. You tell a good story and you can spell — two very important things when considering whether or not I read someone's blog. Occasionally I will even chortle whilst reading posts about you getting stuck in the snow and freaking out, or on how much you hate something or someone, or about making sexy time with a Boy (or with yourself?). I think what's really impressed me the most, though, about this blog, all BS aside, is how complete it is in terms of features. You have everything from good writing to galleries full of self-proclaimed bad paintings (why you have a gallery of them, I don't know, possibly for comedic value, but it's a gallery nonetheless) to video interviews of you, and we're not talking YouTube amateur porn. I mean, the guy had a microphone, and not the kind where he introduces himself by saying, "Hey, baby, you wanna, uh, talk to my microphone?" but the real kind that transmits sound. Granted, I don't know how much is actually cookie-cutter squarespace templating and how much is HCG Inc., but regardless, it offers a lot of entertainment to the would-be reader. Also, the theming of the design? Loves it. The big thing going around the internet (or so I've heard) is that "Fix My Site Month" is quickly overtaking "Christmas" as the popular theme for December (strangely, in offline arenas as well, like I totally saw this car dealership decked out in grey and orange with pictures of my snooty man pasted on all the windshields. It was classy). I suggest you follow suit (I did).

As for what you could do to seriously improve your site, I mean, sure, you can always improve a design and you can always clean up sidebars, but I think that for blogging, design should always come second to content. It doesn't matter if your blog looks like the sum of an elephant and three gallons of Super Colon Blow (figuratively, of course. I wouldn't want to stare at that while trying to read) as long as your content is engaging in some way, be it through interest, humor, or utter disgust and depravation. Sure, you may turn some readers away by a page covered in pachydermal fecal matter, but you don't want them anyways, the closed-minded maggot pies. But, of course, your page is not feces-smeared, so you have far less to worry about.

My advice? Keep on writin. Nobody likes a blogger who stops writing for a month-and-a-half at a time. Oh.

Okay, back to self-tooting. For you cryers and haters out there moaning, "Oh, all he does is tout his own stuff," I suggest that you recall whose site this is, and then take some of the aforementioned Super Colon Blow and go drive on an Alabama highway at night. Anyways, I've just "finished" (and by "finished", I mean "pushed live") my personal site, www.jasonedelman.com which at the moment contains pretty much nothing but an imported version of this blog and a little bit about myself, but will eventually include a portfolio of work I've done and a handy-dandy little section where I aggregate all the articles I've bookmarked that have been influential in my development as a, um, developer. So check it out, bookmark it, cry and paw at the screen while you look at it because it is so beautiful, do whatever, and go ahead and send me a message through my little contact form. I'm thinking of also putting my review queue up there somewhere so you know exactly where you stand in line and that I'm not full of crap when I tell you that there are 132895127 people in front of you. It could happen.

Finally, He Has Contacted Me: Fix Me!

2006-11-28T00:32:00.000-05:00

Well holy crap. I'm still alive, yep. I apologize to all my loyal readers who have been afraid to turn their comps off at night for fear that the window they've kept open for the past month and a half will magically update with a new review from me. It won't happen again. You see, I've been a bit, how you say, busy lately...........

Jason, brainchild behind www.littleworksusa.com, writes:

I've just finished working on a client's site, and was wondering what you thought. I cower in your all-knowing, all-seeing presence, O Handsome King of the Interwebs. Be gentle. I love you.

Jason, that's so sweet of you. You know, after looking at your site, I couldn't help but think, "Wow, this is the best all-around site I have ever seen on the internet. And damn, you must be good-looking and witty and smell of delicious." For real. I mean, let's talk flawless design, beautiful coding, fantastic programming, and overall wonderful structure. Ladies, gents, if you want to learn how to build a site, you should go take a look at what this guy has done, and maybe listen to what he says, because boy, oh boy, is he good. I love you, too.

Okay, so for those of you who are still catching up, well, man that Jason is awesome. The Awesome, in fact. For those of you on board, I salute you. I decided I would do something a bit different this time since I hadn't done anything in a while, and, I mean, the site is called "Fix My Site", so I proffer my latest work to you, John and Jane Q. Publix. Here's your chance to get back at every curse, anathema, malediction, and execration (all wonderful synonyms for the formerest) ever hurled at you through your CAT5 (or phone cord, Gramps) via my pudgy fingers.

But before you get started, I will include a mitigating list of known issues that I already know of and cannot do anything about:

The HTML does not validate on pages that have an image button. This is because VS.NET 2003 inserts an invalid attribute into this control that renders the page, well, invalid.
IE7 - The "featured product" content does not display. The background image on the subnav once the user is within the site displays sporadically.
MacIE - This browser sucks and maybe 10 people in the world use it, so I did not code for it. Sorry.
There's no secondary navigation at the bottom. I felt this was unnecessary and would throw off my pretty design, anyways.
I know there is no "home" navigation element. However, as is standard best practice, the logo in the upper left corner is a link to the homepage, so get over it.
Since I've added the CMS to the site, the client has made some modifications, so some things, such as pictures or colors, that look a smidge out of whack with the rest of the design are probably not from me. I'm just sayin.

Other than that, let me have it! Also, please patronize this site, as a portion of the proceeds go to charity. I hope you like my work! And, uh, if you're looking to have any work done, well, you know how to reach me *wink* *tongue click* *tongue click* *finger guns*. Don't be afraid to contact the owner of this site to ask her about me, either, she's been trained very well on what to say.

How To Land A Girl, Part I: Claim Her

2006-10-16T00:12:00.001-04:00

I haven't really cracked into reviewing the blogging world, since, as you may or may not be able to tell by this garbage blog, I'm not an expert blogger, but I got this email and I couldn't resist. She sounds too pretty. I'm a sucker for pretty.

Brittany, vixen of pshaboutthat.blogspot.com, requests,

Mr. Edelman,
I know nothing about all this crap, but I love the way you write...mmm...it’s the hot. You are my only link on my page, so I figured why not. You know the drill; in case you forgot, follow my simple instructions below.
Review my site. Bitch.

Well well well...aren't we fiesty? Just how I like 'em. Hopefully you're not a 52-year-old woman pretending to be 22, because that would be, as you would say, the sad. And the creepy. I'll just pretend that you're a hot 22 year-old girl with a thing for guys who have nothing better to do than try to help hapless webmasters on his lame Blogger blog. I'm glad you like the way I write. Some people just come and see that it's a Blogger site and completely discredit it for no other reason than that. It's refreshing to hear that someone's actually reading this. I'm your only link, eh? I guess that means we're dating.

So, Girlfriend, let's talk about your site. Holy crap. Yeah, I said it. Have you seen your design? I mean, for the love of Texas Pete and various other hot sauces, it looks like you just took a default template from a free service and didn't do a thing to it. There's no way anyone will ever read anything on your site because the design is so cliché and bland and unoriginal and...oh, wait. I have one of those, too. Hmmm...isn't it great to be able to focus completely on content (of which yours is a-mazing, but more on that in a moment) without having to worry about design?

I'm sure guys hit on you constantly, so this analogy should hit home: So Guy1 takes you out to dinner and he's just the handsomest thing ever. However, the conversation consists of him staring at your chest and commenting on the deliciousness of the beer in his hand. Kinda sucks, huh? Now you can't ever wear that dress again because the popped seams from where he ripped it open with his eyes will remind you of that horrific date. This is kind of how your site is. People are just looking for flashy design to validate whether or not your content is worthwhile, but sometimes can't look past it, or don't even care. What they don't realize is any moron with enough cash to burn can drop $100 in the saliva pool collecting at the feet of blog designers, upload the design, and continue writing crap content. Who wants to read a blog that's 99% looks and 1% content? Is that even considered "reading" or just eye-raping?

So I applaud you on biting your thumb at the blogging community and not spending time or money on a design when a) you aren't going to be making any money off of this site, and b) you clearly don't care if people even like what you write. Your (hilarious) writing alone is enough to keep people coming back. You've already got more comments (and secret admirers) than me and your blog is a month old. I pretty much have to beg for comments, and I still don't get them (anyone? anyone?). While your posts are spread out, it almost adds to the quality of the blog. Sure, frequent posting is a good thing, and is the one thing I would suggest you do with this blog, but when you post more sporadically (and are consistant with your sporadicity) without too much time betwixt posts, people will keep coming back. Hell, I depend on my reader(s) checking back every once in a while, because I sure can't post every day. Sometimes it'll take a week or more for me to write a review. This one? Three months in the making, baby.

Oh, yeah, I did just call you baby. But I guess I can do that now that we're dating.

I Mean, I Guess It's Fine

2006-10-11T19:27:00.000-04:00

Karen Shanley, possible author of www.karenshanley.com (I'm guessing here), declares,

I'm an author, not a site designer, as you'll see. What's there is what I could figure out how to do on my own....I'm open to any other suggestions you'd like to offer. Feel free to post to your site.

I would say it is safe to, well, say that you are indeed an author and not a site designer. That being said, I think your site serves your purpose well. You are a writer like me (eh, well, in the respect that we both write. You have, like, a book, media appearances, and money and stuff. I have, like, a blog and a degree that says I should know how to write), and while artistic with words, the whole drawin paintin buildin thing isn't our bag (we'll pretend I don't design sites, either). If your site was super flashy with all sorts of crazy rollovers and amazing web 2.0 graphic themes, I think it would take away from the book, which from the excerpt I read, is more earthy and real-lifey (and of course, well-written), kind of like what keeps people like me who spend their whole lives looking at glowing boxes out. Clearly, I'm not your audience, and neither are most people who would be looking for something flashier, so in that respect, this site is well done.

The design is appropriately simple and very clean. No crazy CSS tricks to be found in this site, kids. However, this doesn't mean you can't code it correctly in case you wish to do a reskin later. If you take a look at your code, you will find oodles of inline styling (inline styling meaning instead of using CSS, you're using attributes in your HTML tags and font tags, like <font size="3" face="Times New Roman, Times, serif">) and zero line breaks, making code editing harder than nailing jello to a tree (but easier than, say, eating jello that's been nailed to a tree, because let's face it, that ain't jello). My guess is that you have no idea what I'm talking about and wish I would stop, since I'm pretty sure you didn't hand-code your site. But regardless, as it is my duty, I must inform you that your code sucks more than the Wolverines (Go Bucks!). The reason I'd give you for making your code more editable is in case you decide to do another book, you could have a site ready for you without much coding. But again, moronically, I proceed knowing full well that you did not have a hand in coding your site. Ugh. Moving on...

Your writing and content, of course, is mediocre. If you really want to learn how to write, I suggest you read my site a few more times, since I'm clearly the only one on the interwebs who knows how to string a cogent sentence together. For reals, though, I like your writing. I, too, would like to maybe write something someday (as a few people have occasionally suggested I should (a few people being, like, one anonymous commenter)), but once more I get sidetracked, as this review is not about my hopes and dreams, but rather squashing yours, of which I have not been doing a good job.

If you haven't left the review by this point, it's probably just because you're curious to see how long I can BS my way through the review of a site that doesn't have a whole lot to it. Let's talk about your blog!

Earlier you came to me asking me for help with some coding issue you were having with your blog and I helped you. You wrote about me, and I blushed. My mother doesn't even say stuff that nice about me. Since then I've been a celeblogity (blogebrity? celebritogger?) and I have hordes of eager girls knocking on my door with markers trying to get me to sign various body parts and baby's foreheads. Honestly, the paperazzi, not that bad. A lot of facial hair, but let's be real, these guys live in bushes for most of their adult lives, waiting to pop out to catch that split second when their target is in some uncompromising position picking up their morning paper. So rather than fight it, I'll feel sorry for them and pose for a picture with my fingers, which is from where the power of my blogging ability stems. You should be able to catch my interview in such fantastic publications such as The New York Times, Highlights for Children, and Sports Illustrated. I picked those because that's how I roll.

Karen, I don't know what you'll get out of this post much more than, "I mean, I guess it's fine," and, "Really, Jason, don't you have anything better to do with your time?" Your site serves your purpose, and all the help I would give to an aspiring webmaster would be lost on you, anyways. So to add a smidge of value to this post, I present to you, a fish:

<'))))><

If you don't ever come back to read my reviews, I totally understand.

What the Digity? And Welcome, The EoJ

2006-10-03T10:15:00.000-04:00

First and foremost, I’d like to introduce The EoJ, who, as soon as he gets his all his chickens in a row, will be guest contributing to this site strictly from a design perspective. He knows a little bit above crap about code, but he’s an excellent designer, so you will listen to what he has to say with the same merriment, wonderment, and excitement as you do me. Wow, that sentence can be read the complete wrong way. Maybe if you’re nice, he’ll even tell you what “EoJ” stands for, but don’t count on it. But believe me, you want to know. I don’t know what it means or how he came up with it, but good golly miss Molly. That’s all I have to say about that.

Commencing:

Nikolas, administrator for www.webdigity.com, pleads:

Hi Jason,
I am Nikolas from webdigity. I wonder if you would like to review any of my sites to your blog.

Hi, Nikolas. I am Jason from Fix My Site. I wonder if you would like to tell me how do I really pronounce the name of this site? Is it like “web-dij-i-tee” or “web-diggidy”? I’ve been calling it the latter because I feel like it rolls off the tongue better (and occasionally I will randomly emit a paroxysm of “well webdiggidy dawg!” to the chagrin of those around me), but I can’t really tell which one it is for sure. Please sate the curious (me). And what’s a digity? Are there many species of digities, aside from the webular kind?

As for the site review, I suppose I should let my avid throngs of rabid fans (all four of you, including the cat in Sweden that will occasionally cross over the keyboard and mistakenly enter my URL and the creepy guy in Texas who types through a puppet he keeps on his hand. Don’t ask me how I know these things) know that this is a forum I frequent on occasion and that it took a lot of chutzpah on Nikolas’s part to submit this site, knowing the nature of my beast.

Fear not, though, Reader! He is not above my scrutiny, as no man, woman, child, beast, or beastie is above my objectively subjective wit, sarcasm, and majesty. Except for baby elephants. How do you critique a baby elephant, really? “Ooh, look at that, Stumbles, you can’t even walk you big dumb baby…who has been alive for less than an hour. Look at your tiny little trunk. I bet you can’t even eat…hay with it! What now, Rookie of Life?” I mean, that’s just not right.

As for the site, well, it’s kind of hard to review. Number one, it’s strictly a forum site. There isn’t much in the way of unique design, since this is an out-of-box forum template with a few minor graphical mods. I don’t really get the coffee cups as icons, but maybe that’s a Netherlands thing, since pretty much all they have over there are canals and coffee (and substances deemed “illicit” in the States). I was there for a week once. I would know.

During a portion of his rigorous training, The EoJ brought to my attention that the name of the site is Webdigity. No, EoJ does not stand for “Captain Obvious” or even “Eggie Orange Jaundice”, but rather he makes a good point. Most sites with “web” in the name tend to be looked down upon, since it seems a bit redundantly redundant. Of course you’re on the web; we really have no other way of looking at your site. It’s like a policeman saying, “I’m a policeman cop,” or a repairman saying, “I’m a repairmanmanman,” (Five points to whoever picks up on that reference). Although, I do realize that this is pointless to you, since to fix it you’d have to buy a new domain name and completely rebrand yourself. Talkdigity? HTMLdigity? Diggitydigity? Lesson to readers: carefully choose your site name before you do anything. Or, email me and I will tell you if your name sucks so you can start over before you start your web career clawing at the crusty sides of the web toiletbowl. Really, who wants that under their fingernails?

Pressing forward, I can’t knock the content and helpfulness of the users of this site. There are a lot of active members and a lot of good features and information. I still don’t understand the whole purchasing thing, since I tried to purchase something and nothing happened aside from my hard-earned “credits” mysteriously disappearing, but aside from that, there’s a lot of good going on here. I won’t go into the coding, since I’m sure you didn’t even touch the code, and thus my critiques would fall on deaf ears. I am definitely a fan of the seemingly random “position” title. I think more sites should make fun of their members routinely *coughcough*.

If you look at the screen shot above, you’ll notice that it is quite long. True, you can collapse each module, but even still, that’s a lot of information Tony Danzaing you in the face right when you open it up, and since the modules collapse on postback (ie, from server-side code, not client-side code), they can be annoying to close, so most people won’t. I would suggest either having them all contracted on entry by default or placing all the titles of the modules in one box and having them link to the section they represent.

Also, take a long, hard look at your homepage. Or at least try. Not much to it, huh? No images, no information, just a bunch of links going places. The trend today is to turn sites into portals, and for good reason. What’s nicer than having all your favorite sites, blogs, forums, and “photo galleries” *wink* (don’t think we don’t know, Nicky) in one location? While your site right now is strictly a forum site, you may want to include something like “news” or “Hot Digity of the Week (day? hour?)” with pictures of girls in tiny digities, or an RSS feed to Fix My Site. Just anything that someone who hasn’t been to the site before (or someone who visits often) has something to look at on your homepage. The more value you add to your homepage, the more people you’ll see stick around and register. Expand!

To summarize, what the smurf is a digity? Exactly. Still a good site, though, and I’ll be around making fun of people in your forums. Silly Netherlandithals.

Mrah, How Do You Like My Design, Mildred?

2006-09-25T18:00:00.000-04:00

Hang (the proper noun, not the verb), banger outer of www.fastmoneyrally.com grovels:

I'm currently a college undergrad and I'm pretty much self/google taught in web/graphic design. I've no formal training and I'm really starting to think that it's catching up to me. I have only a working knowledge of HTML, as in I know what the tags mean and all, I just can't write a single line of it. Dreamweaver is my crutch. I still don't know what CSS and PHP and all that OMFG/LOL does. I feel like I've hit the ceiling in the stuff that I can create. I really need a nudge in the right direction to get to the next level in my work.

Well, Hang, if it's a nudge you want, you've come to the right place. Usually my methods include jabs, backhands, and fists to the heart, but if all you need is a nudge, I'm all for it. As for learning what all that OMFG/LOL is, I suggest you talk to my 10-year-old cousin. She knows all that OMFG/LOL better than anyone I know. She'll send me a message and it will be something like, "hi, yt? ok, ttyl! ly! haha lol," and I will sit there and ponder the direction America's youth is headed. Then I'll go to Taco Bell and eat ten tacos and immediately feel better about myself. I wonder if kids have started integrating acronyms into verbal conversation (assuming people still actually express themselves via oral interaction), like if someone thinks something is funny, they actually just blurt out, "L. O. L!" instead of actually lol-ing. Interestingly, this brings me to my next point.

I've got to say, Hanger, if this design is wholly your own, you're a talented designer. The graphics do an excellent job of conveying the connotive hoity-toitiness of this event, as the motif drips with snoot. I can just hear the participants' supercilious badinage: "Mrah, well my supercar is fueled by a delicate mixture of the finest caviar and Cristal champagne. Mrah!" This is perfect, since anyone who owns a car worth more than the Gross National Product of Estonia clearly talks like this and thus are the only people attending this event. So, great job on the design. My only gripe is on the "Why" page, where your links at the top blend too much with the background, making them very difficult to read. If I can't read it, I ain't clicking on it.

Okay, so wipe that goofy grin off your face, because now we're going to get into your coding. I was trying to come up with some terms that could describe it; "horrific" and "painful" were two that came to mind. However, I didn't feel that these terms fully expressed the disdain I felt for your coding, so I settled on the Yiddish term "challucious", since one of the language's strengths is the expression of disdain. Maybe that's a bit harsh, since you do keep your code somewhat organized and you haven't abused tables to the point of counseling, but that's about the extent of what's good code-wise. You use a lot of inline styling and tag attributes, which will make your page extremely difficult to update should the Baron of York and his French poodle Muffy decide they want you to fix the spacing on every page. You mentioned you lean on Dreamweaver a lot. Don't. Check out my tutorials to find helpful (not to mention witty and charming) examples of how to create an XHTML compliant site and image rollovers without using Javascript.

Scrolling text? Um...get rid of it. The reason why "tickers" exist is because of the dearth of space and surplus of information in the location where they're needed. Unfortunately for your site, this is not the case. It would be much more legible and far less annoying to just write down the information you want to say in a static way. It's like the advent of domestication: why chase your dinner all over the place when you can just capture it and breed it within a contained environment for multiple dinners for little effort? Clearly the same thing. Moral—get rid of scrolly text, or you may go hungry.

Your navigation is clear, but your titles don't accurately reflect the location the user is at. I clicked on "Why" and the title still said "How". I don't know, that's why I clicked "Why". If the how is the same as the why, then I think you have more of a problem on your hands than the Duke of Arlington taking a pitstop with a few of those models. Correct metadata is only slightly less important than the actual content itself, but only slightly. Remember that search engines store your titles, so what's a user supposed to think when two pages labeled "How" pop up when they're really looking for why? You know what they think? Lawsuit. It's the American way. Additionally, you need to add some keywords and a page description to fully sate the SEses hunger for meta-eats. And boy, are they hungry.

I suppose the last thing(s) I have for you are try to be less dependent on Javascript and figure out a way to tidy up those images on your "Why" ("How"?) page. In regards to the former, your image gallery, while it may appear cool at first, falls apart for someone who does not have Javascript enabled. Try to come up with some sort of alternative for those less fortunate than yourself, you self-serving chauvinist. Not everyone can afford your fancy schmancy Javascript. Oh, yeah, not all those buttons lead to pictures either (but one of them leads to blondes, so A+ on this page).

In summary: excellent work on the graphics, learn XHTML and CSS, rely less on Javascript (you selfish pig) and include more pictures of scantily clad models. Like I mentioned in my last post, be on the lookout for a CSS tutorial and maybe an aggregation of some other resources on how to learn this crap. Oh, and if you get the chance, go ahead and put in a good word for me to the Thane of Bismarck, or whoever you're working for. Mrah!

Going Blind, Going Crazy, and Advice From Rafiki

2006-09-21T12:10:00.000-04:00

Phil, concoctor of www.purpledogpromotions.com, writes:

Yeah, I know my site sucks, but the bottom line is that I'm a new business and I cant afford to have someone to it so it that it looks slick and real purrty and then NOT be able to fix or add stuff on my own. I'm too busy tring to sell stuff to learn how to make hot looking websites.

Wow. Holy wow. Deep breath...whew. Okay.

Phil, I am proud of you. You are one of a rare breed of Those Who Have Accepted The Fact That Their Site Sucks (TWHATFTTSS), which it, in fact, does. Although, it would have been much better had you asked me to review your site because you thought it was awesome, because that would have at least justified that popping sound that I kept feeling behind my eyeballs as I slogged through your site.

To quote a wise sage, "You tried your best, and you failed miserably. The lesson is, never try." While I understand that your time is limited, and if you don't know anything about building sites, learning can take some time, there are certain occasions when you just simply should not try. I hope to [deity] that you have not placed this site on the business card you hand out to potential clients/associates, because I'm afraid they might visit it. If I were you, I'd keep this puppy (pun could not be more intended) under wraps until you can either get enough time to learn some HTML or make enough sales to hire someone to do this for you professionally.

So what exactly is wrong with your site? Aside from everything, let's start with a few of the most glaring problems. For one, if I wanted to go blind, I could do one of several things:

stare at the sun
flush my eyes out with bleach
try to read all the text on your site

Unfortunately, I would say that the latter is probably the most painful. The yellow background has got to go. Typically, a good background choice is either white, black, or some muted tone that black or white text will look good upon. For instance, if you were really hell-bent on having a yellow background, you could kick it down a notch (maB?) to something along the lines of #DCE87A. This hex-code is a color closer to scrambled eggs than Big Bird Flying Into The Sun While Covered In Ignited Sulphur. If you don't like scrambled eggs, I suggest you try some of mine, because they are delicious. The reason this shade is so much more appealing (although, not much, it's just better than BBFITSWCIIS) is because it is less distracting from your content. This goes for pretty much any color you can find in a box of eight crayons. Be creative; mix it up.

So, that was an incredibly unnecessarily long diatribe on the evils of poor background color choice. Next is an incredibly unnecessarily long diatribe on the evils of incongruous rollover images. Now, I've seen a lot of things since I've been doing this schtick, from dueling marquee texts to enough blinking .gifs to induce epilepsy, but I've never seen someone consciously decide to create a navigation image rollover that shrinks upon rollover. While I would never recommend enlarging the image, I can at least understand the sentiment. But shrink it? Ow...there's that popping sound again.

Instead, Philip, I would recommend something a bit less jarring than throwing your page completely out of whack, since your potential clients (may [deity] have mercy on [possessive] soul(s)) probably won't like chasing your content all around the page. Try creating an image rollover in CSS (not using all that crazytalk javascript) that is the exact same size, but does something different, like changes colors or changes the background. In Web 2.0 (since, you know, I'm like, an expert, and all), flashy is out and subtle is in. Gone are the days of big crazy flashing images and lens flares and tin foil hats in the sun, and now we are in the era of muted tones and, well, non-flashy...ness. People just don't like all that distraction. If Content is King, Design is Queen, so that means that Design has to do what the crap Content tells it to do. Okay, maybe that's not really a good use of that analogy, but you get the point. Design caters to content, not the other way around.

However, (prepare for metaphor extension) no king would be complete without his queen, and right now, I think your kingdom is in turmoil. The peasants are revolting, your grain stores are low, and the Mongrels from the Land of No Design are beating down your walls, screaming threatening ululations and pounding their hairy chests with hairier fists. What sayest thee, O humble steward of the vast, mighty kingdom of Purple Dogia? Wilst thou allowest the wretched scoundrels overrun thine life's joy and ancestral glory? Or wilst thou fight, (tongue roll) rrrise up and create a cool design that will engage and delight viewers from all over the Land?

I do apologize for slipping into crazy Shakespearian soapbox mode, but the Jason back in that last paragraph has a point. You need to come up with a design of sorts, because right now your site looks like the inside of a very, very sick baby's diaper. He would suggest that you read my tutorial on how to create a valid XHTML page and try to model yours after it, and I agree. At least that will give you a leg up on the coding (get it? Get it? Purple dog? Leg up? That, my friend, is wit.), leaving only a bit of minor CSS training to really turn it into something hot (get it? Hot Dog? I am on fire today.). Perhaps I'll do some sort of intro to CSS tutorial in the future. Stay tuned for that. Like, seriously, don't leave.

A few more things—you need some pictures. You sell products, and relatively common ones, too, so one would imagine you would display your wares for the world to see. Do you think someone would really purchase a something from your site if they can't see what that something is first? Unless they are blind (which, now that I think about it, maybe that's the demographic you were after, in which case, ignore this entire review. Great content! Amazing site! Otherwise—), there's not a chance this side of your dwindling client base that they'll make a purchase on your site.

So, in summary, I know you're short on time, I know you're short on money, I know you're short on internet knowhow, and I know you're short (word on the street, man). What I would do is wipe everything you've got clean off your server and wait until you have either the time, money, knowhow, height, or any combination thereof. I know it's not what you want to hear, but as the wise baboon in the Lion King says, "The truth can hurt." This is of course before he cracks open an indiscernable fruit, wipes it on a lion, and begins to laugh and dance maniacally.

Where Count Cookie the Grouch Goes Tanning

2006-09-14T12:43:00.000-04:00

Jeffrey, the solar power behind www.solsuntherapy.com, quoth:

"Fis my site" or, at least, take a peek at it. Well, I don't think its all that broken, but I'd be curious to get your opinion.

So you don't think it's broken, eh, Jeffy? Is that a challenge? Am I supposed to find something "broken" about your site? Fine, I shall.

So after some extensive research, a few lab rats, a howler monkey (oh man did I learn why they're called "howlers"), and some protein synthesis, I've discovered where your site is so broken, it may as well be shattered into a billion tiny pieces and strewn over the ocean to be ingested by phytoplankton and sea turtles. Your CSS doesn't validate! Sucka! Aw right, still got it.

Okay, so, really, that's the only thing structurally wrong with your site, so despite my best efforts to make you feel like crap about this awful piece of junk you've submitted to me, it's really not that bad. Granted, you pansied out and went with the hippy doctype of HTML 4.01, but it validates, so I can't really give you too much crap, except you should probably go ahead and make it XHTML at some point in the nearer-to-when-you-started-reading-this-sentence future. So, broken, sadly, no. Are there things that suck? You betcha! Plus, I know you loved my sentence where each word had a comma after it. Only people with degrees in that crap can do that and get away with it, so I wouldn't suggest it.

Let's talk about your design. To be fair, it's a good start. To be unfair, you could do a lot better. Don't get me wrong, I like rotating women as much as the next guy (or girl who is of that orientation [if she prefers rotating women (unless she prefers rotating guys and girls, in which case, this is not the same)]), but the fact that you only have two draws a lot of attention to your lack of (image) pimpin' abilities. Maybe add a few more pictures to that feature to keep it a bit fresher, as you know how everyone loves fresh womens.

Also, I know you were going with the whole transparent cutout image thing with the separation of the header section from the body, but honestly it looks a bit disjointed. This could be because the body does not match the head at all, kind of like those make-your-own-character things where you could pick the head, body, and feet from Sesame Street and then name it Count Cookie the Grouch or something. In this case, your site would be named Licenseplate Plainwhitebox Plaingreybox, instead of Sol Sun Therapy. Since your header is rounded you have three options:

Delete all your files and start from scratch
Flatten out the bottom of your header and connect it to the body
Round out the corners of your body

I understand these may sound like scary changes to you, since you seem pretty well set on your design, but believe me, the third option is really easy as pizza and beer should do the trick. Basically, what I'm saying is that your design lacks continuity, which is a bit jarring for your visitors. Additionally, there's enough unused space in the main section of your site to put an embryonic elephant. I would suggest you fill that with a grey sidebar like you have in your "sunless tanning" or a picture of another hot chick, but hey, that's just me (Adriana Lima and Maria Sharapova are not being suggested or hinted at). Remember, your homepage is the furthest most people will get on your site, so giving them as much eye candy as you can without sending them into epileptic shock is a good idea.

Let's talk metatags for a second here. It won't be a long talk, since you have none, so I would suggest you put them (them = keywords and descriptions) in, and make them unique to each page.

It appears that your content is pretty good and unique, although I will admit I didn't look at other tanning websites, but for the love of Pete check your spelling! "Packette?" Is that like a tiny packet, analogous to a "towelette", "kitchenette", "Rockette", or "Corvette" being diminuitive versions of towels, kitchens, Rocks, and Corvs? And Nothing Is More Annoying Than A Sentence Where The First Letter Of Every Word Is Capitalized To Construe Faux-Importance Of The Sentence Or The Subjects Being Capitalized Within. Funny how you can literally hear the deep, haughty voice saying that sentence. Well, at least I can. Um. Moving on.

I suppose my only other gripe about this site is that it took me at least three tries to figure out what the little button at the bottom of your navigation says. "Wear a fan unearth if all?" Ok, Yoda, whatever you say. Oh, one more thing. This is nitpicky, but since you've submitted yourself to my scrutiny, too bad: the text in your footer should be smaller, since you want to distinguish it from the rest of your content. The footer is purely informational and should not be so prominent on your page. Shrink your bottom logo and shrink your text, and you could probably drop the height of your page by like 150px.

All in all, you have a very good start to what could be a very decent site. The design is not horrible, the coding stomachable, the navigation clear, albeit discriminatory (what if a groom and his buddies want to have a tanning party?), and the structure not overly complex. Just a couple more hot chicks, and this site could maintain a regular audience (did I hear a suggestion for a "Hot Chick of the Day" feature [which is, of course, completely acceptable to capitalize egregiously]?). Good luck.

Edit: I just looked at your site in IE7. Imagine shattered pottery. That is all.

Jason's Valid (X)HTML Skeleton Tutorial

2006-09-11T00:00:00.000-04:00

It's been a while since my last tutorial (or since my last post, even) and I've been getting some clamor in my inbox about what I consider to be the best way to create the (X)HTML portion of a site. The truth is, many people are pretty clueless when it comes to where they should begin. That big, white text editing box can be a bit daunting when you're not totally certain how you should go on. Is there a "right" way? A best way? Well, the answer is, as Confucious would say, "Der are many right way, but no best way." End of tutorial.

Zzzinga! Got you good, I know it! Clearly you have peripheral vision and could see that there was more to this tutorial than just that one paragraph, so welcome to the portion of the show I call, "Jason's Valid (X)HTML Skeleton Tutorial".

This tutorial will show you how to create a valid XHTML, two-column layout that is CSS-ready and inline-styling free, kind of like your favorite diet pop/soda/coke. And don't worry, no skeletons were harmed in the making of this tutorial because, well, skeletons are not...living.

Okay, enough crap. First things first: Doctype. The very first thing your page needs in order to be (X)HTML compliant is a doctype. If you are scratching your head, knee, or face trying to figure out why I keep putting the X of (X)HTML in parentheses, you should probably stop, because it's a bad habit and it won't help you figure it out any more quickly. The reason is because the X stands for "eXtensible" HTML, which is slightly different (and easier!) than regular HTML, but my model will work in both X- and HTML. Why isn't it EHTML? Because we're not Canadian, and everyone knows the letter X is way cooler than the letter E. But I digress.

Doctype - your doctype determines how your site is going to be validated. There are several different forms of (X)HTML, and your doctype tells the validation parser which one it should use to validate your site. Of course there are things such as custom doctypes where you can create your own HTML tags, but that's outside the scope of this 'tute. For this 'tute, we're going to use XHTML Transitional simply because it's a good segue between HTML 4.0 and XHTML Strict, which is where most browsers are going to be in the very near future.

Your doctype and leading <html> tag should look like this:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml">

This line is cAsE-sEnSiTiVe, so make sure that you type this in correctly. Or, better yet, just copy and paste it and save yourself the trouble.

Before we get into the XHTML model, I'll go over a few of the main elements that comprise XHTML (and separate it from regular HTML), and should be included even if you stray from my model.

ALL TAGS ARE IN LOWERCASE.
Every tag needs a closing tag, ie <p></p>
- There are a few exceptions, such as <br /> and <img />, which are considered "empty elements", which basically means that it doesn't need a closing tag because there's nothing you can put between the opening and closing tag. Many meta tags are empty elements as well.
All <img /> tags must have an "alt" attribute.
Attribute values must always be in quotes, ie <img src="me.jpg" alt="This is me after my eighth beverage." />
Tags must be closed in the order they were opened.
If any special characters are used, such as & or —, they must be used with their character counterpart, such as & for &, or — for —
If you use the "id" attribute, you can only use it once per element. For instance, you can't have two div tags with the same id attribute.

This covers some of the biggies. For more info on the smaller stuff, go here: http://www.w3.org/TR/xhtml1/ or just validate your page and find out where you messed up.

Okay, so now you know what XHTML sort of is and you have a doctype and an <html> opening tag. What now? Try this:

<head> <title>Your Title</title> <meta name="Description" content="Your description" /> <meta name="Keywords" content="Your, comma delimited, keywords" /> <meta equiv="content-type" content="text/html; charset=utf-8" /> <meta equiv="imagetoolbar" content="no" /> <link rel="stylesheet" type="text/css" media="all" href="your-css-stylesheet.css" /> </head >

Hopefully blogger or whatever feedreader you're using parsed that correctly...sometimes they won't, but if you're lucky enough to be able to read that, congrats! You know how to make a header section! Let me briefly explain what is pretty much self-explanatory:

Title: duh. The title of your page.
Description, and Keywords: duh. Written meta information about your page. May or may not be important to certain search engines, but always a good idea to have.
That "imagetoolbar" thing: it's not exactly necessary, but it's good to have in there because it turns off that annoying little toolbar in IE6 that pops up when the user mouses over an image. I like this meta tag, so I hereby declare it part of the skeleton. Which is mine anyways, so I can do with it what I will. So there.
Stylesheet: this is where you connect your CSS to your page, because you're not putting your styles at the top of each. That's just gross and dumb, and my skeleton is pretty and smart.

After you put in your header, put in a <body> tag and you're ready to get started! Okay, well, you're ready to copy and paste some more.

What I'm going to introduce to you now is what is the latest and greatest in cutting-edge XHTML technology, your buddy and mine: Div Structure. Div Structure is the savior of the internet, riding through your CAT5 cable on a tiny white horse and a halo around His head. Or if you're on WiFi, He's in a billion pieces above your head, in your nose, and underneath your fingernails, to name a few. Okay, so maybe Div Structure can be a bit "invasive" but he is still the easiest thing around, outside of Candy, the creepy lady with pink hair and ripped pantyhose who is always hanging out at the gas station and seems to like you for reasons you can't comprehend.

Imagine that div structure is sort of like those Russian dolls that pop out from one another with a teenier one inside of the last, except that divs are not made out of wood and they're a lot easier to decorate. Also, instead of only being able to fit one doll inside each preceding doll, you can fit as many as you want in there because the outer doll is made of like, rubber, or very quickly growing hair, or something. If you're familiar with table structure, this concept may be new and different and frustrating to you, but believe me, it's an improvement in more ways than I can list here.

The first part of our div structure skeleton is going to consist of a main "wrap", which is essentially a div that goes around everything. In fact, we are going to name the div "wrap" for simplicity's, Pete's, and chri's sake. So, after the body tag, add <div id="wrap"> </div> with some line breaks in between the opening and closing tags so you can add more Russian dolls (metaphor extension? eh? eh?).

Below the wrapping div tag, you're going to place another div without anything in it with an id of "top". "What the deuce am I doing wasting a div tag for?" you sputter, incoherently, to your imaginary friend. Well, Mr./Mrs. Darryl and Debbie Downer, I've found in my years as a developer, this div can be helpful for things such as jump links and even adding auxiliary imagery. Also, its placement there semantically correct because it is, technically, at the top of your content. While you're at it, you can place a div tag with an id of "bottom" right below it for the same reasons, opposite style. Everything you make now is going to be between your "top" div and your "bottom" div.

Now to the meat of the skeleton (irony?)! My skeleton consists of just a few basic elements (just like you!):

Header (head)
Content (body)
Side column (pancreas...?)
Footer (arms)

Of course, every site is not this simple. You may wish to add certain features to your skeleton, such as adamantium claws, or another eye socket, or a flash widget. But I've found that even though this structure is very simple, it is very adaptable to pretty much any situation you could throw at it, should you harness the ability to hurl concepts at...code. So for the basics:

Create a div with the id of "header" and close it, inserting line breaks. In fact, from now on, when I say "create a div named _____" the preceding instruction is what I mean, so just DO IT, okay? Inside this div is where your logo and main navigation are going to go. At the top of every page you should have a logo that links back to the home page of your site, because, well, that's how we roll in Web 2.0. It frees up a space in your main navigation (ie, you don't have to have a space for "Home") and it's pretty much a best practice amongst the big sites (and some little ones) on the net. Be sure to put your image in a <p> tag. This, along with its double-wishbone suspension, will give you more control for a greater feel and a smoother shave. Then go ahead and create an unordered list with your main navigation elements. If you want, go ahead and give each <li> tag a unique id so that you can create pure CSS rollover imagery for your nav. Your header section should look something like this:

<div id="header"> <p><img src="logo.jpg" alt="Bob's Corncob Jobs" /></p> <ul> <li id="nav-about"><a href="about.html">About Me!</a></li> <li id="nav-corn"><a href="species.html">Corn Species</a></li> <li id="nav-violent"><a href="violent.html">Violent, Corn-Related Crimes</a></li> </ul> </div>

Of course your site is probably not about corn and the violent crimes associated with them, so you'll want to replace my sample text with something a bit more relevant to your site. All the code listed above this point is pretty standard and mostly won't change on every page. Almost everything below this point is going to (hopefully) be different on every page of your site. That's because it's your content. What I'm going to show you is, of course, not the only way to do it, nor the best way for your site necessarily, but it is a good starting point and the concept is sound, and I ain't talkin' 'bout music. Wow, two apostrophes in a row...talk about awkward.

Remember that talk we had about wraps? Yeah, it made me hungry, too, and it doesn't only apply to the outermost layer — you can use wraps anywhere, sometimes within other wraps. Remember those double-wrap tacos from Taco Bell? It's kinda like that, except less delicious. Anyways, for the content section of your page, unless you're not adding any other elements (ie, other divs) aside from text, you should create a div named "content-wrap" right under the close of your header div. What this allows you to do other than imagine food while you code is logically keep all of your content together, regardless of the elements it contains and what format they are in. It also helps to standardize your styling when you use CSS, since you can use various forms of cascading styles when you use wraps without having to rewrite a lot of BS CSS. Ergo:

<div id="content-wrap"> <div id="content"> <p>I am a bologna, cheese, and mayo sandwich with chips in the bread.</p> </div> <div id="some-other-element-named-logically"> <p>[insert random inane content here]</p> </div> </div>

Cool beans, daddy-o! You're almost done! "But wait," you interject, mouth full of kosher ham sandwich. "Where do I put my sub-navigation? How will my users know where to find my other pages within the section they are currently in?" First, where did you find kosher ham, and second, just add in a sub-navigation section, silly! The reason why you include your sub-navigation after all your content instead of before is for two reasons: accessiblity and SEO. Including your subnav (as it is referred to amongst we geeks) after your content means that if perchance someone using a mobile device, screen reader, or other vibrating instrument that does not allow CSS rendering happens to plod across your page, they will not have to sift through your 300 sublinks about the various properties of corn before they get to your content. It is good for SEO for the same reasons, as spiders are lazy, lazy creations that get tired after checking a few links and may never make it to your content.

(I realize this is getting [ha, "getting"] long, bear with me. You've been having fun and learning so far, though, no? Yes?) So, how do you make your subnav appear to the left of your content if it comes after it? Easy: CSS. First, create a div named "sidebar" right outside of your "content-wrap" div. This will become the cozy abode of your subnav. The reason we call it "sidebar", though, instead of "subnav" is because it is possible that you may want to include other things in that area of the page, like a link to my site. So, inside of "sidebar" create another div named "subnav" and jam all your related corn-growing technique page links into here in an unordered list, like so:

<div id="sidebar"> <div id="subnav"> <ul> <li><a href="sunlight.html">Sunlight Grows Corn!</a></li> <li><a href="water.html">Water Grows Corn!</a></li> <li><a href="love.html">Love Grows Corn!</a></li> </ul> </div> [insert link to Fix My Site here] </div>

After you've created this sidebar, the way to sneak it up to the left of your content is via CSS. Without going into too much detail, basically fix the widths of your "sidebar" div and your "content-wrap" div to the sum of the width of the "wrap" div, ie 200 (sidebar) + 550 (content) = 750 (wrap, or sidebar + content). Then, float the sidebar to the left and the content to the right, and do the hokie pokie and turn yourself around. That is what it's all about.

Pressing on, the only remaining element to my skeleton are the arms: the footer. This is easy; create a div named "footer" and place some text links that mirror your main navigation in your header and your faux-copyright claim that no one can enforce. Bam! Eureaka! Calloo! Callay! You are done! Now wasn't that easy? I apologize for the relative dearth of information presented in this short tutorial, but hopefully I have presented you with a working model that you can use as a foundation for more crappy websites for me to revile.

For your reference, here's the full model in all its glory (shrunk down to save space):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head> <title>Your Title</title> <meta name="Description" content="Your description" /> <meta name="Keywords" content="Your, comma delimited, keywords" /> <meta equiv="content-type" content="text/html; charset=utf-8" /> <meta equiv="imagetoolbar" content="no" /> <link rel="stylesheet" type="text/css" media="all" href="your-css-stylesheet.css" /> </head > <div id="header"> <p><img src="logo.jpg" alt="Bob's Corncob Jobs" /></p> <ul> <li id="nav-about"><a href="about.html">About Me!</a></li> <li id="nav-corn"><a href="species.html">Corn Species</a></li> <li id="nav-violent"><a href="violent.html">Violent, Corn-Related Crimes</a></li> </ul> </div> <div id="content-wrap"> <div id="content"> <p>I am a bologna, cheese, and mayo sandwich with chips in the bread.</p> </div> <div id="some-other-element-named-logically"> <p>[insert random inane content here]</p> </div> </div> <div id="sidebar"> <div id="subnav"> <ul> <li><a href="sunlight.html">Sunlight Grows Corn!</a></li> <li><a href="water.html">Water Grows Corn!</a></li> <li><a href="love.html">Love Grows Corn!</a></li> </ul> </div> [insert link to Fix My Site here] </div> <div id="footer"> [footer links] <p>© 2006 Your Crap Site. All Rights Reserved</p> </div> <div id="bottom"></div> </body> </html>

Mitigation: The Fun Spoiler

2006-08-28T17:30:00.000-04:00

Greg, the big cheese at www.gandmcomputers.com, writes:

Hey, I saw you on woot (great place to advertise).

I wouldn't call it "advertising". I would call it "offering".

I want some suggestions. There are definately a bunch of things wrong with it (a few of which are validation issues). I would be happy if you posted the review on your blog.

If me posting a review of your site will make you happy, Greg, then happy you will be. Of course until you read my review of your crap-a-dap site.

Kidding! I don't think your site is crap, Greg, I promise. As a matter of fact, I think it is mediocre, which is pretty good, relatively speaking (did you see my last post? Good lord!). Like most mediocre sites, there are some good things and some bad things. Normally I start with the good to really butter you up for the bad, but this time I'll do the same thing.

GOOD

Simplicity. Keeping It Simple, Stupid is a great methodology to create a good site. A lot of people will try to use every little javascript snippet and DHTML trick they know to make their site more "interactive", when all they're doing is really hindering their users' experiences. Know what happens when you hinder your users' experiences? You guessed it: no more users. Oh, maybe you guessed something else, like, "they want to fight you," or "they complain to the government," in which case you may be right, but really you're wrong. Lie to me and tell me that you guessed what I envisioned you guessing. Otherwise I have to go on this long tirade about how you guessed wrong and then the whole review has gone to waste.

Content. Each page in your site has a decent amount of unique quality content. When users come to your site, they will most likely know that they are at a legit company's website and not some sc/pammer's site. More pages and more content will be necessary for a truly good site, but I imagine that you're still in the development stage, so I'll leave it at that.

Congrats on using a div structure! Hooray! What I would suggest here though (I know this is in the "GOOD" section, but this seemed like the most logical place to put this) is that you make sure to name your divs according to their actual function, as opposed to their design function. Naming something "box_right" is simply a design function. What happens if somewhere down the line you want to redesign the site, but keep the content as-is? Maybe in your new design, the stuff in "box_right" will be on the bottom, or on the left. Now you have to go through each page and change the class name to "box_left" or something so that you don't get confused. Instead, name it something like "extra-info" and you can put it anywhere on the page you want without feeling guilty and eating a pint of ice cream.

Okay, enough hanky panky. No one wants to read the good stuff anyways. There was a lot to put down below this line, but I only chose a few. What fun is it if you don't get to figure some stuff out on your own?

BAD

At first when I tried to validate your site, I got all excited when I saw that neither your code nor your CSS validated. I prepared my scathing, mordacious remarks in my head and envisioned myself evilly chortling as I wrote them. Then I re-read your initial post and all my conniving machinations deflated when I saw your mitigating validation statement. Damn. Well, *sigh* yeah, it doesn't validate, but you already knew that. Moving on...

Your design could use some, how you say, "work". While Keeping It Simple, Stupid is good, Keeping It Too Simple, Stupid is a different acronym altogether that just doesn't make any sense. The most garish, glaring element of your design is clearly your advertisement for Firefox. Now we all know how much everyone loooooves Firefox because it's standards-compliant and all that yazz flute music, but at first glance, I don't know anything about your site except that maybe it's just another Firefox-worshipping site. There's nothing wrong with the promotion of Firefox, I mean, I do it on this blog, but let's be real: about 10% of the world uses Firefox and the other 89% uses IE, with .75% using Opera, .25% using something else, and a negligible amount of poor, starving orphan children in Germany using Macs. Poor Hans, Dorfunkel, and Jorgen. Anyways, the point is, regardless of what nonsense I just spouted, the thing is too big and too prominent on your page. Shrink it and move it, or lose it, sister.

Proceeding with design issues — your navigation. Ask yourself this question: why do I have a navigation system? Is it so users can go to other places in my site (ie, navigate) or so they can try to find where to go on my site only to have the link disappear from under their mouses (mice? mices? mooses?). When a user currently mouses over your navigation items, they turn white! This wouldn't be a problem if they weren't against a light grey/white background. Think about all the Alzheimer's patients that may go to your site. "Hmm...I think I'll click services. There it is. Hey! Where did it go? I'm hungry. Hmm...I think I'll click services." And so on, and so forth ad infinitum. This could be detrimental to your sales.

More design — on the left side of your main content where you have text that looks like it should take you somewhere else, it doesn't, because it's not linked. Link it.

Fresh and new computer builders, eh? What makes you so "fresh" and "new"? Did you guys just start a computer building company that talks smack to your mothers? What do you do that's different than everyone else? Do your mouses double as beer IV's? Can your CPU case double as a kegerator (if the answer to either of these statements is yes, where do I purchase?)? From the looks of your site, you don't do anything "new" or "fresh" compared to any other computer maker, especially the giants such as Dell or Gateway. Set yourself apart, man.

Two words: spell check. If a fifth-grader can spell "paroxysm", you can spell "explanation". (FYI, paroxysm is an awesome word. It's what I did when I first looked at the last site I reviewed, right before I went looking for a grill fork with which to gouge out my eyes.)

On your products page, you have an image map. This isn't bad, per se, but definitely a bit outdated. Remember back in the day when you would go to a site and it was just a big, honking image that you had to kind of figure out where to click in order to navigate? Yeah, I'm glad the 90's are over. Instead of using an image map, I would cut each image out individually and list them separately on the page with some sort of border or something, three to a row. Shouldn't be hard to do, especially with CSS. Also, it gives you a bit more flexibility should one of your products change or you add more products. Oh, and on your "dual screen monster" page, your image of your 2SM breaks your layout. Monsters will do that.

I would say something about your logo, but I have a feeling you like it, so I won't. Okay, I will. Is it supposed to look like an atom bomb? Ohhh, I get it, you guys are "da bomb". Clever! Maybe you should design your whole site to look like a giant atom bomb. Don't actually do that, though, but it would be funny. For like, a minute.

Okay, I guess the last thing I have for you is that you need to do something about your contact form. I just hit submit without entering anything and it just took it like the new guy in prison, no fight, no nothing. Add some validation and you should be good.

So, I know that I listed a bunch of things under the "BAD" section and not many under the "GOOD" but that doesn't mean anything, really. Listing the bad stuff is more helpful (and fun!), anyways. Don't be discouraged; I don't think your site is bad. You are in a good place right now to start. Put a bit more thought into your design, get rid of that god-awful Firefox ad, and do all the other things I mentioned and you should be well on your way to creating new, fresh computers that smell like evergreens and taste like cherry pie.

(Any word on that beer IV mouse? If you need venture capital, I will invest all the money I make in AdSense from this site [which is hundreds of thousands of dollars {eh, maybe not hundreds of thousands. Or even hundreds of...dollars}]. We'll be millionaires!)

How To Appear Homeless On The Internet

2006-08-24T23:02:00.000-04:00

Well slap my face and call me Charlie, it's another site review!
Jake, mastermind behind www.jakethedrummer.com, writes:

I know so little about all this stuff. I saw you on woot, and you are from colorado. I love woot and I am in colorado too. I get a bunch of hits on my site from people in Colorado as well. Hopefully you can help.

Your hair is pretty long, Jake, maybe you could lend me a hair tie? I just finished looking over your site, so I was hoping I could get some help holding my hair back while I deposit my lunchtime burrito into the toilet. And I don't even have long hair. Hopefully I can help, although I'm not certain anything short of a professional miracle will cull this monstrosity. Where do I even start?

Okay, let's start with your hosting. You own a domain name (jakethedrummer.com), why not pay the $4 a month to have it hosted somewhere you aren't forced to have ads? Geocities? Really? I remember making a website on Geocities more than 10 years ago. Believe me, you don't want to be a part of Geocities. It's pretty much the closest thing to being homeless on the internet. I understand you don't know much about this stuff, but a simple [insert favorite search engine] search will yield probably several million sites that can help you with the minutiae.

Now onto "design", or lack thereof. What the crap, man? Aren't you an artist, or do you not believe in the slash associated with "artist/musician"? Either way, a six-year-old Special Olympics shotput champion could come up with a more intriguing design than yours. "New and improved"? What did you do, completely resize your pictures so that they were completely incongruous? Change your background color from crap to crap? At least you have some sort of navigation, but sweet Moses, at least try to make your site appealing to your visitors.

If you want to be a halfway-decent developer/designer, you have to have some sort of photo-editing software. Photoshop is pretty much the industry standard, but there are plenty others out there that will do the trick. Here's what I would do if I were you ("crying myself to sleep every night" has been omitted):

sit down and draw something on a piece of paper with a pencil.
take whatever you just drew and tear it up because it sucks.
grab a beer and drink it as quickly as you can.
take your pencil in your hands, close your eyes, and try to imagine how your site should look. Try to think of common elements (maybe drums?) that could be worked into the design.
start drawing what you see in your mind's eye (open your eyes first).
repeat step 3.
if you don't like what comes out, start at step 2. Eventually you'll either come up with something you like or be too drunk to realize how terrible it is.
show someone else your idea. People other than yourself are usually good with telling you your work sucks.
don't take negative criticism personally. They don't dislike you, just your artwork. Unless they specifically tell you, "I don't like you." If this is the case, offer them beer.

This is usually the creative process that I go through, plus or minus a few beers. Either way, if you at least sit down and put a modicum of thought into your design, you'll be better off than barfing on the keyboard and letting whatever key depressions result from the force of your vomit determine how your site looks.

Also, I'm pretty sure that you're using a WYSIWYG designer if you're using Geocities. While it may make design easier for you, it simply does not hold a candle (or a Halogen bulb, for that matter) to actually learning and understanding HTML and how it works.

I don't have time to go into detail about what else sucks about your site, so I will just list them here:

You have a hit counter. Those went out of style with jorts (jeans shorts, for those who aren't hip).
You have a guestbook. Normally, this would be eh, but you have no entries. That's just lame. At least get a family member to tell you they think your site is cool (it may take beer or inheritance percentage points to convince them, though).
You have some random link to "This Day in History." Huh?
No other page in your site looks anything like another, ie, your "bio" page doesn't even have a background color.
Your picture page has all sorts of random pictures, but no explanation of what or who they are. Cool, you play drums and can pose with people no one knows. Who are they?
Your contact link is a mailto of how you would post your email address in a forum. Very annoying. Either put it in there or don't.

I guess a suggestion I would have for you is stick with your MySpace site if you have no desire to actually put any work into making this site look good, because all you're doing with this site is hogging a domain name from some poor sap named Jake who fills oil barrels for a living.

Roses are red,
Violets are blue,
This is the crappiest website
I have ever been to.

Ay, Mami!

2006-08-18T00:50:00.000-04:00

No, your eyes do not deceive you. Here before you lies, yes, a site review. See? Didn't I tell you all those days of laborious blog refreshing would be worth it? Thus, I will not tantalize you anymore. Behold:

Mayred, la dueña de http://www.laventanadeensenada.com/ principal/principal.php escribe:

Well I'm from Mexico and me and my husband are begining to develop sites for living..... and as i love your site, i would like to hear your opinion about this one.

The edition team now is working on filling the whole information, that's why the link is not just [link],we develop an administration module there's where the editors fill the all information.

So, what do you think?

I'll say it in a way you will understand best: hay cosas buenas y hay cosas horribles. Now, to appease everyone else, I will repeat in various dialects and accents:

Southern (not Texas): Thar some good'ns n' some 'at ain't so good.
Asian: You hava gooduh tinguh ana so vewy bada tinguh!
Southern (Texas): Ya got sum good aynd ya got whut looks like sumthing Billy shot behahnd that thar barn.
African-American: Yo what it is, cuz, you got some good shizzle, you know, and you know you got some bad shiznit, know what I'm sayin?
Snooty English: Oh deah. Beatrice, it appeahs as though Maynahd has come up with a piece of whehk containing both good and bad elements. A spot of tea?
Californian/Stoner/Frat Guy: Duuuude! So, like, your site and stuff? Dude, it's like totally cool and like totally lame and stuff.
New Yorker: Fugeddaboudit.

If maybe you didn't understand any of my attempts at being as PC as possible, I will put it in plain English for you: there's some good here and some bad. Let's start with the good, shall we? We shall.

I like the design. Really, I do. You keep it consistent throughout the site, which is a plus. Consistency is a major part of the user experience. You'd be surprised at how many people leave sites because they get confused, thinking they're actually at a different site and lose trust in the original. Your design is colorful and your design concept is bold and simple. You've got what appears to be a decent amount of content, and best of all, no blatant ads! Users love going to sites where they're not bombarded by ads constantly. Although, they also love sites that do have ads, but, not because...of...the ads. Comprende? I mean, people will still keep going to Yahoo!, even though you can't go anywhere without someone asking you to try their new pill or go check out their awesome new movie that will gross single-digit millions in the theaters. Also, I do like your navigation. It is clear and not really all too confusing. Your images appear to be good quality and not stretched, and your little Flash widget is pretty cool.

Okay, bad time. There's a lot of bad, sadly (not sadly for me, of course!). First off, your design is one of your biggest downfalls. "Espera...qué? No acabaste de decirme que el diseño es la mejor parte de mi website?" Well, yes, but it's also one of the worst. When I look at the site, my retinas catch fire and I go into epileptic shock. What the crap is with all the colors? Colorful is good, but you don't have to use every freakin' color around! While you do limit the colors to sections, you have so many sections that some colors are so similar to others that they can get very easily mistaken. Also, the design of your content is horrendous. When I'm looking for something, I don't want to read anything all the way through because there's too much information everywhere. While it looks clean, I can't imagine someone going to a page and reading all six or more boxes you have in each section.

And don't get me started on the code. Okay, too late. I've started. Your code is horrifying. Table-based design, no DOCTYPE, javascript popup window functions, and although you have some CSS, you have a lot of inline design. What happens if you decide you want to change your color scheme from something Crazy Mexican to something more Rico Suave? Tu no puedes muy facilmente! ([Southern (not Texas):] Ya cain't do it, I reckon).

All in all, Maynard, you've got a solid foundation on which to build. It may take a while, but I would say the biggest change you should consider making is going from a table layout to a div layout, and maybe doing something with your color palette. Maybe your target audience will like all the colors, because remember, I'm probably not your target audience. But I know as a human being, I can't stand clutter and eyestrain, so you might want to do something about that.

Tune in next time, when I do a review on a website! It will be bold, it will be outrageous, it will be spectacular. Check back every few minutes or so. You may get lucky and be the first to comment on my next review!

I'm Still Alive

2006-08-01T18:47:00.000-04:00

Hi everyone-

I greatly apologize for my lack of posting for the past month. You see, I started my new job on the 5th of July and have been a busy little bee since. I appreciate everyone who has requested that the site continue, and honestly, I would like to keep it going because I love it and I think it provides a good source of information, entertainment, and good, old-fashioned ass-kickery in an easy-to-swallow etablet.

For those of you who thought I was going to say, "Unfortunately, I'm closing down this blog because I'm far too busy and important for you hoi polloi commoners," I say, "Suckas!" I'm not closing down this blog. At some point in the near future, I will pick up where I left off and begin bashing sites like I did in the good ol' days of May (although a new review every day may be a bit of a stretch). In fact, I may even get to a review sometime this week. But don't hold your breath, because if you do, well, you'll probably pass out and hit your head on something and wake up in a crusty pool of your own blood and drool with a headache and three less teeth. Or pregnant. Either way, I heretofore thereby formally declare myself not liable.

In all honesty, I really have been busy with my new job (which is like my last job, but about 1,582,892 times better, and nothing like my last job) but additionally, I have been contracted by someone whose site I reviewed to rebuild her whole site from scratch. And if you must know, we're through the design phase and into the coding phase. Exciting! Maybe if enough people want to see and she's okay with it, I'll post the comps here.

Anyways, I really do appreciate all your support and gripings, and I will attempt to get another lambasting up here sometime in the relatively near future. Relative, of course, to when you read this. Like, if you're reading this now, and there's still no new review, you are closer to the new review than if you read this, like, yesterday.

-Mgmt

Happy 4th!

2006-07-04T11:14:00.000-04:00

Happy Fourth of July to everyone! Don't read my blog today, you're wasting your time. Read it tomorrow and the next and the next, but today is for setting off illegal fireworks, drinking gallons of Festive, and watching the World Cup semifinals. Not for trashing someone's website. Go outside, dammit!

See you tomorrow.

-Jason

Smells Like Fish

2006-07-03T11:28:00.000-04:00

So, crisis averted. Lesson to all readers: back everything up regularly, as in every time you change something, because something will happen. In fact, go back up your stuff now, and then come back. Back? "Back" is one of those words that if you say it enough times, it starts to lose meaning and look and sound funny. Anyways...

Guess what today is? Monday!

Josh, heir to www.striperguides.net, writes:

My dad recently asked me to help him update his site for him. He doesnt have any money to pay someone else to do it, so I got stuck doing it. I am requesting your help if you have time. There is so much that needs to be done, I dont know where to start.

Ha, Josh...This situation has been all too familiar to me, too, except my father sells stuff and your father sells fishing. While it may be easier for me since I have something tangible to display on the internet, everyone loves a good fishing trip. Personally, I believe that any company-that-doesn't-sell-a-product's strong point is its "proof of success," which in your case, is pictures of grizzled, old guys hoisting ginormous fish above their heads. I'm sure you have many of these, and in fact you have several on your home page. However, the way you present them is not very attractive, so this (design) may be a good starting point.

So, let's attack your design, specifically on your homepage. First, lose the gradient background. Red to yellow? For real? It's glaring and doesn't add anything to the page. At least you got rid of it in your downpages. I think your logo would be fine if you got rid of the ".net" at the end of it. Do people know your company as "Striper Guides" or "StriperGuides.net"? Do you see Yahoo! and Google and eBay and Amazon going around touting themselves as [company name].com? Sure, you see a couple, like Monster.com or Expedia.com, but they've spent millions branding themselves as such, and they're also purely online-based companies (okay, so are Yahoo! and Google and eBay and Amazon, but they haven't branded themselves as {0}.com).

Navigation: it appears you used some repeating graphic on the side that doesn't quite mesh with itself, so that looks extra tacky. Add that to the buttons that also don't match the pattern exactly and you've got super tacky, kind of like the glue you used to use in kindergarten to make those pipe-cleaner animals. You use unnecessary javascript for your button rollovers, which only bloats your code (which we will get to in a second, don't you worry). Check out my tutorial on how to create image rollovers in straight CSS for my preferred method.

Other than that, your design is just kind of plain and uninteresting. Very mid-90's, just-figured-out-how-to-add-bevels-in-photoshop-5. Do you really think that with this site you're going to convince Jim Bob and Ronny Johnny to drop $300 to do something they can get drunk and do themselves in Ronny Johnny's third-wife's dad's motor boat? Sure, if they want to catch the biggest and the best, they'll have a better shot with you(r dad) as their guide, but hell, they could have made this website themselves, so how do they know that you(r dad) is any good? You have to at least give an air of professionalism to be somewhat convincing and gain any business.

Moving on to code, which unsurprisingly doesn't validate, it's a veritable mess. You've got endless lines of worthless javascript, no CSS stylesheet, and a table-based layout. "Add this site as a bookmark"? It's 2006, man. If someone wants to add you, they will, because they know how, and if they don't know how, then do you really think they'll know how to find you after adding you using your link? Oh, dear lord. Guess what I just found? No, not a cockroach in my bed having mutant babies that are having babies. Something worse: the <blink> tag, the Unholy Grail of web development. If you do only one thing after reading this review, get rid of that tag and erase it from your HTML knowledge. The world says thank you.

If you read some of my previous reviews, I discuss the importance of learning CSS and applying it using the concept of design and code separation. You'll find that while the learning curve may be a bit steep, once you figure it out, you'll wonder why you ever did things the way you did them in the first place.

One last thing: your photo galleries. Photo galleries are wonderful things, as people love the mindless entertainment that flipping through pictures gives them. However, no one likes to see a daunting page of over 100 thumbnails that takes over five minutes to load. My suggestion would be a wonderful little concept called pagination. This is a lot easier if you have a database and some way to control some server code, but apparently you do not, so you may have to do it manually. While this is a pain-in-the-touchas (you say it like you have popcorn in your throat. Toucccchhhhas), it will greatly enhance user experience. Also, knock down your thumbnail images in quality so they don't take forever to load up. Somewhere around 4-8K should be fine.

Unfortunately, I've got nothin in terms of poetry today, so summary: design, design, code, design, fix them all and you'll be fine. Oh, well, there you go.

Don't Link Out, Homey

2006-06-30T09:18:00.000-04:00

Well, still in crisis mode over here for one of the sites I built. Apparently the server went down early yesterday morning and still isn't up. I'm not a happy one right now. However, the good news for you guys is that there's really nothing I can do at this point, so that frees up some time for me to do a quick review!

Jon, proud father of www.dlc4me.com, writes:

Just looking for an overview - design comments, coding usage.. etc. This site is a mix of hand coded and GoLive generated (much reworked by hand) code... somethings are not validating but most have been fixed. My main push over the last few weeks has been toward a tabless design (css only) and I still have much left - many areas are table centric and ther are still some inline / absolute css seed lieing around. If you have time I would mind you reviewing the site

Jonny, you do some good things with this site, and you do some naughty things with this site. What you do well is your php/xml scripting works loverly, and I'm sure it is easy to update. Your navigation is only mildly confusing, and your design is clean and consistent, although I don't know how much I agree with the palette.

Something that is not so good about this site is that you have several links on your homepage (and throughout your site, as well) that take the user to another section of the site, but pops up in a new window. This is bad. If you're taking a user to another part of your own site, keep them in the same window, unless they're downloading a .pdf or something, or they're clicking an ancillary link from a page with a form they must fill out (like a policy of sorts). No one wants to have a window pop up in front of them that is either mis-sized or unscrollable. Similarly, you have links on your homepage that link to other sites. Unless you have a good reason for this, this is usually a no-no. You want to retain visitors. No one came to your site to see visitsequoia.com. They came for you, Jonny.

One last thing about your links on your home page is about your non-links. You have what appears to be anchor text, but no links, such as "Advice on buying your first home..." or "Check out our Mortgage Calculator...". Does your site have these features, or are you just trying to get your visitors a little taste of what's coming later (if ever)? My suggestion would be to get rid of any link text portending eventual linkage if you don't have the page to back it up. It's confusing, and annoying.

Imagine a guy named Jonesy. He just got a divorce with his rich wife and took half because she wouldn't sign a prenup (they were in love!). The money is burning a hole in his pocket, so he decides to buy a house. He shows up to your site, still slightly distraught from his recent traumatic divorce, and really wants to calculate his mortgage. He begins clicking furiously on the plain, innocuous text suggesting the existence of a mortgage calculator, until all of the sudden, his mouse breaks. With gritted teeth, he begins ripping out his hair at the prospect of never being able to check his email again (because he is clearly a lamer) and begins lighting things on fire. He begins to shriek maniacally and throw flaming objects around his apartment, eventually catching the curtains and the entire apartment building on fire. Since he no longer has any personal possessions and somehow managed to hold it together long enough to blame the arson on the cat which he never owned ("Poor Mr. Pretzels...little guy never had a chance"), he is forced to move back in with his ex-wife and continue with his miserable existence in...misery ("Do you do anything to help around here?"). All because you teased him with the prospect of a mortgage calculator.

Moving on, some design elements of your site may turn off users looking for a more professional-looking site, such as the squeezed, irrelevant, low-quality images in your header. What are those people doing? Are they looking at a blueprint or a sushi menu? Is the dude on the left, like, totally showing his arm candy where his "dude's only room" is going to, like, go and stuff? Or are they at Home Depot? People looking to drop 200-300k on you are probably looking for something a bit more polished. Think about it: would you rather go buy a car from Bob's Cars whar ya git a free greell with evrah parchiss or your Certified [insert favorite make] Dealer?

As for code, you mentioned you're aware of the messy code. It's good you're aware and attempting to fix it, because it's not great. You need to use a stylesheet to separate your design from your code, ie stop using inline styling (for instance <div style="position:relative;width:720px;height:65px;-adbe-g:p;"> [I don't even know what -adbe-g:p; is, but I can tell you it's invalid], should be something like <div class="someclasswithallthosestylesinit">). You also have no keywords or descriptions on any of your pages, which may have an effect on your search engine rankings (although how much of an effect is debatable). You use javascript for rollovers, which does nothing but make your site less accessible and bloated. See my last tutorial for what I consider to be the best way to do image rollovers without resorting to javascript.

I will say this, though. Your site does present some decent content and a somewhat reasonable navigation structure—two very important elements to a website. Table structure is not a bad thing, so long as you're using tables to present tabular data. For instance, it is completely semantically correct to place your housing listings in a table, since they are being presented as tabular. You're not using the tables to contain design elements (although they are formatted, which is fine), just data. Some people go crazy with divs and want to place everything in a div (aka "divitis"), but a div is not always the best or correct tag to use in all situations.

So, for your summary. Hmm...let's go with rap?

So I go to your site and I see it's all pink
The first thing I think is "holy crap, this site stinks,
He's got some crappy pictures and some outgoing links
So I blink, I stare, and I look a little closer
And take another sip of my matinal mamosa.
The structure's all right and the nav is okay,
But rollovers using javascript make users roll away.
So you say, "Is there any way to make them stay?
I kinda wanna use the site to sell a house today."
I say, "Okay, man, look. The external links gotta go
Somewhere else inside your site where they're less apt to show.
And while you're at it, clean up your messy code.
Don't you know that CSS and tables don't flow?"
Then I jump into my whip and I spin my twenty-twos,
I swing my chain, bling out my cane and spit my gangsta ruse.
I roll nice and slow givin shout outs to my crew
Whose quotidian behavior is reading my site reviews. WHAT

Fix, fix, fix, fix my site.
Fix, fix, fix, fix my site (oooh yeah) x4

Crisis

2006-06-29T09:42:00.000-04:00

I apologize for the lack of post today (or at least so far today), but we're experiencing a crisis over here. If I should happen to get it fixed up at a reasonable time, I may still have time for a review. But I can't make any promises. Tomorrow I'll have one for sure. Thanks for understanding guys :)

-Jason

Tip for Newbies: Hire a Pro

2006-06-28T09:44:00.000-04:00

Dan and Ann, co-conspirators for www.ecowiseinc.com, write:

Great blog! I have enjoyed the education.

Thanks, I enjoy giving it.

We are lost (obviously), a middle aged couple starting a business that's time has come. I know you hate Frontpage, but it was highly recommended to us.... So that is what we used. We did hire a "pro" to help, but he did nothing but lower our bank balance. Nothing he did was usable.
How do you find a good site designer / developer, how long should the turn around be and how much should we expect to pay?
Our site is for education purposes, we don't sell on the site. We have received emails from other businesses who needed the info we offered & thanked us, so our content has some value.
We wanted a site that we could alter constantly, adding & changing text & pics without having to study software for months. Is there a simple way for amateurs to do a decent job on websites?

Okay, so I wrote pretty much your entire review, and then someone called and I picked it up and happened to drop the receiver on the keyboard and, well, you can guess what happened next. Sigh.

So here's a recap: I started off by calling you DAn(n), which is a clever conglomeration of Dan and Ann, then I made fun of people who have no fingers, then I made fun of newbies, displaying my usual pedantry with the use of big words like "tantamount" and "dilettante", then there was talk of monkeys eating honey, what ancient Inca tribes would do with optical computer mice, and the hilarity of snowmen playing full-contact football (think about it), and then I got to talking about your site. So, unfunny BS aside, here's what I remember of what I wrote before the Fall (of the stupid phone receiver):

Is there a simple way for amateurs to do a decent job on websites? Well, yes and no, but mostly no. Asking this is like asking a roofer, "Hey, do you think I could put this 200 square roof on by myself?" He will probably laugh at you, but only because he doesn't understand what you're saying, and then he will shout something at his buddy sitting on your roof, who may chortle. Yeah, you can put on your own roof, but if you don't know anything about roofing, how good of a job do you really expect to do? And come on, if you live in a house with a 200 square roof, you can probably afford to pay someone to do your website for you.

(Note: none of the above was in the original review. Also, probably none of the below was part of the original).

Basically what I'm saying is, web design/development is just like any other profession/hobby/fetish—those with experience are better than those without. What is unique about this industry is its ability to close that gap with technology, such as software. Now, using WYSIWYG editors, any Tom, Dick, or DAn(n) can put out anything they want, and it has the same availability and accessibility (in terms of being available to be accessed) as any other site out there, from the ones created by Toms, Dicks, and DAn(n)s to those created by thousands and millions of dollars. But, like I said above, thousands and millions of dollars usually will yield a better product.

Pretty much the only thing that the average layman (or sub- or super-layman) can do well without professional assistance or prior development/design experience is write copy. Writers can make great websites with just a modicum of design and development experience because they write great copy. In reference to your site, the one thing you can do you do well. Your content is excellent, as it is well-written, focused, unique, and informative, which gives you a leg up on about 80% of the internet. And, since search engines don't care what your design looks like, this is an extra boon.

Unfortunately, search engines aren't the only ones that you want visiting your site. People occasionally visit sites, too, meaning that aesthetics are of some importance. In terms of aesthetics, well, your site sucks. It looks like a powerpoint presentation gone horribly wrong. Your logo is grainy and of poor quality, some of your image links have blue borders around them, you have images randomly strewn amongst your text, your color palette is inconsistent and doesn't match itself, and your homepage with a ridiculous amount of unused above-the-fold space, has a picture with a date in the corner on it. I understand your site is for education purposes, but if I were looking for information on roofing, I would probably go somewhere like www.roofhelper.com. Not saying that this site is the end-all, be-all of professional sites, but if you compare yours to theirs, you can see why a user might be more likely to trust the information from their site.

I suppose we don't have to get into a discussion about your frightening code, since you guys are not really coders and used FrontTheDevilPage, but I will mention your lack of keywords and descriptions. Yes, they may not be of utmost importance, but I would rather err on the side of more content than less.

How do you find a good designer/developer? Hmm...I wonder where you could find one...:) I will admit, it can be hard, because anyone who knows HTML or has a pretty good grasp of a WYSIWYG editor can claim to be a professional. However, the best way to tell is to look at their work and compare it to other people's work. Another harbinger could be to look at their code, even if you don't know what it means. For example, take the code from your site and compare it to an example site from someone you're looking for. Do they look the same? If yes, tuck and run.

Summary, in pretentious freeverse:

One day, while the sun blooms like a flower on a jagged horizon,
While the tree quivers, still moist from its dewbath in the gloaming,
One day, amateur developers will be able to compete with pros,
and tyro designers will be able to express themselves perfectly on digital canvases.
However,
That day
Is not today.

Nor will it be tomorrow.
So if you want a website that glitters like gold,
and sparkles like exploded Fourth of July detritus,
Glue some glitter to your monitor
And shine it with a flashlight,
because you can't do it by yourself or with FrontPage,
Which is the Devil,
but you can hire someone
who knows
What they are doing,

And you will Achieve your
Dream
of Educating the masses
About the wonders
nuances, passions, techniques, and licentious desires
of roofing.

Tutorial: Image Rollovers in Straight CSS

2006-06-27T10:10:00.000-04:00

Hey everyone, and welcome to my second tutorial. My first one received such a positive response that I feel almost obligated to do another. So, I'm going to tackle one of the most annoying things people do on the development end of a website: image rollovers.

What's an image rollover? For those who don't know (which I'm sure is not too many; it's 2006, people), an image rollover is when you have an image on your page (usually a button, or link) that appears to change state when the mouse is passed over it, and then changes back to its original state once the mouse has left. You've seen this nefarious trick pretty much anywhere you go on the web. What you don't know is that 98% of the people who implement this design element do about 300% more work than they need, and in turn bloat out their code and add messy, unnecessary Javascript. This tutorial will show you how to replicate the image rollover effect using nothing but good, old-fashioned CSS and (X)HTML.

First things first: we need an image. Lo and behold, here we have one:

"Wait! That's two buttons!" No, Silly, it's one. Just hold on. Now, let's assume that for some reason, this button was in your navigation for your page where you feature all kinds of Off!s, such as Dance, Show, Blast, and , whose CFC-less contents are effective skeeter repellents (and smell like Deep Woods!). One of your new features is the Mouse Off! where mice get together to display their...uh...miceyness to...each other. Semantically, your navigation should be in the form of a list, ie:

<div id="nav"> <ul> <li id="mouse-off"><a href="mouseoff.html">Mouse Off!</a></li> ... (enter more Off!s here using the same format as above) </ul> </div>

This is the extent of your HTML code. Pretty easy, huh? Notice that I wrapped the code in a "div" tag and gave the div tag an id (not a class) as well as the "li" tag. Also notice how I have not used an image anywhere in my HTML code, and my link is a text link. WTF! you say. OMG! you bewail. Keep following. The truth will make sense soon.

The only thing that's next is to mess with the CSS. While it may be easy to just copy and paste the CSS I am about to give you, if you understand the concept behind the whole thing, you should be able to duplicate it later without even thinking, and when people do things without thinking, well, that's the American way.

Okay, imagine, that at your Mouse Off!, you have many aquariums full of mice. Aquariums? Yes, bear with me. Don't worry, there's no water in them, except to quench tiny mice thirsts. On top of these aquariums is, well, a top. When you pull the top off, mice! When you put the top back on, no more mice! This is essentially the concept. You have an image underneath and an image stacked on top of it, and when you pull the top off (aka, mouse over) you see the image underneath.

"So why the two buttons in one image?" This is for CSS simplification. With both of your button images in one image, you don't have to worry about more than one button per navigation element. So, here's the CSS in all its majesty (I apologize for the lack of indentation. I'm sure you understand):

#nav ul { list-style: none; margin: 0; padding: 0; } #nav li { list-style: none; float: left; padding: 0; margin: 0; } #nav a { display: block; height: 54px; /* This assumes all your elements are the same height */ text-indent: -5000px; overflow: hidden; } #nav a:hover { background-image: none; } #mouse-off { width: 187px; background: transparent url(../images/btn-demo.gif) no-repeat 0 -54px; } #mouse-off a { background: transparent url(../images/btn-demo.gif) no-repeat 0 0; }

Let's break this up into mouse bites, or go definition by definition. First, all you're doing here is relieving the "ul" tag of any duties. It thanks you. Next, you are ensuring that your buttons appear horizontally. If you don't want this effect, get rid of the float: left; property.

The third block is where some of the magic starts. Text-indent -5000??? Yeah, I wrote it. This neat little trick shoves your text link into a virtual closet 5000 pixels off your page. Now, in IE6, this has no side effects aside from minor headaches and male pregnancy, but in Firefox and other browsers, when you click your button, you get a little box that shoots off your page in a desperate attempt to rescue your forsaken text link. In order to cut this attempt off at the knees, we use the overflow: hidden; property. Nifty, no?

The next block defines the action that occurs when the mouse is placed over the button. Well, technically, the "link" (or "a" tag) that we have so previously, futurely, and precisely defined with a width and a height and a display: block; property. Basically, this definition says that when you mouse over the "link", the background disappears! Viola! Cello! Trombone!

I forgot to mention that in all the previous blocks, we still hadn't defined anything specific to our one button. This is so any buttons you create within this "div" and unordered list inherit the same properties without further coding. Now, to the button specific code:

#mouse-off { width: 187px; background: transparent url(../images/btn-demo.gif) no-repeat 0 -54px; } #mouse-off a { background: transparent url(../images/btn-demo.gif) no-repeat 0 0; }

First, you are setting the width for this individual button. If all your buttons are the same width, you can set this property in the #nav li definition. Usually, this is not the case, so I'm providing you with the more common occurrence because I'm good like that. Next, you are defining the background unique to this button, which in our case is the image with two buttons posted above. Remember that #mouse-off is the id attribute for our "li" tag, so this first block of code is describing the "li", not the "a". Notice how I set the position of the image to 0 -54px. This sets the "li" background to that of the mice, which we hope to see only on mouseover.

In the next block of code, all we're doing is shifting the position of the background image to the upper-left-most corner which starts the initial image we want the users to see before mouseover. Remember, we set the a:hover class to remove our background, so when someone moves their mouse over the button, this background disappears and the only thing they see is baby mice!

Here's the finished product (NOTE: I had to modify some of the names above to avoid conflict with my existing CSS structure, but everything else is the same):

Mouse Off!
Go ahead, you know you want to.

One last thing: If you want to repeat this effect with more buttons, all you have to do is add more "li" tags with id's and their respective element definitions in the CSS.

So there you have it! Easy as pie, cake, or even piecakes. Sure this was a long post and it seems like it took you forever to get here, but if you look back at the simplicity of the code, you'll realize that most of this post was superfluous BS and me trying to be funny. Enjoy, and I hope this helps you with your future buttoning endeavors.

Lessons To Live By

2006-06-26T09:28:00.000-04:00

It's Monday! You know what that means...

Andy writes:

...[O]ver the spring term I took an intro to web design class and www.sleeptech.biz was my final project. The business is my father in law's sleep lab. I know I did lots of things wrong, I plan on re-doing the site in the future, but for now mock me and tell me what I can inprove on for when I do find time to redesign it.

One thing I know already sucks is the buttons on the left on some of the pages expand out. I have no clue why this is so since they are in tables.

Anyway, be honest...I can take it!

This site is funny to me for a few reasons. First, a guy in my graduating class back in the day used to work for a company like this, and he got fired for both "gross incompetence" and "criminal negligence." He later was rehired for more money than he was initially making because he was the only person with the necessary qualifications for the job. Later he quit after they gave him a bonus and went to live in South America and then Colorado bumming everything off people. The second reason is because I think that RLS, or Restless Leg Syndrome is a funny name for a disease. C'mon, aren't there any Latin words you could have used? Resticus Legulus Syndrome, or something.

Anyways, to the site review. If this is your first site, I must congratulate you, because it's not terrible. It's not great, either, but all things considered, good job. You get your message across, the site isn't a complete mess, and hell, if you changed all your ID tags to single tokens (aka, "ContactUs" vs. "Contact Us") and fixed a few other minor things, your code would even validate as XHTML. Structurally the site is solid, meaning your architecture is navigable and logical.

Whoa, whoa, you didn't think that was it did you? I have to butter you up before I can flip you over, put cheese on you, and grill you (and then dip you in tomato soup. Delicious). While your effort is a commendable cherry-popping, you still have much to learn, Daniel-son.

Lesson 1: Metadata
You have zero metadata. You must come up with keywords that match the words you wish to deem important. These keywords will be unique to each page, since not all words will be included on each page. If you want "sleep apnea" to be a keyword on a page, you must include it in both your content somewhere on said page and in the keywords. The correct documentation for adding keywords is <meta name="keywords" content="keywords, go here, make sure, they, match your page" /> and include them within your <head> tag. Also, come up with unique page descriptions, which also belong in the <head> tag. The documentation is the same as above, but change the "name" attribute to say "description." Lastly, and probably most importantly, come up with a unique title for each page, make it very descriptive, but keep it short. Search engines are like doctors and bibliophiles: they love titles.

Lesson 2: Design
If there were one phrase I could use to sum up this design, it would be "wasted space." You have about 300 pixels at the top of every page (aka, prime real estate) that you do pretty much nothing with. There's something we folks in the biz call "the fold." The eponym is from newspaper; the context is stories that appear "above the fold" were considered to be most important and most likely to sell papers, because a lot of the time, it's all people would see as they walked by the newspaper machines. In the world of the internet, this thinking is very transferrable, but the definition of the fold is the point at which people must first scroll down. When people get to your site, most of the time they will not venture down or in, so you must include as much important/cool stuff in the top portion of your homepage as you can.

While this doesn't apply as much to your homepage, since you have no fold (which is good), you still have a lot of nothing at the top of your page (which is bad). The design is very 90's Frontpage, and by god, those buttons are horrendous. Later in the week I will do a tutorial on how to make image rollovers using only CSS. I suggest you take heed. The reason your buttons expand is because they're in a table that is not separate from your main body table. To keep them from expanding, put them in their own table inside a <td>, kind of like a wrapper <td>, and then set your valign attribute to "top". Of course, I would always recommend you don't use tables at all and use CSS, because of semantics, code- bloat reduction, ease of use, etc., but if you must use tables, that's how I would do it.

Lesson 3: Use CSS
Okay, this is kind of like Lesson 2.1, but it's important enough that you learn it now before you dive head-first into a pool of pain with no floaties, because in this pool of pain, CSS is your floaties. Right now, if you wanted to change something, like the width of the box that contains the main content, you'll have dip down into every page and fix it. While you do have a stylesheet, it's not nearly extensive enough. You have not completely separated your design from your content via CSS (metaphor extension: "float above your pages with CSS!"), which is something you must learn to do. While it may seem hard using a table layout, you still need to try. I would also suggest learning the concept of "div layout structure." It'll take a bit, since you're used to table design (I was a tabler, too, back in the day), but once you get the hang of it, you'll be amazed at how flexible it is, and how much extra work you were having to do with tables. Everyone knows that tables sink in pools of pain.

I like your "self-test" form. It has informed (pun so intended) that I show symptoms of insomnia, which doesn't surprise me. Maybe I should stop futzing on the computer like an hour or so before I go to bed so I can get some sleep at night. Although, it could be my sub-neighbors bumping 100 gigawatt speakers until all hours of the night.

I wanted to write your summary in an e.e. cummings style, but stupid blogger won't allow me to add extra spaces, so here's your summary in a limerick:

There once was a guy from Iowa,
To make a sleep website he was trying ta,
It was his first shot,
The design sucks a lot,
But put some metadata on your pages so search engines can find you and learn CSS so you don't have to update every freakin table any time you want to make a change in your website meaning you won't be kept up by lucubrations but rather insomnia (which your dad can help you with).

The Phlogary Prototype

2006-06-23T09:36:00.000-04:00

Tom, mother of http://www.marilyncarolyn.com, writes:

Really enjoy your blog. You may need to start another one just to deal with my site.

Thanks, and you may be right.

Even though I work in IT, I am totally self-taught when it comes to web design. I started a simple site five years ago with the goal of finding out what happened to every member of my kindergarten class. However, I have been constantly under construction since then (like the Winchester Mystery House), and I now have hundreds of pages of crap with no organization whatsover behind it....

I have only a rudimentary knowledge of HTML, and can basically add text, pictures, and set up links, but that is about it. I will admit that anything fancier than that I have "borrowed" and adapted from other sites along the way. I am not expacting a miracle, but would like some simple suggestions to organize and clean up my site.

Oh, boy...where to begin? Well, I suppose the first thing I need to do is challenge myself to make this review as long or longer than the screen shot of your homepage, which, if you couldn't tell, is about 10 screens too long.

I am supposing that you don't really care about the "professional" look, as you're not really selling anything, just sucking on to your little section of the underbelly of the internet whaleshark. In terms of design, I must say that this has to be one of the cleanest of the messiest sites I've seen. While there is crap everywhere, it's orderly crap, and it actually has a bit of a photo-albumy feel to it.

I've read a bunch of your stories, and the site content and pictures are interesting. I think the best way for you to get more people to stick around and read them, though, is to organize it better. This can be acheived by grouping like stories together and providing the user with some sort of navigation, ie "Car, Concerts, Random Crap" etc. Then go ahead and put these like files in directories. It should help organize you a bit. Remember that if you do end up putting files in directories, all your links will need to change accordingly.

Another observation I've made is that it appears that this site started as a site with a focused mission (reunite your kindergarten buddies, to their delight or chagrin) and gradually evolved into a blog-esque photo diary, which I will hereby dub a phlogary. If you drop that word in casual conversation, let me know. The problem is, you can't decide which you want to do, the kindergarten reuniting or the phlogary, and honestly, you need to pick one. Since you already have marilyncarolyn.com as your domain name, keep this site for solely that and create a new site for you, and then link the two (prominently, if you want). Keeping the two in the same domain is just a bit too confusing.

I think that your site shall become the phlogary prototype, and all those aspiring to create their own phlogaries should look at your site first (after you clean it up and organize it a bit, of course). This is one of those sites where, even though the coding sucks, and the design sucks, the concept and the content are so great that these fallacies are overshadowed. Not everyone is a professional nor can everyone have a professional site, especially if it's your own personal site and you don't give a damn what other people think of the design. This site, in terms of design (not content), reminds me of Maddux's site, which is poor on that end, but people don't seem to mind, as he gets a five-digit number of hits almost daily.

While I could suggest that you redesign the site, it appears as though it has gone past the point of no return without spending an inordinate amount of time on it, due to the lack of templating or CSS and the three million pages that would require updating. Also, the design (or lack thereof) doesn't really detract from the content, as I found myself clicking on more pictures and continuing to read more stories, although some navigation elements would help some. Hitting the back button to navigate through a site can get annoying.

Anyways, moral of the story is, content is king. If you've got something that people want to see, they'll keep coming back.

A summary, in haiku:

Organization
For your phlogary is key
Keep shooting, writing

Do It For The Kids

2006-06-22T09:48:00.000-04:00

<prologue content="gratuitous">
So I woke up this morning three minutes before my alarm went off (the most annoying thing ever), scratched myself, checked the stats for this site, and noticed a ridiculous spike in hits. Then I checked my email and saw that Anthony (see previous post) posted this site on digg.com. Thanks, man!

Yeah, I made an account and dug my own site. I got a little excited, okay?
</prologue>

And now...

Lisa, world-saving webmaster of http://www.littleworksusa.com writes:

Is it possible to get my site evaluated? I will be doing some minor modifications on the code to ensure it is 100% valid next week.

Lisa, one thing my dad always told me is anything is possible. However, after belligerently insisting that he drink all the water in the world without swallowing an octopus, I was promptly grounded. So, on to your very evaluatively-possible site.

First, I respect your eleemosynary intents with your site. I hope that this site sends some business your way so that your charity can be helped. Second, thank you for providing me with the opportunity to pedantically and publicly display my knowledge of how to use the word eleemosynary. Moving on...

One of the first things I noticed with your site is that your homepage is pretty much a "gateway" page to the rest of your site. While you do have some content on this page, generally I wouldn't recommend going about it like this. Instead, try to put as much information (ie, content) relevant to your site as you can possibly fit within good design constraints and without making old people go blind. Also, on your homepage should be links to other areas of your site. This helps with search engine spidering, since your content (aside from your prominent privacy statement) is currently at least two clicks away, making it three levels deep. Spiders can be lazy sometimes, so you want to provide them the least path of resistance in getting to your content.

Your homepage design is clean, albeit not too exciting. You've got a pretty good color palette set up, in my opinion, and you can probably do a lot using the theme from your home page. I do like the rotating image at the bottom. But you have to do more with your homepage, because I can pretty much guarantee that you're losing visitors who don't see anywhere else to go but your privacy statement and some magical place called "Inside."

So what is this wondrous land of Inside? Well, it is a relatively unformatted playground for animated .gifs and over- and undersized columns. The first thing you see upon being granted entry to Inside is two pictures with purple boxes around them smack in the center of the page. There are two reasons I would get rid of the purple border:

Purple (and that shade, specifically) is the default color for visited links, making me think for some reason that I have already seen the content to which these pictures link. It was not until closer inspection that I discovered that this purple border is actually part of the image, and not a link-visited-status indicator. If you want an example of what I'm talking about, look at your "subscribe" button image.
Because it looks like the border around a picture from it being an image link, it looks very amateurish. In CSS, you can prevent this border from appearing around pictures like so: img { border: none; }, or you could simply put a border="0" attribute in your <img> tag.

In regard to your columns (and we're talking strictly the column sizes themselves), your left column is okay, since it is your navigation, but your middle and right columns are grossly mis-sized. Do you see how much real estate you waste in your middle column? You could be putting content in that space that people would read if they made it past your homepage. This space grows depending on the user's lust for screen size and resolution.

I know many people are proponents of liquid layouts, and there are times to use them, but when you don't have enough content to fill one out, you might want to think about fixing your widths, especially if you're not changing your content all that often. Your right column, while aiding the illusion of symmetry by being the same width as the left column, is choking your largest chunk of content. From left to right: keep, shrink and fix, expand.

Okay, what's next. Ah, yes. Design. Lisa Pisa, you gotta do something about it. African art (and just the theme of Africa) is so cool that making a design based on it should be pretty easy. Maybe you don't have a graphic editor like Photoshop, but like I've said before, there are plenty of freebies out there you could download and use.

Right now, I hate to say it, but your site is simply visually unappealing and confusing to navigate. In your left column, I don't know what are links and what is text without mousing over everything. It just seems like you threw this site together in a hurry to get these cards on the internet. Believe me, both you and your customers would be better served if you sat down and really worked on a cohesive, intelligent design.

Get rid of your animated .gifs. Lord, how I hate them. They pull your eye away from what you really want your visitors to see, which is your content.

Which brings me to the next item—content. You don't have any! Aside from your smushed right column and your "About the Cards" page, your site is virtually devoid of content. Where are the textual descriptions of each card, the history behind the site, or anything else you can talk about that people (and search engines) might be interested in? Write something!

I'll leave your code alone for now, since you are endeavoring to fix it, so my last bit will be on your "shopping" area. Unfortunately, your site is a prototype for why it is wrong to purchase third-party vendor shopping cart applications, and it's not all your fault. Usually, these apps are very inflexible when it comes to design, and they are more about "getting the job done," which seems to be the case with your cart. Sure, people can buy from your site, but will they?

When they click the "Go SHOPPING" link on your main site, they are nightmarishly ripped from their care-free playland of Inside and violently thrown into the Matrix construct program where you happen to be selling stuff. Ironically enough, (Warning: movie reference) people are just as disoriented and unwilling to accept the truth upon entering your shopping area. Although, Keanu would probably be more likely to understand if Laurence Fishburn would have told him that the truth was that he hadn't done enough to save the African children and that he should buy one of your cards.

Like I said, this isn't entirely your fault, but if I were you, I'd do a bit more research on my shopping cart vendor before I settled on one. Like I tell my clients, having a lot of solid content (in your case, products) is great and 100% necessary, but if you have a crappy design, no one will take you seriously as a professional and will most likely not purchase from you.

Now, in keeping with yesterday's popular theme, a summary in tanka:

Lands in Africa
And the sad, hungry children
Will benefit if
You redesign your website
And add a lot more content

Readers: purchase these postcards to aid this cause!

Political Websites and Poetry

2006-06-21T11:32:00.000-04:00

This webmaster's review has come just in time for Independence Day...

Anthony, creator of http://www.republicanoffensive.org, writes:

I'm building this site for my brother. It's the first site that i've work on,and I don't know what to add to it to make it look more appealing.

Note to readers: Don't worry, I will not use this review as a soapbox for my political views. I promise to maintain objectivity and remain non-partisan. I mean, unbiased.

Anthony. Where to begin? How about with the good (as I usually do). Your coding is relatively neat and tentatively validates (meaning you're missing some metadata for the validator), although it appears you still have some inline styles and a few too many span tags. However, I don't know how many classes you really need with such little formatting. But we'll get to that in a second. Okay, more good. Hmm...your navigation is very clear and not confusing, always a plus.

Well, that's that. Bad stuff time.

Design: you have none. You want a way to improve your site? Normally I say start with content, but I personally dislike people who try to impose their political views (or any views, for that matter) on others regardless of whether I agree with them or not, so I'd say start with design. Right now it looks like a 12-year-old found Frontpage on his computer and decided to create a website between nap and snacktime. If you don't have Photoshop, there are plenty of cheap and/or free graphic editing programs out there. If you do have Photoshop, use it! Put some graphics in there. Make your site visually appealing! If you suck at design, well, see if you can get your brother to find someone to design for you. I'm sure he's got some connections.

Content: you have very little. You have essentially 10-15 paragraphs of content. The sites you're competing with for traffic have probably over 1000 times the amount of content you have. Literally. Assuming you get any traffic at all, do you think you're going to get any repeat visitors when you've only got two, maybe three "articles"? Maybe if you turned your whole site into your "my thoughts" section and used something like TypePad or Blogger, threw in even a modicum of design, and posted "your thoughts" every day, you would generate some traffic. Maybe.

Forums: get rid of them. Nothing looks worse than a site with empty forums. Maybe if you develop some sort of a following, you can put them back in, but I would wait until the site has been up for a while and people have been commenting. Assuming you give them some sort of interface with which to comment.

My summary, in five rhyming couplets:

While it seems like this is a short review,
I've actually given you a lot to do.

I understand this is your first site,
Which is why I'm helping you make it right.

Write more! Opine! Scathe! Vent!
Bash or support our president!

But if you want visitors to return,
Design and content should be your utmost concern.

Good luck and godspeed to you and your brother,
I hope I have helped you like I have the others.

More, More, More!

2006-06-20T11:45:00.000-04:00

The finger is a bit better today, and I can type relatively pain-free. I will attempt to keep it away from the lethal combination of ground and size 12 cleats.
Tony writes:

I am currently working on a site for the local private school. If possible, I would greatly appreciate some critique on the site. I am also having trouble trying to get it in Google. I used those things that submit your website to 200+ search engines, but all I got were a bunch of spam.

The site is available for viewing at http://www.stedschool.com

Tony, I've definitely got some helpful comments for you. But first, a few questions. Is this the official site for this school? If so, how robust do they want it to be? By the looks of it, it doesn't appear to be much more than a simple brochure. I can't imagine any other reason to visit this site other than to get directions to the school. I see there is a space for "Homework" where you will probably list assignments, but unless you have a sophisticated back-end, I don't see this being updated frequently enough for it to be useful.

Okay, onto the critique. We mentioned the homework page above, so let's start with that. "Under Construction" logo and/or text: always a no-no. Get rid of it immediately and replace it with some text explaining what the future use of the page will be. Optimally, the page will not be included at all until it is completed, but since it's already in your navigation, you might as well do something with it for the time being, "Under Construction" not being an option. It's amateurish and very annoying for users looking for something to read. Do you really want 1000 kids thinking their homework assignment is to dig a hole on in their front yard? Poor school secretary :)

Anyways, let's go to design. It's very simple, but not in the good way, unfortunately. It's far too simple to realistically be any school's official website. I understand you're in the process of building it, but there's no better time than before you really get into adding meat to the site to alter or enhance your design. Think about planning out what you want your site to include, like sections and subsections (also called "information architecture") and write this down. Then include some sort of clear sub-navigation for when users use the main navigation (not non-descript links at the bottom of the page). I know this paragraph started with design, but you can see how closely the two are intertwined.

More about design: do you really want your site to feature crayons? I understand it's a school for younger kids, but realize that those three crayons take up prime real estate on your page. Why not include pictures of some kids in the classroom, or a frontal shot of the school building (better than the one on your home page though. The lens flare is killing me). The horse logo is fine, as it represents your school.

Your page is confined to 600 pixels wide. This size is usually recommended for emails, but websites are recommended to be around 800 pixels wide. While there's not a lot going on in your site now, if there ever may be, you might find the 600 pixels to be a bit restrictive. Also, you've got to do something about the centered text. Use it in moderation, like for page titles and not much else. Something nitpicky I just noticed: your homepage main text area border is different than the border on every other page of your site.

Your code seems to be fine, as it validates, although it does appear that you have not completely separated your code from your design with CSS stylesheets. As for your content, though, it's a bit on the weak side. You really don't have much at all to say, and this could be a major reason why you're not getting traffic from search engines. In order for people to find you, you need to have something for them to search for. And yeah, submitting your site to "200 search engines" is always a bad idea. There are only three search engines that you need to worry about, Google, Yahoo!, and MSN, as they deliver over 90% of search engine traffic.

Summary: more design, more structure, more content.