Stunslinger.com Blog

I’ve been sitting in a classroom every Monday for the last 11 months, and I always look at this poster.  It bugs me.  The more I read about good design, especially using a grid approach, the more this poster stood out to me as a paragon of bad design.

I don’t even really know what the information is, but it definitely is not presented in the most understandable manner possible.  I know the information is blurred, I took the picture with my phone, but I really think it’s for the best.  This way you can look at just the presentation and marvel in it’s chaos.

I’ve been looking into manipulating Wordpress as a content management system, as I’ve posted about in the past.  Anyway, it’s making more sense now to me, and I thought I’d give you all some links to articles that helped me.

Scriptygoddess - Above the Fold  Scriptygoddess talks about how she manipulated Wordpress with php to make her ecommerce site.

Bloghelper - Wordpress for a Portfolio Site  The first of a series of articles focusing on using Wordpress as the backend for a portfolio of sorts.

Chris J Davis - WP Theming Secrets  This series of articles deals with some basics, like using custom templates as well as some more advanced techniques.  Written for WP 1.5, but many concepts are still applicable.

Wordpress for a News/Magazine Site  While I have not tried to run a news magazine site, and the example isn’t really a huge variation on traditional blogs, there are some useful concepts here.

Nick Smit - Thumbnail Hack   I didn’t know I needed this until recently.  I’m building a portfolio site, and couldn’t understand why it wasn’t generating thumbnails for pictures I was uploading.  Found out what to hack by reading this article.  Excellent.

Hopefully these articles will help you on your journey.  If you’re at all like me, immerse yourself in articles like these enough and it will slowly come to you.  Good luck.

I’ve been working on a redesign of a website, and I was reminded of how much of a pain in the neck CSS can be at times. Most things are simple to me now, I just get it. But sometimes I’m mystified and pull my hair out.

For example, the site I’m working on has three main vertical sections (head, content, footer). Now, I had to add two extra divs immediately before and after the content for a graphical effect (yes, I hate doing this, but I couldn’t figure out how to get the look without them). Inside the head section is an h1, where I used the text-indent trick to replace the text with a background image. Everything looked fine until I added a margin to the top of the h1 (since I want it spaced down from the top of the page). I guess it was actually once I added 50px of margin…all of a sudden the next div (the “top” of my graphical effect) moves down. Even though I specified the height of the head div. Argh. After trying one or two things, I found that adding any border to the head div solved the problem. Yep, even though I added a 1px border to the top of it, it held the div to it’s specified size.

So everything’s fine, right? Wrong! It’s been eating away at me all day at work. Just hanging out in the back of my mind: What is causing this? I develop in Firefox because I’m not supposed to have these problems (assuming my code is valid). And I did realize I need to validate my code…but still, there’s not much XHTML there in the first place. Sigh.

But you know what? When I figure it out, I’ll be the happiest person alive. That’s the curse of the programmer, I think. It’s the most frustrating and rewarding thing. I spend my day working with people, which is nebulous and inexact, and then I escape at night into my computer world, where everything is logical supposed to be logical.

Update: I realized I had to float the h1 to properly place the logo, and this cleared up the problem.  No more border hack!

As the title says, I have a love-hate relationship with programming.  Ever since I first started programming C++ years ago, my life has been plagued by minutiae.  There’s nothing quite like spending an hour trying to figure out why things aren’t working right, just to find a misplaced semicolon or misspelled variable name.

Tonight I had this issue, while sorting through a website I’m building with Wordpress as a CMS.  I used my own template to render a portfolio, and once I had the basic XHTML in place, I tried to add a CSS file.  Seems like a simple task, one I’ve done multiple times.

I’m working to implement frameworks in my work, so I fired up my reset and tabbed-navigation CSS files and saw….nothing.  WHAT?!  Usually when something like this happens, it means I added an extra “/” at the beginning, and it’s looking outside the folder where my CSS is.  No luck.  So then I viewed the CSS using the Web Developer extension in Firefox.  Instead of CSS, I saw XHTML.  Ok, now I’m confused.

Finally I gave in and used the Wordpress default: style.css.  I used their function to get the location of the CSS.  And it worked.  But I wasn’t happy.  Then I got up to get a snack and it hit me: I forgot to add the wp-content/themes/theme-name part to the filename.  How could I forget that!?  Well, I guess it is because I’m not used to building Wordpress sites, so I don’t have to worry about their folder structure.

But at the same time…it’s so rewarding when it works right!  This is why I spend my days working with people, in comparison to computers, they’re easy!

Wow, apparently I’ve been away for a while. I just realized it’s been over a week since my last post. I’ve been spending all of my time researching Wordpress as a CMS yet again, and I finally get it. I’m currently working on my first site with Wordpress as the backend, and I’m very pleased with the results. I’ll post later with more details.

On the Mac front, I just finally purchased a license for TextMate. I must say I really like this editor. It definitely speeds up my coding, and all the things I read about it when I was using a PC are true. Bliss.

I hope I haven’t lost too many readers during this time of radio silence. Here’s hoping a week away from the blog will have given me enough fresh ideas to bring my old readers back, and maybe even gain a few new ones.

I thought about naming this post “</radio silence>”, but then I thought that might reveal a bit too much of my inner geek.

That’s right, I know you’ve all been waiting to find out what’s going on in my world when it comes to a good CMS system.

When last I checked in, I was raving about Expression Engine, and I still think it’s an impressive system.  However, it costs a bit more than I’d like to charge clients, and I really don’t need all of the features in it.  But it is incredibly flexible, and powers some amazing sites.

Now I’ve discovered CMS from Scratch.  It seems quite simple, and yet it does exactly what I want it to.  I haven’t built a site with it yet, but I feel just from watching the tutorial video I have a good idea how I can implement it quickly and effectively.  I will still keep Expression Engine in my pocket for those advanced sites with major ecommerce or big needs, but a majority of my websites are not in that category.  Not to mention it’s a good bit cheaper (GBP 100 versus $299 US).  Plus, it’s from the guys behind Web Design From Scratch, which is a resource I respect.

If you happen to be a longtime reader, you may remember my back and forth opinions about using Wordpress as a content management system (CMS).  After deciding it was too much of a square peg to fit the round hole, I gave up on the idea of using a pre-built CMS.  I had spent time looking through other open source CMS systems, and found them lacking.  They may do fine for some designers, but the way I think about a CMS just doesn’t fit with their structures.

So I thought I was stuck creating my own CMS for each project as it comes along.  But then two commercial CMSes came to my attention, and I think I’ve found happiness as a designer.  The first I found was recommended by a friend while snowboarding, Expanse.  Expanse is laid out very simply, and I can absolutely see setting a client down in front of it and having them be able to use it with relative ease.  It has a templating system that allows you to generate your own code (as valid as you want it to be) and insert content with template tags.  Excellent.  I don’t like convoluted systems where I specify in the CMS what template should show what content: I want a CMS to manage my content and I’ll worry about the presentation.  And, for a commercial CMS this is great, they only charge $29.99 per site license, and 10% goes to a charity of your choice.  So, you may be asking, why doesn’t this article end as a “go Expanse, it’s the greatest thing since sliced bread” post?  Simply because I cannot purchase a license.  Their website currently has registration disabled, and the owners have not responded to three emails I sent them begging to be allowed into the club.  I guess I look funny enough that I’m relegated to standing in the cold watching the happy, shiny people the bouncer already knows walking right in.  Suh-weet.

So then I stumbled across Expression Engine through a great article by Jesse Bennett-Chamberlain on his redesign of their website.  After seeing some great sites run on Expression Engine (like Veerle’s blog, 31Three, and Andy Detskas for starters) I decided to download the core version and try it out.  I must say, it didn’t all click right away, but I’m beginning to catch the fever.  It actually has a similar system to Expanse, but at this point it seems much more comprehensive and flexible.  It also costs a bit more: $99 for a personal license, $249 for a business license.  Expression Engine also has the ability to include ecommerce as a module, which Expanse doesn’t.
I always thought there needed to be “things” in addition to pages in a CMS.  So often on sites, I need to let the client create multiple instances of something (CDs for a discography, pictures/descriptions for a portfolio, etc) and I like to control these so the code is valid and semantic, and it’s easy for the client.  Yes, I could just give them a blank WYSIWYG space, and show them how to insert pictures, headings and lists and how to make sure they all line up right.  But why not give them separate lines to fill in this info, and then use those to generate lean code?  This is why I thought CMSes needed to let me define a “thing” (and I mean really define it, with my own fields) so the client can populate their pages listing “things” with ease.  Well, both of these CMS options do that and that made me happy.  I could not believe when I began learning Expression Engine that this weird concept I came up with, they already thought of and made it the core of their product.  Top notch.

Just for fun I looked through web design portfolios and galleries of well-styled websites.  Nearly every single site I saw featured tabbed navigation.  I remember the first time I came across the tutorial on Suckerfish drop-down tabs purely done through CSS.  It seemed like a great option for sites.  Somehow, tabbed nav went from another technique to “the new black” in web design.  Your site just wasn’t raved about unless it featured tabbed nav.

Before this, nearly every site seemed to have left-hand navigation.  In fact, I remember reading books on web usability that argued you shouldn’t try other forms of navigation because people expected nav on the left side, and doing anything else decreased usability.  Now, it’s become so rare, I am surprised when I see sites with “old-school” left-hand nav.  It’s as if, as soon as tabbed nav appeared, left-hand nav was seen as a design crime.  Usability discussions no longer talk about left-hand placement, now they talk about accommodating screen readers and other issues I think are actually more important than where the navigation is located.

So here’s the rub: I like tabbed navigation.  I notice my designs automatically start out with a nav bar somewhere near the top.  But I also don’t want to fall prey to forgetting older, still excellent, techniques in favor of the new.  So I say, use tabbed nav when it serves the design, but also consider left-hand nav…and even right-hand nav!  Maybe dead-center nav will work best for a design.  Maybe no nav.  I’m going to challenge myself to get outside the box of the current trends, join me won’t you?

I’ve been obsessed with the internets for quite some time now.  I remember when I logged in to a local BBS with my 2400 baud modem to port into this mystical “internet.”  At the time there really wasn’t much that interested me, but it seemed cool.  Then along came faster modems and the boom of the internet.  Suddenly I was writing HTML, all full of tables and nasty hacked code to make it look somewhat presentable.  Obviously a lot has changed since then.

The thing that struck me recently is the prevalence of blogging.  Ok, we all know everybody and their cat has a blog.  But beyond that, somewhere along the line static webpages seem to have lost their usefulness.

It used to be normal (partly because dynamic web pages were still difficult to implement) to have businesses update their sites every few months or once a year.  The site provided information, but there was really no reason to check back regularly.  Why would you?  The information was going to be the same.

Now it seems like every business webpage has a blog (and I’m not even touching on the trend of business blogging).  Even though they’re not often updated as often as personal/topic blogs, there is new content being generated on these pages.  There’s actually some reason to come back.

I even found a web design company that generates blog content for the sites they develop.  That’s right, if you hire them they have researchers who will generate a new, topical article for your site every month or whatever.  I really don’t know what I think about this.  On the one hand, it obviously is providing a useful service to clients.  On the other, if I’m going to a site for content related to their business, can’t they put the extra effort to provide their own content?  Why go to them if I’m just reading content written by trained monkeys in a building somewhere?  This is sort of like web designers whose websites are designed by other designers.  If you can’t design your own page, why should I hire you?!?

Anyway, I just realized it’s been a long time since I visited a site that was not blog oriented.  This reminds me, I need to rebuild my own portfolio site and maybe I should add some dynamic content.

I must quickly explain why I still have not rolled out my blog design (I refer to it not as a redesign, because this site is just using a template, so I haven’t yet made a design that could be redesigned).  After all, didn’t I claim it was near completion a month ago?  I decided to experiment with a different method to create this design.  Basically, I started by stripping out all the CSS and just building it “organically,” piece by piece.  I knew I had an overall idea of what I wanted, but I wanted to see what would happen if I didn’t have a visualized design before I started coding.

Well, it’s obvious this system didn’t work very well.  Basically I really liked my first few changes, but then ended up with a design that might be passable, but doesn’t really make me excited.  So I’ve been reading up about design theory and the process of designing websites and realized I need to create a design before I proceed any further.  I’ll be taking a number of things I really liked about my “organic” design and hopefully will tie everything together into a more cohesive whole.  This morning I sketched a thumbnail design of the site and like it better than what I’ve coded in the last couple months.

So tonight (or, realistically, soon) I’ll make a photoshop mockup and then get back to code.  So it’ll be a while.  But really, I always said I wanted the content to come first on my blog.  Maybe having a generic design has helped in that regard.