Published
October 21, 2009
Recently there was a bit of an uproar in the web developer community because of a blog post by Derek Powazek titled Spammers, Evildoers, and Opportunists. In it he tears apart SEO (Search Engine Optimization) by saying, among other things, “Search Engine Optimization is not a legitimate form of marketing.” I mostly agreed with what he wrote, but only because I understood what he meant: good web development includes good SEO practices, plain and simple. A well-developed web site is easily found and read by search engine spiders. Shifty “SEO” companies that say they can guarantee top placement in search engines are probably using unethical linking tactics that aren’t SEO but instead are flat-out spamming — these are the “evildoers” who are ruining the web.
I think part of Derek’s problem was that he assumed everybody knows good common-sense web development practices. But as Danny Sullivan pointed out in An Open Letter To Derek Powazek On The Value Of SEO “the stuff that you think isn’t rocket science — that anyone knows — is indeed a mystery to others.” I’m still surprised when I see sites coded poorly — bad page titles, using images instead of plain text, misuse of (or not using) header tags — but it reminds me that what Derek (and I) consider common sense web development just isn’t to many people. This is where legitimate SEO professionals come in to help clean up a sloppy or unknowing developer’s work.
Sullivan correctly notes that “sometimes [people] can’t find that web developer who also understands SEO issues. In the same way, you sometimes don’t find web developers who are also designers.” Sites I build are SEO-friendly without calling it that, simply because it’s the right way to build websites. Of course, once the site is up it’s up to you to add the most important part of any site: compelling content that brings people back to your site.
Posted in Development, SEO |
Published
October 17, 2009
Here’s a simple tip to use CSS for displaying your website’s logo (and any image in general). The HTML is about as basic as you can get:
<h1><a href=”/”>My Great Website</a<>/h1>
The CSS to “hide” the text and display the logo image instead is pretty simple as well:
h1 {
width: 400px;
height: 100px;
background: url(/images/logo.gif) top left no-repeat;
}
h1 a {
text-indent: -300em;
overflow: hidden;
float: left;
width: 400px;
height: 100px;
}
This styles the text and sets the height and width of the h1 tag to the size of the logo, and displays the logo as a background image. The h1 a style hides the text from the user (but not from search engines) by negative indenting the text and basically hiding it off-screen.
The result:
- very simple HTML code that’s easily read by search engines (better for SEO)
- text that provides a correct representation of the logo (no ALT tag needed)
- design elements are kept separate from the code, making future updates easier (the image can be changed simply by modifying the CSS)
Posted in CSS, Development |
Published
September 28, 2009
This post is more of a note to myself so I don’t forget it (again) when battling IE 6. If you happen to find it useful, then I feel for you for dealing with that browser…
If you have a floated element such as a div and you place margin-right or margin-left on that element, our most beloved Internet Explorer 6.0 will double that margin value, causing havoc in your html layout. To fix this simply add display:inline; to your floating element.
(via Jayme Blackmon)
Published
September 14, 2009
I launched a couple new sites in the past week:
Hofmann Joinery
Where the original Hofmann Joinery site was more focused on their custom furniture, the redesigned Hofmann Joinery site better reflects their current business model, which is high-end custom residential woodworking. I kept the design simple and elegant to put the focus on the photos of their beautiful work.
My Vintage Generation
My Vintage Generation was a very-quick-turnaround Wordpress site. It’s an eBay-powered store and blog, but with little budget it meant no fancy commercial eBay store apps. However, I was able to display products on the site even without a special application or plug-in simply by using eBay’s RSS feeds.
Posted in KCD, Releases |
Published
August 28, 2009
For you Photoshop users out there: Dan Rubin provides two quick tips to make Photoshop faster at makephotoshopfaster.com. Check it.
Published
August 25, 2009
Something that’s very important when building websites is to test the site across all major browsers, not to mention any “minor” browsers that your site’s regular visitors might be using. Take a look at your server stats to see what people are using to browse your site.
As a developer, one of the biggest challenges with testing across browsers is Internet Explorer: some of your visitors will have the most recent version (currently IE8) but there are still a lot of people who haven’t upgraded and are still looking at your site with IE7, and even (horrors!) IE6.
Since Microsoft only lets you run a single version of IE on your Windows machine at a time, this can be a challenge. Enter Internet Explorer Collection: It contains multiple IE versions which are standalone so they can be used at the same time, making it easy to see how your site appears across different versions of IE. (You probably won’t like how IE6 treats your code…)
Published
August 13, 2009
Managing UI Complexity is an excellent article on managing user interface complexity, complete with side-by-side examples. A lot of these principles (alignment, visual hierarchy, contrast, visual noise, etc.) are things I consider when doing my designs, but I often have a hard time explaining these details or pointing them out to people. Brandon Walkin does a great job bringing these to light and explain how they affect a UI’s complexity.
(via Daring Fireball)
When I build a site for a small company — especially those with only one or a few people — the website is often not the main part of the business. The site needs to be professional, clear, and easily updated, but there isn’t one person whose only job is to maintain the site. There’s often not even a single person handling marketing (including the site), but one person wearing many company hats. Quick.CMS’s simple and intuitive administrative tools are one reason why I’ve built sites using it. The fact that it uses a flat-file system instead of a database — which is fine for these small sites — has the added bonus of being easy to install on a client’s server.
I’ve looked at many different content management systems (Joomla, Drupal, WordPress, TextPattern, to name a few). One thing they had in common was very powerful and customizable templates. Unfortunately, this also resulted in more complex administrative tools. These small business owners want to spend their time actually running their business, not learning a new application to manage their website…and then sometimes re-learning it when they want to update their site weeks or months later.
The Quick.CMS admin tool makes it extremely easy for people to edit and update their site. It’s not the most powerful CMS platform, but it gives site owners the control they need. I’ve trained clients on the Quick.CMS admin tool in less than 30 minutes, after which they were already editing and adding new pages.
However, one of my complaints about Quick.CMS is the lack of polish. The default template isn’t very good and the add-on templates aren’t much better. Luckily it’s highly (if not easily) customizable, so with some work I’ve been able to change it to do what I need from a layout and design standpoint. The administrative tool UI is also very basic-looking — nothing flashy or fancy at all, perhaps a little dated. However, my clients who have used it have been satisfied with it…and they’re more concerned with how their customer-facing site looks more than then admin tool behind it.
You can download and try Quick.CMS from their site, or contact me about getting your own site designed.
Posted in CMS, Development |
If you’re a freelancer or small businesses who needs to keep track of projects and billable time, I’d recommend Harvest. (Note: I’m not getting any kind of referral fee or kickback from Harvest with this recommendation — I just like the product.) Harvest is a web app that lets you easily track your time, expenses, and invoices, and does so with a very clean and intuitive UI.
I’ve been using Harvest successfully for the past year. Setup is fast and tracking your time is easy using the website, desktop widget, or iPhone app. Creating and sending invoices is very easy with their wizard-like interface, and you can add your company logo to the invoices it creates (that’s about the extent of the customization, though). Keeping track of time spent and expenses for projects, and sending and tracking invoices is probably the least fun part of creative work. But at least Harvest makes it quick and easy to do you can spend most of your time actually working. With a free trial available, it’s worth a test-drive.
For a more in-depth look, check out Simple Station’s comparison of Freshbooks, Harvest and Blinksale. Harvest comes away with their recommendation:
We highly recommend Harvest and are now using it as an integral part of our work flow, invoicing, time tracking and project management.
Vintage Web Design takes you on a trip down memory lane with some old school web design that’s straight out of the late 90’s: ugly design, tiled backgrounds, Java applets, MIDI background music…the works. The catch: these are live websites, not archives.