Lessons To Live By
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.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.
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!
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).
4 Comments:
Hey man thanks a lot for the review. I appreciate the input. Some of the things you mentioned I had planned on doing when I redo the site. When I started the site I was sort of fumbling my way through it, and teaching myself how to use Dreamweaver at the same time. Later on in the process I realised a few things that I could have done differently with the program, like the buttons and CSS positioning and layers rather then tables.
Live and learn. Thanks again!
You stated: "But put some metadata on your pages so search engines can find you ..."
Since the late/mid-1990's the majority of search engines, mainly the ones anyone would care about being found on, ignore META keywords. Yahoo! and Google take note of META keywords, and display them from time to time in the abstract/snippet on search result pages - but it does not help in terms of rankings.
One thing you will notice is that just because it is highlighted on a search results page - doesn't mean it helped in your ranking. ;)
This is not saying folks cannot include a few META keywords on their pages - just that, in terms of search engines, those words will, for the most part, be ignored (outside of a couple smaller search engines that state they will ban or penalize pages that are over-zealous on keyword density/repitition in the META keywords).
You wrote: "Lastly, and probably most importantly, come up with a unique title for each page, make it very descriptive, but keep it short."
Very true - and I would add to keep the primary/important words in the first 60 to 70 characters (including spaces) if a page happens to have a longer title (say of 150 or so characters). Again, just because something is highlighted in the search result page listing - doesn't always mean it "counted" or "helped" in the ranking thoughts. Just like a word in the middle of a one-word domain name (composed of 3 words) and the middle 'word' is highlighted - didn't count but some may think it did ...
Due to how search engines handle META information - less is best (if opting to share a META keywords and-or description at all, that is).
Carol wrote: "Yahoo! and Google take note of META keywords, and display them from time to time in the abstract/snippet on search result pages - doesn't mean it helped in your ranking."
Typo corrected, the above should read "Yahoo! and Google take note of META description, and display them from time to time in the abstract/snippet on search result pages - doesn't mean it helped in your ranking."
hay cool I have narcolepsy and sleep apnea... hmmm maybe thats not too cool. Ah well just drink heavy and I'll never remember it ;)
Post a Comment
<< Home