February 14, 2007

Design Review – Orange County Choppers

Filed under: Design Review,Graphic Design,Web Design — HDW @ 3:40 pm

I’m a fan of American Chopper so I went to take a look at the Orange County Choppers website. Fairly impressive design, and very appropriate for the company, but I see some things worthy of a review, so here it is.

Orange County Choppers

Style:
Love the style. A dark, red and black design, it has the look and feel of some of their best bike designs. It’s a first class design, and I give them high points on style.

I particularly like how they’ve integrated bike images thoughout the design. Even if it’s subtle shots of custom painted tanks, or a little chrome, much of the imagery used in the site is images of the bikes they produce.

Nothing is left undesigned. Every detail seems to be designed to fit an extremely unified theme.

A little whimsy is always good. Photos of Paul Sr. and Paulie are very serious, but they throw in humorous photos of Mikey to break it up.

Structure:
It’s a fairly straight forward CSS layout. Should be reliably represented in the most recent versions of all major browsers. I was surprised to see that the CSS is embedded rather than linked. This would make in necessary to change each page to make global updates to the CSS. This seems like a mistake to me, but there may be a technical reason.

Load time is fairly reasonable at 25.25 seconds on DSL or 75.19 seconds on 56K modem. With all of the images they use, I’m surprised at how low this is.

The CSS in general is reasonable, but it could be done better. I see a lot of Class selectors in links for instance. This could be done in a more elegant fashion by defining different link styles for the different ID selectors being used to control the site layout. I wouldn’t rule out the use of Class selectors on links entirely, but I’d think I could get rid of most if not all of them.

There are places in the site where ID selectors are used multiple time in a page. This is an error, and the sort of thing that’s just not acceptable. Some minor changes to the CSS and it’s use in the site structure would eliminate this problem.

While the design is quite superior, the execution of the details of the site lack a little something. A lot of images lack Alt codes for instance, and a number of scripts types are left undefined. With the attention to detail in the design, the lack of follow through on the execution of the design surprises me. It may be that the site has been edited and added to by someone other than the designer since it was created. This would account for the attention to detail in some aspects, and the lack of attention in others.

One minor little annoyance that I saw was a nice little video that plays when you arrive at the home page. Annoying, not because I didn’t like it, but because even on my large monitor, it was below the fold. I heard the video playing, but couldn’t see anything until I went looking for it. Though it appeared to be an ad, it’s still poor placement choice. Anything auto-playing needs to be above the fold. The alternative I suppose, would be to keep it from auto-playing.

Content:
Bikes, bikes, bikes… and of course bike merchandise. Fantastic photos, good graphics, decent written content. There are also some very nice bike sale brochures available in PDF format. High marks to the graphic design who does their print design work. While I liked the PDF brochures, the ability to look at larger images of the sale bikes without downloading the PDFs would have been nice. High marks for content on the whole.

What I would change:
I’d change very little over all. The style is very well done, and I’d shy away from any changes there. Instead, I’d improve the execution of the existing design. Adding Alt tags to all images would improve the ability to search, and adding script types to scripts should improve their reliability across browsers and platforms.

I’d also make an effort to clean up the CSS as well as linking the pages to a remote CSS rather than embedding it. This would make global style changes to the site much easier. Updating the CSS to make better use of the ID and Class selects would also make updates easier.

Summary:
A very nicely designed site, that could use a little polish behind the scenes. Quality web design deserves quality execution of the design.

Trackposted to Perri Nelson’s Website, The Random Yak, Faultline USA, basil’s blog, Blue Star Chronicles, Stuck On Stupid, The Pink Flamingo, The Amboy Times, Cao’s Blog, Dumb Ox Daily News, Conservative Cat, Random Dream, and Pursuing Holiness, thanks to Linkfest Haven Deluxe.

February 2, 2007

Design Review – The Silent K

I’ve been meaning to do a review of The Silent K since it’s author asked me too an eon ago. See Krista, I didn’t forget. Since this is both a request, and a personal blog, my criteria for this review are slightly different than me previous reviews. A personal blog should reflect the style of the author. As in the professional or political blog, technical components are important, but style is comes more to the forefront in the personal blog. Krista’s style is in a word… colorful.

The Silent K

Style:
Krista describes herself as, among other things a “hobbyist, photographer, knitter, craftster“, and an “appreciator of aesthetics and art“. Her artistic nature is openly apparent in her blog. It’s theme may change with the season, or more often, but it’s always colorful. Her current theme is nicely done in blues and greens with a nice header image. One of the trademarks of her many themes is the great use of color and imagery in the headers.

  • Her use of color is skilled, she’s not afraid of bright colors, but they are always well balanced and thought out
  • Uses personal photography often and well
  • Layout and typography are very good, her site’s readability is always high – not an unimportant aspect of design
  • Good sense of whimsy in her themes – designers shouldn’t take themselves too seriously

Structure:
The Silent K is a WordPress blog which says good things about it’s long term stability. Load time is a bit high at 49.77 seconds on DSL or 162.05 seconds on 56K modem. Huffington Post’s was about half that. This longer time is likely mostly the result of pulling her photos from Flicker.com rather than her own domain.

The coding of the site could use a little improvement, but there is nothing that would put the site or the RSS feeds in any jeopardy. Most of the code issues I see are the result of incorporating widgets and so forth into the sidebar. They can be temperamental, as they’re often coded in the “one size fits all, but nobody well” theory of design.

Content:
Krista writes about art, knitting and other crafts, a little about blogging, and a lot about life. Often humorous, she’s always entertaining.

What I would change:
Krista is an artist, and a graphic designer in the process of becoming. I’m hesitant to suggest much here, I’m more interested in seeing where she goes next. As I’ve written about before, and designer needs to know their tools. Krista needs to continue to learn, and continue to grow as an artist and designer.

Summary:
Web design is artistic talent mixed with technical knowledge and skills. It can be hard to balance those two divergent directions when you’re learning. The Silent K is a very nice blog by someone trying to do just that. I can’t see her design doing anything but improving as her technical skills grow to match her artistic vision. Good luck Krista.

Trackposted to Outside the Beltway, Perri Nelson’s Website, Is It Just Me?, The Random Yak, Adam’s Blog, basil’s blog, Shadowscope, Thought Alarm, Cao’s Blog, The Bullwinkle Blog, The Amboy Times, Phastidio.net, Conservative Cat, Sujet- Celebrities, Diary of the Mad Pigeon, Faultline USA, third world county, Right Celebrity, The HILL Chronicles, Woman Honor Thyself, stikNstein… has no mercy, Pirate’s Cove, Renaissance Blogger, and The Pink Flamingo, thanks to Linkfest Haven Deluxe.

January 23, 2007

Design Review – Earl Emerson dot com

Filed under: Design Review,Web Design — HDW @ 12:18 pm

I’ve been doing a lot of reading lately. I thought I’d take a look at the website of one of my favorite authors, Earl Emerson. A real disappointment. He’s an incredible author, but his website is doing him a disservice.

Earl Emerson dot com

Style:
My biggest problem with the style of the site is that it is both dated, and inappropriate for the author.

From the construction of the site, I think the dated nature of the site is caused by the fact that it has not been updated in quite some time. The web is an ever changing place, and a site that was cutting edge yesterday will be old hat tomorrow. The website is a 90′s retro looking site with a gray and blue color palette. While this may have been somewhat appropriate in the 90′s when it was probably designed, times have changed. It’s aged look makes it look out of date before you even check the content.

I think it’s an inappropriate style in that it doesn’t reflect the style of the author’s writing. None of his books would look good with a dust jacket in this style. I can see designing a site to reflect his latest book, or possible his latest series of books, but a site that doesn’t reflect any of them is a poor choice in my opinion.

The site’s style and color palette are also not very flattering to the cover images of Mr. Emerson’s books. The high quality design employed on Mr. Emerson’s book covers looks out of place when displayed on a site like this.

Structure:
The structure of the site is a little odd. While there is likely a reason for it, I’m not sure what that reason could be. It is, at it’s base, a table based layout. The table based layout is however, inside a series of frames. The only benefit of this frame system seems to be to allow the Emerson site to pull the pages from another site where they are hosted. This may be a cost cutting solution of some kind, but in this era of low cost hosting, I don’t really see the point.

The code used in these pages is dated and I’d be concerned that it would not accurately be displayed in all browsers. While it did load in both IE and Firefox, it had a tendency to stop part way through loading. This partial page display tendency was fairly annoying, as the navigation bar seemed to be the most likely not to load.

Content:
The content of the site consists mostly of schedules for book signings, and book summaries. While this is a valid site format for an author, it needs to be kept up to date. The book summary section of this site is not complete, and the book signing schedule is out of date.

The alternative to this type of content would be to focus on content that is not time specific. Removing the time specific content and focusing on book summaries for instance. They can be added over time, and never really go out of date.

What I would change:
This is another site that I would start over from the ground up. Some of the content is perfectly fine, but the site structure and design needs to be completely stripped out and replaced.

Since a new site structure is in order, I’d recommend, as I usually do, a completely CSS based layout. The benefit of CSS in this case is that it would easily allow for design changes and updates site-wide, while leaving the existing content in place. With this sort of structure the site could easily be stylistically changed with each new book.

I like the idea of having the book signings, new book premiers, and other appearance dates available. I would update this section into a more easily updated format. Including an RSS feed with section to let interested people know of updates would be a good addition as well.

The book summaries are a nice section too, it just needs to be finished. While it might be understandable to not have the newest book available, missing the older books isn’t. This section needs to be updated, and kept up to date.

The author’s bio section could also stand to be updated. Like the rest of the site, this section contains dated information. While it was perfectly appropriate when it was put up, it has become outdated since. I’d recommend that it either be updated regularly, or replaced with timeless style biography.

Summary:
This site suffers mostly from neglect. It has been designed to be updated frequently, but that’s not what’s happening. It needs to be redesigned, and kept up to date. The alternative is to take it down entirely. In my opinion, not having a website is a better solution than what is currently being used.

Trackposted to Outside the Beltway, Perri Nelson’s Website, Mark My Words, The Random Yak, Adam’s Blog, Big Dog’s Weblog, basil’s blog, DragonLady’s World, Shadowscope, Common Folk Using Common Sense, The Bullwinkle Blog, The Amboy Times, Conservative Cat, Pursuing Holiness, third world county, stikNstein… has no mercy, The Crazy Rants of Samantha Burns, Blue Star Chronicles, Pirate’s Cove, Constitution Matters, Planck’s Constant, The Pink Flamingo, Gulf Coast Hurricane Tracker, Dumb Ox Daily News, Right Voices, and Gone Hollywood, thanks to Linkfest Haven Deluxe.

January 22, 2007

Wow, that sucks

Filed under: Design Review,Graphic Design,Web Design — HDW @ 10:31 am

I’m occasionally critical of websites whose design I think is poor or inappropriate… but I’ve never reviewed anything like these. Go take a look at the10 worst web design techniques featured on Web Pages that Suck in 2006.

Caution: may induce nausea, headaches, and/or vomiting. If you are sick, hung over, or prone to seizures you will want to skip this.

January 11, 2007

Design Review – The Huffington Post

It’s time in the Design Review series to take a look at another of the big dogs of the blog world, The Huffington Post. This mega blog reaches “more than 2 million monthly visitors“.

Huffington Post

Style:
The Huffington post uses mostly green and white color palette, with a little orange thrown in to spice things up a little. The green tones used work well with the layout, but the orange links aren’t so flattering. While they do make the links highly visible, which is good, I can’t help but think another color would do the job better.

The Huffington home page uses a single major headline, then splits the page into a three column layout similar to Drudge Report. (Not a flattering comparison) Unlike Drudge, Huffington’s page is image rich, sporting 43 images and 4 iframes as of this post. Combine that with numerous other graphical elements, such as vertical column lines, headline underlines, and story separator lines, and it makes it a little cluttered.

Going to the Blog section of the Huffington Post is better, but a bit of a mixed blessing. It changes to a fairly nice two column layout which is an distinct improvement, but it adds advertising in the header, the top of the sidebar, and in the main content column which I find annoying. When I started this review, the ads all three of those locations were active ads with pulsing color and flashing text. Very annoying. I realize advertising is good for websites, but a little restraint would be good, not everything needs to be blinking at the same time.

Huffington Post

Negative, or white space is another area where this site has issues. There’s a lot of it, which is good, but it’s use is a little erratic. The right edge of the blog column for instance is quite large. but the text wraps tightly around advertising for instance. The home page too suffers from a lack of consistent use of negative space. Columns are too tight to each other, but stories are nicely spaced. The headline area could actually stand to be tightened up a little, it pushes the main content down the page a little further than I would suggest.

I really like the Quick Read feature they’re using on the home page. It pops up a small excerpt from a story when clicked on, letting you choose to view the whole story if you’d like. A clever idea, well executed.

Structure:
This is a Movable Type based site which should have a nice CSS based layout. Should is the key word there. Oddly, it incorporates a mix of tables and CSS. This is not something I would recommend. I believe a straight CSS layout would be a better choice. A straight table layout would be a lesser choice, but I could see why it would be done. Mixing the two has never seemed like a good idea to me. The results are often inconsistent, and that’s the case here. Most people probably don’t notice, but the navigation bar doesn’t track with the rest of the page in Internet Explorer 7. (It might be the case in version 6 too, but I don’t currently have a working version of that.) In effect, the navigation bar is acting as if it’s left aligned on smaller window sizes in IE7. Once the window enlarges enough to center the bar, it remains centered. Since it is the only element acting this way, it shifts out of alignment as the window size decreases.

Load time is reasonable with 25.11 seconds on DSL or 80.64 seconds on 56K modem. Surprisingly good for a site with a lot of images. Small image size balanced against the high number of images probably accounts for this.

I found the CSS is a little lacking. Not as complete as it should be, and structured a little oddly. Now different web designers lay this out differently, but this seems a little… haphazard. The site uses several style sheets, which I thought was a nice touch, but also uses a fair amount of embedded CSS, which confuses me. Why set everything up with linking style sheets, then embed half of the CSS? A waste of time and effort. If will make the site harder to maintain, and increase the chance of having different appearances on various pages.

Content:
The content of The Huffington Post is more or less what I expected. A lot of writing, all of it on more or less from the same political perspective. This site leans slightly farther left politically than the Anti-Idiotarian Rottweiler leans right. That’s a long ways. Like most group blogs where the writers share a political viewpoint, this site has become more extreme than most of it’s contributors would have been on their own.

What I would change:
Tone down the advertising in some way. Less animation, or less advertising in general. Three different animated ads above the fold on one page is too much. It’s eye strain waiting to happen.

Clean up the home page, starting with bringing more content above the fold.

Consider some significant structural changes. The mixed table/CSS structure would be replaced by an all CSS layout that would reliable show up in all modern browsers. No more sliding Navigation Bar.

Finish the CSS. It needs to be complete, and linked. The embedded CSS needs to be removed and incorporated into the site wide CSS structure.

Consider slight changes to the color palette. More green, less orange. Consider alternatives to the orange link color. A different shade of orange might be enough.

Clean up the negative space issues. Nice consistent use of white space is one of the keys to readability. This site is currently too inconsistent in it’s negative space use.

Summary:
What should be a nice web site design on a very stable platform. While the platform seems to be working, the design isn’t. Minor modifications to visible styles would make a large improvement. Switching to an all CSS site structure would make a large improvement in cross platform performance. IE would look like Opera and Firefox. My one word summery: disappointing. For how much money Ms. Huffington planned to raise to bring this site to life, it should be something spectacular. It’s more of a yawn.

Trackposted to Outside the Beltway, Perri Nelson’s Website, The Random Yak, Big Dog’s Weblog, Right Truth, basil’s blog, Stuck On Stupid, Conservative Cat, Pursuing Holiness, Rightwing Guy, The HILL Chronicles, stikNstein… has no mercy, Pirate’s Cove, The Pink Flamingo, Dumb Ox News, Right Voices, and Gone Hollywood, thanks to Linkfest Haven Deluxe.

January 3, 2007

Blog Review – Google Blog

The Official Google Blog is of course a Blogger.com site. Google uses the site to announce new products, upgrades, and how-to information. According to their own statistics, they received: “More for the numerically inclined: 7.6 million unique visitors generated nearly 15 million pageviews this year.”

Google Blog

Style:
Google Blog, how I hate you… Let me count the ways:

  1. Undefined link color
  2. Poor layout
  3. Poor ad placement (self promotion no less)
  4. An overly small header which is overpowered by the sidebar
  5. Poor use of color (none)
  6. Did I mention poor layout?

I realize that they have a distinct style on their search engine pages, but this isn’t Google.com. This is a unique site which could have a distinct style of it’s own. It should have a distinct style of it’s own, but it doesn’t.

The only trace of color on the site is in the trademark Google logo, and the default blue links. They have carefully stripped away anything that might have given this site visual interest. Black text on a white background. (Yawn) Undefined link color. A simplistic header overpowered by a simple sidebar. Once again, someone has confused lack of style with design neutrality. This site should have been something fantastic, a credit to the forward looking company behind it. It isn’t.

A short list of the good web design aspects of the site:

  1. It uses a fluid layout

Did I say it was a short list?

Structure:
The Google Blog is a Blogger based site with the simplest of templates. It doesn’t even have a valid HTML Doctype declaration.

According to HTML standards, each HTML document requires a document type declaration. The “DOCTYPE” begins the HTML document and tells a validator which version of HTML to use in checking the document’s syntax. – Web Design Group

While I normally cut sites a break when their advertiser’s code is poorly written, I won’t here. I won’t, because it’s Google’s own code that’s poorly written. Their own advertisements use invalid, and poorly written code. I’m sure that there’s some obscure coding reason that they do it, but it’s annoying. People try to put together good, well written sites, and they have to put up with the gibberish that Google puts in their ads. It could be done better.

Content:
The Google blog is used to announce new products, upgrades, and how-to information for Google.com, and it’s associated sites. More or less a the public face to a public company.

What I would change:
What a subject, what I would change… Simply? Everything! Dump the whole design and start over.

The header needs to be much stronger, the logo larger.

The sidebar needs to be pushed down in prominence.

For a company known for it’s colorful logo, let’s see some color in its’ blog. Add some color to the header, and the sidebar. Consider some simple graphical elements to differentiate posts. This should be able to be done with little or no decrease in load time.

Consider the priorities for the sidebar. The first three quarters of the sidebar is taken up with links promoting other Google sites, let’s give this site some space. Leave the search feature high up, but give the archives some space too. Bring the blogroll up too. Give one good ad priority up high, and push most of the other promotional links down the page.

Define the color scheme of the links. If you want the site to have blue links, define it as blue links. Give it a distinct and clearly defined color scheme. Currently link color is left to fall to individual user’s default settings, and that’s just silly. My default settings made visited links all but illegible, and I doubt I’m the only one.

Summary:
This is a poorly designed blog, not because of the way it was designed, but because for the way it wasn’t designed. There’s nothing wrong with minimalistic design, but it needs to be designed. This is a poor representative of what otherwise appears to be a very good company. No other aspect of the Google empire has been left undesigned and neglected like this site. It’s time that this was remedied. I won’t hold my breath.

Trackposted to Rightwing Guy, Wake Up America, The Random Yak, The HILL Chronicles, Dumb Ox News, Conservative Cat, and Right Voices, thanks to Linkfest Haven Deluxe.

December 29, 2006

About High Desert Wanderer

High Desert Wanderer

After 630 odd posts, it might seem an odd time to do an “about me” post, but it’s been on my to-do list since I lost my Blogger profile in the transition to WordPress.

I’m a professional graphic and web designer currently working in SW Virginia. I’ve been doing graphic design for print almost fourteen years. Web design became a major part of my work two and a half years ago.

I grew up in a very small town, one of fifteen in my high school class. My family has a strong belief in the value of an education, with a large percentage of them being teachers, doctors, or artists. I was undecided on which path to take and ended up studying both Fine Art.

Graphic design, as you can tell from the subtitle on this blog (it currently reads “Random mutterings of a wandering cowboy turned graphic designer”) wasn’t my first career choice. My first job, when I was 14, was working with cattle from horseback. I loved it. I had every intention of spending my life working with horses… Time passes, things change.

I found I had to reevaluate my choices when, in my mid-twenties, I was preparing to get married. Breaking horses, as I’d been doing since my late teens, just wasn’t a viable profession any more. I’d had three concussions, a back injury, various torn ligaments, and some bones in my foot fused already and retirement wasn’t exactly looming near. I started looking for another career. Something that would allow me to merge my education with my passion for art. I lucked upon a graphic design job with someone who liked to train his own designers. He recognized in me something I didn’t see myself, the designer. It was a fantastic stroke of luck, and I’ll be forever grateful for his training.

I’m not by nature a talkative type, my wife would tell you that I act like I have a lifetime quota on words and I’m trying not to run out too early. I do however, like to say what I think. I took up blogging because I have almost exclusively worked where I was one of few if not the only, designer. Blogging not only allows me a place to speak my mind, but also allows me to be a part of a community of people who have similar interests. While I’m often the lone designer at work, I’m one among many online. This is something that I’ve found that I appreciate.

While I make an effort to focus on design and design related subjects, I’m afraid that I often wander off topic. You’ll notice for instance, that I veer into discussing politics on regular basis. Bare with me, and I come back to discussing graphic and web design before too long.

I’m a problem solver by nature, I’m fascinated by almost any sort of puzzle. Trouble shooting design problems is a particular pleasure for me. I often find myself giving people unsolicited advice on how to fix problems on their sites that they aren’t even aware of. I’ve recently started a series on Design Review to take advantage of that. This series is intended to give people a look into how a designer sees design.

My restless nature, and my wife’s career choices, have moved us around the country in the last decade. From my native Washington, I’ve worked in Idaho, Maryland and now Virginia. I’ve designed things varying from newspaper ads to cookbooks and furniture. I find print design the most interesting, though the technical challenge of web design has a strong appeal as well. I’ve enjoyed the the journey, I’ve enjoyed each place I’ve lived. While I’d like to find a place to settle down, another move is being considered as I write this. Where next? I don’t know yet, maybe the Midwest. We’ll see where this road leads.

Consider this post to be guest book of sorts. If you’re reading this, drop me a comment. Let me know who you are, and where you’re from. I’m always interested in seeing who stops by.

December 28, 2006

Design Review – Anti-Idiotarian Rottweiler

I was feeling pretty good this morning, so I thought I’d risk life and limb today and review the Anti-Idiotarian Rottweiler. According to Google Analytics, they have 6,380,170 hits as of this post.

Anti-Idiotarian Rottweiler

Style:
Love it or hate it, the Anti-Idiotarian Rottweiler has a distinct style. Strongly black and red, with content in white columns, it incorporates a fluid three column layout on the home page, with two columns on interior pages. While the content columns float free of a containing background in a manner that I criticized Argghhh! for in my last review, it works here. The solid background and fluid layout act as the container, giving it the grounded look I thought was needed at Argghhh!.

The use of color is well done, with a strong black background and red used liberally as an accent. (The only liberal aspect you’re likely to find on this site.) Gray blockquotes with red outlines nicely compliment this simple color scheme. The links are blue, which manages to be clearly visible without being overpowering.

Graphics are well done in a very unified theme.

Structure:
The Anti-Idiotarian Rottweiler is a WordPress site with an entirely CSS layout. The site structure is well done and should be represented well in any modern browser. Load time is high with 48.94 seconds on DSL or 157.08 seconds on 56K modem. This is quite high by blog standards and should be improved upon. A lot of the load time is caused by the high number of images. There were 72 images on the homepage when I tested it.

The CSS is well thought out and complete, though it could use a little clean up work. It has a some non-standard coding that should be fixed or removed.

While the site structure is good, the WordPress theme could use some minor updates. A quick validation check of the home page shows no true errors, but 442 warnings. Most of them are insignificant, but should be easy to fix too. A site with this level of traffic should really have this fixed. Most of them seem to be minor bits of extraneous code which could be easily removed from the base PHP of the theme. There is also some misuse of the CSS element ID which should be fixed. The ID element is used to describe a unique element which can occur once on a page, but is being used multiple times here.

While most if not all of the questionable code I’m seeing is not in the posts themselves, I’m concerned that it may affect RSS feeds and possibly the long term stability of the site. Without correction, what should be minor changes to the CSS or PHP could have much more dramatic effects than intended. The theme’s PHP and CSS should be carefully checked and cleaned of offending and extraneous bits.

Content:
It is politically off the charts to the right and pulls no punches. The authors’ vocabulary of obscene and profane language is vast and well used. This site doesn’t tolerate idiots of any stripe. While its authors will openly mock and ridicule anyone they feel is less than honest or sincere about their beliefs and/or politics, they are reasonably tolerant of polite disagreement. That said, their commenters are not always so polite.

What would I change:
I’d update the PHP to remove extraneous code.

I’d lower the number of images and optimize their use in an effort to decrease load time. Some improvement should be possible with little or no effect on the overall style.

I’d make minor changes to the CSS to make it more closely meet modern standards.

I’d add High Desert Wanderer to the blogroll, because… it appears to be tragically missing.

Summary:
While the Anti-Idiotarian Rottweiler has a very distinct style, minor changes should be made to images, CSS and PHP in order improve load time and to make it more closely meet modern web standards.

As I said before, the Anti-Idiotarian Rottweiler has a distinct style. By intention or accident, a unique and very marketable brand has been created here. Great care should be taken to maintain this style while improvements are being made.

December 19, 2006

Design Review – Argghhh!

Filed under: Blog Design,Design Review,Web Design — HDW @ 9:33 am

Time has come for a review of Argghhh! The Home Of Two Of Jonah’s Military Guys… Generally try to avoid criticizing heavily armed people, but John and Company at Argghhh! are a good bunch. They are currently averaging 1,519 hits per day.

Argghhh!

Style:
At first glance Argghhh! appears to be disorganized and cluttered. This first impression isn’t entirely unfounded. It does have a unique and distinct style though. This style is created by a mixture of military and military inspired colors and images.

The cluttered appearance is caused by two things:

  • The first is the sidebars, which are a little too narrow for their content. The use of outlines around all sidebar content items exaggerates this problem.
  • The second is the lack of a unified background linking the two sidebars with the content column. While there is a background image, this camouflage pattern showing between the columns leaves all three columns floating and visually unanchored.

The use of color and imagery to give a military air to the site is well done.

I like the use of the rotating images in the header. It gives each of the primary bloggers a chance to have their header in place. It’s a nice touch.

Structure:
Argghhh! has an entirely CSS layout. It’s CSS is a little simpler than I might have done, but I wouldn’t consider that a negative. The CSS and site structure are more than adequate and should reliably present the site in any modern browser. Load time is high with 55.14 seconds on DSL or 179.13 seconds on 56K modem. This is quite long by blog standards and should be improved upon. A lot of the load time is caused by non-optimized images and images loading from other locations.

The site could use some updating however. Mostly small changes to the templates and CSS to make things load a little smoother. The site is using some depracated code, and would be better served with some updates.

Content:
The content is what you’d expect from a group of intelligent and well spoken ex-military guys. Their writing is about the military and subjects of interest to those who are or have been in the military. Due mostly to quality writing and humor, and despite it’s obvious military theme, this site appeals to a wide range of people. It is a great source of military history, thought, and opinion.

What would I change:
I’d update the structure to make it more compliant with current web standards. A site with this much traffic needs to work well.

I’d optimize images in an effort to decrease load time. I’d also bring as many images as possible that are loading from remote sites into this site. This should also lower load time.

Alter sidebar images, or the sidebars themselves in an effort to keep contents from overlapping outside of the sidebars.

Remove all or most of the outlines on objects within the sidebars in an effort to give them a more organized and structured appearance.

Make some minor changes to the sidebar styles in order to improve their usability.

Add a unifying background between columns. This will ground the columns and give the site a more unified and organized appearance.

Make some small improvements to the CSS in an effort to accentuate the current style. The style is interesting and very appropriate for the site, but could be better. I’d make it more of what it is, not something different.

I’d look into improving the performance of the rotating header images. Possibly with identical function, possibly with something slightly different. I’m not sure if it would be beneficial, but it’s worth considering if I could maintain or improve function while improving load time.

I’d add High Desert Wanderer to the Argghhh! blogroll, because… I could. Hey, if we’re considering hypothetical changes, why skimp?

Summary:
Argghhh! is a site with an interesting style and quality content. It could though, stand some structural and stylistic improvements. Load time is unnecessarily high and needs to be improved upon. The thing to keep in mind is that this is a functioning site. It may not be the best looking, but it already has good traffic. Any improvements should focus on improving function while maintaining and improving the current style. Care should be taken not to sacrifice current function for future improvement.

December 17, 2006

Why Design

Why should you regularly review the design and structure of your site? Because presentation is very important. I see sites on a regular basis that have serious flaws. Flaws with structure, flaws with RSS, images, etc. These flaws will keep the authors from getting their message, whatever it is, to at least some of the people who want to see it. Consider RSS feeds. If you have readers on your site that view the site via RSS, and your RSS doesn’t reliably work, some of those people will stop reading.

The point of this Design Review series is to make people think about design and site structure. A website is like a person giving a presentation. Presentation effects a readers perception of the validity of the message. You make a poor presentation, people won’t be interested and won’t believe in you. Some of them might not even hear or understand the message at all.

So, consider your design. Does it fit you? Does it reflect who you are and the message you’d like to pass on? Does your site reliably work in all common browser? Do your RSS feeds work properly? All these things should be reviewed regularly to make sure your presentation is what you want it to be.

Update:
If you don’t think presentation is important, consider what would you think a fairly good presentation given by a woman in a very nice business suit. Now consider the same presentation given by a man in hiking boots, argyle socks, and a poorly fitting cocktail dress. Presentation does make a difference.

December 12, 2006

Design Review – One Source Graphics

Filed under: Design Review,Web Design — HDW @ 5:58 pm

I took suggestions for my Design Review series. One brave gentleman who asked me to review his site is Tony Mack of One Source Graphics. My original thought on this series was to critique mostly high traffic blogs and commercial sites. These are intentionally sites where my criticism would have no harmful impact. They are a safe sounding board for my ideas and opinions on design. Mr. Mack’s site doesn’t fall into either of those categories, so I’m cutting him a little slack. I’m letting him see my review ahead of time and giving him the opportunity to address issues if he chooses. After he’s had a chance to make corrections, I’m going to review his site again. With that in mind, here’s the preliminary review.

http://www.onesourcegraphics.org

Style:
In a general sense, the style of the site isn’t bad. This is a site who’s purpose is to sell design services though, so it needs to be held to a higher standard. In execution, this site falls short of that higher standard. I’ll start with the basics.

The background image is a repeating square pattern. Now I really like repeating pattern backgrounds, but this one doesn’t work in the context it’s being used. It’s distracting, and makes text difficult to read. Most of the text on this site needs to be put on a solid color background in a color that contrasts. That doesn’t mean it has to be black text on a white background, but that is a good example.

Graphic elements fall short of the standard I’d set for a design site as well. In his portfolio section Mr. Mack shows the talent at Flash and PhotoShop that should be visible here, but isn’t. This site is a portfolio and should reflect that.

Undefined links are a pet peeve of mine. Link styles on this site are left undefined. This leaves color and style of links left up to the default settings of the browser. This is an aspect of style that can greatly affect the style and appearance of a site. It needs to be defined.

Structure:
This is mostly an HTML based site with a table layout. It uses no CSS. Load time is reasonable with 12.76 seconds on DSL or 41.65 seconds on 56K modem.

Navigation is an issue here. It has both top and bottom navigation. The only bottom navigation I can see using is to repeat the top navigation if the normal page length is quite long. Someone who comes to the site isn’t necessarily going to see the bottom navigation. They cold potentially miss an important link because they don’t realize there is a lower navigation bar.

Content:
Mr. mack’s content is a mixed bag. Design related pages have good content which is a plus on this sort of site. He explains what he can do in a clear and concise manner. He also has some news related content which I think is inappropriate for a design site. It is dynamic content which will attract search engines and traffic, but it’s not the kind of traffic he wants. It’s very unlikely to bring in business.

What needs to be changed:
The number one thing that needs to be changed is Mr. Macks perspective of his site. This site is a portfolio. Keep the design related content, maybe even add to it. Remove the extraneous content. This isn’t where I’m going to go for news about Lindsay Lohan, so don’t offer it.

Put the main content on a solid background. Make the text a nicely contrasting color. Make sure that the link color and styles are defined in a way that compliments your site. Do not leave link styles undefined.

Add graphic elements. This is your place to shine. They don’t need to be complex, they can be subtle, but they must be there. Quality design is in the details.

Do a validation check your site. It doesn’t have to be perfect, but it should be very close.

Seriously consider changing it to a CSS based site. Table layout and FONT tags work, but they send the message that you’re a little behind the times. I’d use an external CSS file so that the site has a tightly unified style. Having only one CSS file would also seriously improve your ability to make global design changes.

A little flash wouldn’t hurt either, but I’d keep it to a minimum. Clients should know that it’s an option.

Clean up the navigation. There should be a logical sequence of pages. I should be able to find where I want to go from the first page. That doesn’t mean everything needs to be accessible from there, but that I should be able to move in the right direction from the first click. Click and pray navigation is a big no-no. Yours isn’t that bad, but it needs to be better.

To sum up this site in one word: underachiever. It has potential, but it isn’t living up to it. It has content that should work, but lack of focus is keeping it from serving it’s purpose. It’s functional and utilitarian where elegance is called for. Mr. Mack can do better, and this is the time and place to see it.

Design Review – TomDeLay.com

Filed under: Blog Design,Blogging,Design Review,Web Design,WordPress — HDW @ 10:17 am

I’m not going to take the time for a full review of Tom DeLay.com, it’s just not worth my time, but I thought I’d point out a couple of problems.

TomDelay.com

Problem 1 – Boring!
The site has very little visual interest. The only graphic element in the design is a poorly done header image containing a picture of Tom DeLay. Yawn. If you don’t want to take the time to do something interesting, stick with a default template of some kind. Then at least we’ll know you don’t care.

Problem 2 – Comments
What I found objectionable about the comments is that there isn’t a single blogger’s URL showing anywhere. The only way to find out if the commenter is a blogger is to click on their name and go to a second page on the site which tells you if they left a URL. Annoying, and a little misleading. Showing a blogger’s URL is a simple way of putting the comments in the context of their other writing. By putting them one step away from the comments, you are removing this context.

In my experience, bloggers make up a significant percentage of commenters. Here though, I only managed to find two bloggers, William Teach and Becky, who left their URLs. It seems unlikely that all these are all people without blogs. Something odd is going on there. Either they’re being filtered (a note at the bottom of the comment page suggested this might be the case) or there is something odd about the way the site is functioning that is filtering out most of the URLs. Either way, the comments do not appear to be working as they should.

Problem 3 – Links
Far and away the biggest problem I see is the links in the content section of the blog. They’re hidden. Even in the small image I’ve placed above, the links should be at least partially visible. Sure you couldn’t read the text at that size, but the links should be bold, or italic, or colored. Anything to make them stand out from the regular text. They don’t stand out though. The text style of links is identical to the rest of the text unless you hover your mouse over a link. The image above contains three links in those first few paragraphs, but you’d have to hunt to find them.

The content links also have a flaw that’s a pet peeve of mine. Links are regular weight when there is no mouse over, but bold weight when hovered over. This causes the text to move whenever a link is “found”. Scroll your mouse down the page and each link passed over will make the text move. You might want to take Dramamine before you try that.

Summary:
This is a poorly designed site with little visual interest. The comment section is of questionable value, with commenter’s URLs placed one step away or missing. The link styles are horribly done. They are difficult to find inline and cause the text to shift in an annoying way when found. Everyone should strive to set an example. Unfortunately, TomDeLay.com is striving to be a bad example.

h/t to Raising Farrahzona » A Blog Roll I Will Never Be On for pointing out the site. I’d heard it existed, but hadn’t seen it yet.

December 6, 2006

Design Review – Hot Air

Staying with the “starting from the top” theme, my second design review subject is Michelle Malkin’s Internet broadcast site, Hot Air. A powerhouse conservative blog which is currently averaging 67,917 hits per day.

HotAir.com

Style:
The content packed layout was designed by The Blog Studio with a minimalist color scheme. It is a clean black and white design, with a moderate use of gray and some red highlights. Prominent advertising does not compete with content.

The overall style of the blog really quite good. The whimsical use of graphics and the Cox & Forkum logo in particular are well suited to the writing style of the blog.

The details of the site were not overlooked. The typography is well done, and a careful use of negative space makes the text flow nicely.

On a negative note, the blockquotes crowd their contained text on the top and bottom of each quote in the blog posts which I find a little annoying. They also crowd the left edge of the quotes in the comments, which I find more annoying. Both of those aspects are more a matter of personal taste than anything though. The CSS in general is actually fairly elegant.

Structure:
This WordPress powered site is a completely CSS layout as you’d expect. The structural framework appears very solid, and any modern browser would reliably represent it. Load time is high with 39.86 seconds on DSL or 127.88 seconds on 56K modem.This is a little more than twice as long as my site’s current theme which has a 17 second load time on DSL. This bandwidth drain is mostly caused by the high level of graphics. When I tested the load time, HotAir’s home page contained 66 images.

There is a little sloppy coding to clean up, but it seems to be almost exclusively related to advertising. This is an extremely minor point that would be very unlikely to affect anything. The blog posting code is very clean as are the resulting RSS feeds.

Content:
Content is a Conservative mix of politics and humor. It is graphically rich and updated frequently. In addition to the writing, three or four episodes of Vent, a Michelle Malkin vlog, are posted weekly.

Content is well presented in a clear and uncrowded layout. Very nice use of negative space with the blog posts.

What would I change:
The first thing I would try to change would be the load time. A difficult task that I’m not sure I would have much success with. This site is built around it’s use of graphics and the resulting load time would be difficult to improve upon. The load time definitely does not warrant changing the site style.

I’d make an attempt to clean up the advertisers code too, but this also could be futile. Small corrections are likely possible, but not all will be correctable. This is more annoying than anything. As a perfectionist at heart, I’d like things like this to be perfect, but it isn’t likely to happen any time soon.

Final summary:
This is a clever design, beautifully executed. It’s one of the best blog designs I’ve seen in terms of crafting the design to suit both the purpose and the authors. Well built, well organized, and just a touch of whimsy.

December 5, 2006

Design Review – Daily Kos

Filed under: Blog Design,Blogging,Design Review,Web Design — HDW @ 2:36 pm

Nothing like starting from the top, so my first review is going to be Daily Kos. Daily Kos is the 600 pound gorilla of blogs, currently averaging 432,000 hits a day.

DailyKos.com

Style:
The overall design is simple, using a very clean orange on white color scheme. Simple isn’t a criticism, it’s just not a graphically complex site. Graphics can be a huge bandwidth drain if done wrong or excessively.

The layout is a little cluttered. Mostly by an entire row of advertising as well as the traditional row of links. It does have a style switcher which allows for a wider version of the site, but the width difference is minimal. The switcher is a nice idea, but the execution of it isn’t what it should be.

The Daily Kos logo isn’t really to my taste, but it’s well designed and executed. It works well with the site.

The CSS is well thought out and quite detailed. I particularly like how the smaller details were handled. The blockquotes are nice and clearly differentiated, and the section breaks are good as well. The difference between good CSS and great CSS is in the details, and this one is very good. Overall I give the CSS great marks, it’s a credit to whoever wrote it.

Structure:
This CSS designed site is powered by Scoop. It has a good structural framework. It should reliably work on any modern browser. Load time is a very reasonable 8.85 seconds on DSL or 27.08 seconds on 56K modem. This is almost twice as fast as my site’s current theme which has a 17 second load time on DSL. Quality servers would likely be a factor there, but Kos’ very streamlined design is a factor as well.

I’d give Daily Kos negative marks for it’s random sloppy coding, but that appears to be almost exclusively in the advertising and posting rather than the basic structure of the site. Mr. Moulitsas should slap the hands of a few of his authors and that would be cleaned up. I suspect that a few of the authors are writing their posts in Microsoft Word and pasting it into their posts. That tends to add some odd and sloppy coding. No really significant errors that I can see.

Content:
Mr. Moulitsas runs a tight ship. While I don’t care for the writing, the content is well presented.

The site organization is reasonably good. I would think that most traffic doesn’t pass far beyond the front page, but links elsewhere are clearly marked.

What would I change:
While I can see why Mr. Moulitsas dedicates so much space to his advertisers (this is his livelihood after all) I’d try to come up with another option. I would reevaluate the placement of ads with an eye towards increasing the footprint of content. Thigns I would consider would be:

  • Alternating ads with links in a single row sidebar
  • Small horizontal ads between posts
  • Fewer ads – a poor choice, but increased demand could increase costs to compensate for the reduced number

Any of these options would allow me to dedicate more space to the content which is key to readership.

I would also consider making it a flexible width site so that readers with higher resolution monitors can benefit from it. Adding a minimum width to the CSS would keep the site from compressing too much in smaller windows. There are javascript options for min-width as well.

I would crack down on the poor coding of some of the authors. While I am not familiar with the a href=”http://scoop.kuro5hin.org/”>Scoop platform, any reliable platform should produce reasonably clean code. The sloppiness I’m seeing in the posting is likely coming from an outside source like MS Word. Either that or some of the authors are not as familiar with XHTML as they think they are. This is of course an extremely minor point, but these little coding errors add up, and can cause problems down the road. I’d be most concerned with the coding errors effects on the RSS feeds which are much less forgiving than the traditional site.

Any alterations I would make to correct these issues would be designed to add to the site’s current style rather than altering it. The site’s current style is fairly good, and very appropriate for a high traffic site. Clarifying the current style by subtly, or not so subtly, altering the site’s current layout. Sacrificing the content for advertising space isn’t where to go. Without content, you have no site. Let the style and the content take their place in the forefront where they belong.

This site’s style doesn’t need to be redesigned, but redefined. One of the side effects of a redefining the style would be to increase the prominence of the Daily Kos logo and signature style. This could have beneficial effects on logo recognition and overall branding efforts. While this wouldn’t guarantee increases in merchandise sales, it sure wouldn’t hurt them.

To summarize, it is a good overall design that is structurally well executed. Stylistically, the encroaching advertising has started to take over the layout. Clarifying the design would be a good idea.

December 4, 2006

Now for something completely different

I should have started this sooner, but better late than never. Design Reviews. I’ll focus on website design primarily, but we’ll see where it goes. Since I’m rarely called humble, I thought I’d start right at the top. Starting in the next day or two I’ll be doing design reviews of some of the more popular blogs. Don’t have a popular site? Don’t think you’re safe, because I’ll be going there too. Reviews will cover these areas:

  • Style - A straight judgment on appearance. Good, bad, or dear God what happened here.
  • Structure – Regardless of style, does the site have good bones.
  • Content – Quality of content, regardless of subject.
  • What would I change – Criticism, (hopefully constructive) on what’s wrong, what’s right, and how I’d improve it.
  • Review topics are of course, subject to change.

If you have a site that you want reviewed, feel free to make suggestions. If you don’t want your site reviewed… I’ll accept cash, check, and most major credit cards.

This was one of the original concepts behind this blog, but it’s something I’ve never felt ready to start. I’d like to thank Mr. Guzman for kicking me into gear with a post on this subject a few months ago. I’m not linking because his site (samguzman.com?) doesn’t currently seem to be online. If this changes, please let me know and I’ll link to you properly.

« Previous Page