A friend/colleague sent me email recently, asking about programs for creating Web site graphics. Basically, he’s working on a low-budget labor-of-love Web site and needs something better than MS Paint. Don’t we all?

Sure, the pros use Photoshop and Fireworks, but the cost is steep and the learning curve is steeper. So what’s a weekend Web warrior to do?

My response:

Recently, I posted on Wordpress setups, and since then I’ve set up a couple of Joomla sites. Same problem — I have to remember all the steps. In the ongoing spirit of sharing, here’s the setup checklist but for Joomla this time.

I’m assuming you know how to set up a domain and install Joomla. If not, my recommendation is to use Bluehost and their Simplescripts automatic installer for Joomla. FYI, other hosts also have automatic installers, but some, such as GoDaddy’s, are hard to find.

1. After installing Joomla, log in to admin and set the global configurations, such as SEO URLs and session lifetime.
2. Install the basic components (“components,” “modules” or “plugins”). I use JCE (an advanced content editor), eXtplorer (file manager), JoomlaPack (backups), JForms (forms) and CQI (admin control panel icon manager).
3. Install any necessary components for the site. This might include Community Builder (memberships), JEvent (event calendars), Kunena (forums), or any of the gazillion other plugins found at the Joomla Extensions Directory.
4. Install the US English Language Pack, if needed (downloadable from the JED, FTP into the languages folder). The default Joomla language is English-GB, which is fine for most things. However, date and time display is the biggest difference.
5. Installing and/or customizing your templates is next, but you’ll need some content for testing. If you installed the sample content, skip ahead. If not, you’ll need to create some pages. (“Articles” in the Joomla parlance. Use Lorem Ipsum if needed as placeholder text.) At this time, it’s probably a good idea to create sections and categories, especially for News and Promos if you are using these categories to display latest news or promo items on the Home Page. Note: if you do use the sample data, remember to delete it all before you go live.
6. Now for the templates… There are a gazillion templates out there, some free and some not. Many of the commercial ones also include additional plugins and may have their own installers. Otherwise, you just FTP the entire template folder into the “templates” folder on your site, then enable that template in Admin > Extensions > Template Manager.
7. Customizing the templates is a multistep process and depends on the template. You’ll probably be uploading replacement images to the images folder for that template, and editing the CSS file(s), either through FTP or in the Template Manager. You might also be modifying the basic HTML through FTP or the template manager. Hint: to find out where the named template areas are, use http://yoursitename/index.php?tp=1
8. … hours later…
9. Set up any modules you’ll need, including turning off those that are not needed. I almost always add a custom footer, footer menu and sidebars at least for the Home Page. In addition, customize the settings for modules you’ll be keeping, such as the member login, breadcrumbs, main menu and any modules associated with components you’ve added.
10. Create menu items and organize them into submenus as needed. I try to do this all at once, since I otherwise seem to miss a menu item and have to add it later. If needed, use placeholder pages until the real thing is ready — just keep a checklist of missing items. I use “TBD” in any placeholder pages, then run a search for it before launch just to see if I’ve missed anything.

There’s more to do before the site is ready. Create the rest of the content, create and test forms, upload your membership lists, and — of course — testing, testing, testing. But the hard work of setting up Joomla is done.

In the past few months, I’ve been working a lot in Joomla and Wordpress content management systems for various clients. I’m not quite ready to call myself an expert (yet), but it’s getting to be that way.

Recently, a couple of my clients have either a) asked me to convert their current sites to a CMS, or b) asked me to add some extra feature to their static site that in my opinion might have been easier to do if their site were CMS-driven. So it got me thinking: what’s the difference? Why not make all Websites into CMS-driven sites?

The short answer is, pretty soon that’ll be the case. But we’re not quite there yet, and even when we are, the decision points will still apply (needs, timeline, and budget versus available features of each product or method). Both static HTML and CMS sites can use design/layout templates to easily manage the overall look and feel of the site. Both can work with scripting and programming code (although differently). Both can manage traditional content (text, photos, media, etc.) as well as more active items (slideshows, dynamically generated items, etc.)

So what’s the diff?

CMS Advantages and Disadvantages

• Back-end editing of content is entirely web-based – no separate licenses, nothing else to install.
• Most CMS products now work with plugins, which add specific functionality to the basic product. For many open-source CMS products including Joomla and Wordpress, hundreds of plugins are available. Some are very specific and others are vast and complex.
• Many cool features become available out of the box or with little programming with CMS systems. It varies, but in addition to Web-based editing, I’ve used: dynamic event calendars, slideshows, dynamic content (latest news), scheduled content (publish on or remove on dates), dynamic membership lists, featured stories, blogs, easy photo galleries, and more.
• Sites are fully dependent on the CMS that runs them. Inherent programming limitations of the CMS are yours to deal with. Your site content is probably woven into the CMS, making it much harder to get out if you change your Web site strategy. Likewise, when plugins are used to add specific functionality, the site becomes dependent on the quality and stability of each plugin.
• Upgrades to the CMS and all plugins must be considered. Will you always upgrade, only upgrade when there’s a critical security risk, or only perform major version upgrades? Remember that any upgrades can break things on your site, so plan for complete testing before and after every upgrade.
• The template system can be fairly rigid – your template defines the outer design elements of your page, while the CMS handles the content in the center. Works great for sites with consistent layouts, but it can be a problem if you occasionally need to break outside that template.
• Oftentimes, CMS products lean heavily on the site navigation; crosslinking between various pages on your site can be difficult, and if content is edited or moved, the other links usually break.
• You must plan your SEO strategy from the beginning: since many CMS URLs are not search engine friendly, newer CMS versions have SEO options available (rewriting the URLS and usually adding per-page meta/keyword options). These systems work pretty well as long as you plan for them.

All those extra features are cool… but they also add complexity. For simpler sites, you can do it all yourself, but you might also need to have a Web dude in your back pocket for those times when the simple stuff ends up not being so simple.

On the other hand, you can build a pretty awesome non-CMS Web site using HTML, Dreamweaver templates and CSS, custom coded scripts where needed to accomplish specific advanced functionality such as calendars and so on. Once built, with a little advanced training, you can manage it all through Dreamweaver and live a long and happy life. So while the CMS offers a number of advantages, I don’t think it’s (yet) the answer to all Web site needs.

Two separate customer service issues today… both drove me a little nuts.

Rant #1: Endless voice prompts. Called PayPal in regards to a transaction. After entering my account info, I get dumped into the voice prompting system — “you can say, ‘payments,’ ‘account issues,’ or ‘refunds.’”

Aha… I’ve been in this trap before, and I know to say, “agent.” But the automated voice is ready for me: “Ok. Before I transfer you, I need to know a little more about your request. You can say, ‘payments,’ ‘account issues,’ or ‘refunds.’”

You should have heard me, shouting “agent agent agent” into the phone. Then when I get connected, the agent says, “can you please verify your account info?”

You mean the account info I entered already, at the beginning of the phone call? I already entered it. Why are you asking for it again?

Dear PayPal agents (and all other call center agents): I’m sorry I sound angry when I’m calling. It’s not you. It’s your voice prompt system. It is not helpful. Bad start to a customer service contact.

Rant #2: Live Chat (Not Really). I had a quick question for Bluehost, my preferred Web hosting provider. So instead of calling, I thought I’d try the big LIVE CHAT button they have on their Home Page. It looks friendly, and I’ve used it before.

So I click on it and a window pops up, asking for the nature of my request. Of course none of the choices match my (really rather simple) question, and there’s no other option, so I choose the closest choice: Support, then the subcategory “Scripting Questions.” The box dynamically changes to request my name and question. So far, so good.

So I compose my question. It’s a simple one — basically a yes or no question about whether I can self-install something in the hosting account. So I figure I’ll just write it out and send, then get a short answer and be on my way.

Really? You let me write out the question, then refuse to answer it? If you’re dynamically updating the chat window, you could have hit me with this as soon as I chose the Scripting subcategory. I’d be less annoyed.

I actually had to call to get the answer. Five minutes on hold, 30 seconds with an agent.

Dear BlueHost agents (and all other call center agents): I’m sorry I sound angry when I’m calling. It’s not you. It’s your so-called live chat system. It is not helpful. Bad start to a customer service contact.

In my work as a consultant, it’s important for me to adjust to the speed of the client. If I go too fast, problems appear.

Sometimes I lose them in concepts that seem pretty basic to me, but are new to them. Then later, I have to back up and go over the concepts again. Or I assume that I know where we’re heading, start building technologies, and then get thrown a curveball.

That’s what happened yesterday. A client had been very excited about using a rotating background image on their new site (every page load would pull a new image from a gallery of 3-6 images). Although I’m generally not a fan of distracting backgrounds, we had discussed how to make it work, and it had been a feature of the design since the earliest discussions.

So I jumped ahead… and set up the effect in a Wordpress template (using a random image PHP effect added to the CSS, not a plugin). It took some research to find and test the effect, but it worked great.

Meantime, the client had been reviewing design samples that included one background image… and they like it. A lot, as it turns out. So now they want to just use the single background image.

No problem… I can easily remove the random effect. The new site is going to look great. The time I spent on the effect isn’t really wasted (it’s education — except that if I ever need that trick again, I won’t remember how I did it).

In this case, it wasn’t a huge problem… but it does illustrate the balance between being out front and getting too far ahead.

I hope I’m not being snarky here, but even the big guys have Web problems sometimes.

Here's the T-mobile Home Page. I tried to log in to my account.

Oops!

For those who care, the error is a Windows server error, probably from an asp.net application that they’re upgrading (or recently upgraded) and some essential bit of code is missing.

It happens, but we’ll see how long it takes for them to fix it.

Among the first things young photographers are told is get close to your subject and fill up the frame. Good advice for framing photos to hang on your wall, bad advice for Web/design usage.

The new rules, when shooting for general Web site usage: group your main subject, but shoot wider shots with plenty of photo material at the edges, and use your highest resolution with little compression.

With these rules, you’ll get photos with a lot of cropping flexibility. That way, depending on your design needs, you can shape the photo to fit. Here’s one example:

Here's the original image (from a visit to the San Diego Wild Animal Park, ©Brian Wold)

The giraffe is my main target, but with all that extra photo material to work with, I have choices.

A wide crop -- great for banners and header images

A tall crop -- for vertical pages or sidebars

A square crop -- like you learned in Photography 101. Useful for accent photos, inserting inside text-heavy articles, and hanging on your wall.

Even though you’re shooting wide shots, keep the main subject matter simple. At the low screen resolutions your Web site will be viewed with, coupled with the small pixel sizes you might use, detailed and complex photos will get lost. Also remember that in most cases you’ll be zooming way into the photo, so keep your focus as sharp as possible (use a tripod!).

I’m making a lot of Wordpress sites right now for small clients, and every time I set one up, I have to remember all the steps. So, this post has a selfish goal: I need to create a list anyway, and figured I might as well share.

I’m assuming you know how to set up a domain and install Wordpress. If not, my recommendation is to use Bluehost and their Simplescripts automatic installer for WP.I’m also assuming that this is a Web site, not a blog site (although you might have a blog in there somewhere).

1. After installing WP, log in to admin and set some basic variables…
   • Create a Posts page (new page, name it “posts,” no content inside it. This will be the Blog posts page.
   • Create a Home Page (new page, any name… although Home or Home Page makes sense).
   • Under Settings, adjust the title, tagline, timezone, etc.
   • Under Settings > Reading, set the Front Page to the Home Page you just created, and set the Posts page to “Posts.”
   • Set Permalinks to custom structure: /%postname%/
   • Set the Media settings as desired (I use 250/500/1024)
   • Change the default category name to “General” and the default link category name to “Links.”
   • Under Plugins, activate Akismet
2. If you know you’ll need plugins, now’s a good time to add them. I’ve been routinely using Contact Form 7, TinyMCE Advanced, and ShareThis.
3. Now for the templates (themes)… Under Appearance, click Add New Themes. I’m currently very keen on Suffusion, which has more options built in than most sites would ever need. However, I’ll be customizing further… and will not detail all that in this post (maybe in the future…) After activating Suffusion as the current theme, the settings are available as Suffusion Theme Options in the menu. I set width, basic colors, nav menu options and a bazillion more settings here, before going off to customize the stylesheet and site graphics.
4. … hours later…
5. If you’re using them, add and configure widgets.
6. In most cases, your pages would not include comments. You could set this at the bottom of each page when you’re editing, but WP by default includes text saying that comments are not allowed on this page. Annoying… so we make it go away. Click Appearance > Editor, then find Page Template (page.php). Click to edit, then look for “< ?php comments_template(); ?>” Since I never want comments on pages, I remove this line entirely.

There’s more to do before the site is ready. Create the rest of the pages, create contact forms, add image galleries, and test everything in various browsers. But the hard work of setting up WP is done, and the rest is more straightforward.

Your Home page is the most important page of your Web site, and not just because it’s by far the most visited. It’s where first impressions are formed (the oft-quoted “where am I and what can I do here?“). It must highlight your business goals, address customer needs, be interesting, have SEO content, and change regularly — all while seeming clean and simple. Hah — good luck with that.

Home pages take different forms, depending on the business and its needs. Recently, I needed to send some thoughts to a client about their Home page. I’ve generalized them here. It’s not complete, but it might get you thinking…

KEEP YOUR MAIN FOCUS: The old days of placing the boring-and-sterile Mission Statement on the Home page are (thankfully) gone. But site visitors still need to know where am I and what can I do here? It’s the absolute most important thing for your Home Page, and I can’t stress that importance enough. It’s easy to get too close to your own trees and forget that for many of your visitors, the Web site will be the first impression of your business. Clutter it up and watch them flee.

NEWS: One strategy for the Home Page is to use it for all news & promos — sort of like a news magazine. Whatever’s coming up that’s worth highlighting gets brought up front and center, with other news items (text and/or photos) placed below. So instead of on block of text, it’s a constantly-changing array of snippets… member news, promotions, events, etc. CMS products such as Wordpress and Joomla make it much easier to keep the ever-changing information up to date, so a Home Page like this is no longer such a full-time job. It will require an editor’s touch, though.

If your Home page becomes like a newsletter, then you might need to rethink the newsletter a little. On the other hand, some people need their news pushed to them, which a newsletter is better at doing. Make these tools complementary, not duplicates.

PROMOS: Some sites install a promo “slider” – which animates through several promos in one space. There are several scripts out there, and they’re pretty easy to set up… but they need to be kept current with new items. I usually recommend pre-creating several general items to haul out whenever there aren’t time-sensitive items to promote. I also recommend setting a schedule in advance to be sure your promotions are posted in advance of the events.

COMMUNITY: More and more sites are integrating their various social media activities, such as using feeds to bring in their Tweets, Facebook posts, etc, or incorporating public comments and discussions.

The grand idea is to convert the site from a one-way information provider to a two-way communication platform, where all (members or visitors) have a voice. In this case, the official organization news lives alongside submitted content, and many people can be creators of the content on the site. In practice, of course, a few people will be very active, while others will not participate at all. Some care must be taken to be sure the quality of the communication is preserved in cases like this.

A big change in all this is a move from static to active. Instead of this is how our site looks, it’s this is how our site looks… right now. In a few minutes or days or a week, it’ll be different. To really make that transformation work, you have to start thinking of your site as a fluid thing.

Last night after hours I get a message from a client: “Hey, my domain name is expiring tomorrow. Can you take care of that for me? Thanks.”

Umm, thanks indeed. Thanks for missing the half-dozen or so messages that you’ve already received in the past month telling you that your domain is expiring soon. Thanks for waiting until the last minute, on a Friday, before getting off your duff on this issue. Thanks for assuming that I’d be happy to spend part of my Saturday saving your domain from oblivion. Thanks for all that.

This isn’t the first time that I’ve ranted about domain names. See http://www.brianwold.com/free/2008/01/16/dont-let-your-domain-name-expire/ and http://www.brianwold.com/free/2006/01/20/domain-ownership-woes-or-what-do-you-mean-i-dont-own-myself/. So I shouldn’t be surprised about things like this. And, of course, we got the problem solved. Perhaps that makes me an enabler.

So, rant over… now to the useful information: many domain registrars lock your domain in the weeks before it is due (for your protection, so they say…). If you want to switch your domain from one registrar to a different one, for example to consolidate several domains in one place, you can’t wait until the last minute.