Beckism.com

I recently landed a web design client who has a website that needs a little sprucing up, an entirely new admin backend that can be administrated by real people, and a lot of code updating. Its code is hideous; completely non-XHTML compliant with capitalized tags scattered everywhere, some pages are seas of Word-generated HTML (which is the worst nightmare of any decent web designer), and it’s otherwise just pretty hideous.

Fortunately for me, I have a lovely utility called TextSoap Deluxe. TextSoap has any number of ways to clean text, and one of its nicest ones is the ability to create a custom cleaner based off of regex rules, which will then churn through a chunk of text and do things to it. Of course, I knew very little regex at the time, but after a few hours sitting down with the excellent Regular-Expressions.info tutorial and doing a bit of trial and error in TextSoap I was able to create a cleaner that at least simplifies my life by lowercasing the things that need lowercasing (among a few other things). If you use TextSoap and want to see what I’ve done, I’ve posted an early version of the cleaner in the TextSoap forums: XHTML Cleaner for TextSoap.

I’ve been designing websites for years, but I still run across things that baffle me, particularly when it comes to programming sites cross-platform.

Take for instance a bug in WebKit, which powers browsers such as Apple’s Safari and OmniWeb that I discovered while designing the current template for Beckism.com. The short version is that if a background image is attached to a child div but is wider than the parent div (in pixels) it will wrap around into the parent div. Want the longer version? Read on.

In designing the new Beckism.com site them, I wanted to maintain my old look (green header that wrapped around into a right sidebar that stretched all the way down the page) while fixing a number of cross-browser display bugs and general friendliness issues. The main problem is that it is very difficult to stretch a sidebar div to match the height of the main content div. My original solution was to have a fixed pixel width sidebar, and then use a background image attached to the main wrapper div to color it all the way down.

This was an unacceptable solution for the redesign for one reason: I didn’t want a fixed pixel width sidebar. Since designing the new Idol Bat theme, with its em-based widths and ability to scale (hover over the top right tab to get flash controls, including scaling controls), I’ve decided that, where possible, flexible em-widths are definitely the way to go. They scale fantastically well, the text at any size is situated in about the same place, and they just feel cleaner.

The trouble is that an em-width could be any number of different pixel widths based on a viewer’s preferences. Although much more friendly for the end-user, they are hell from the standpoint of graphic design. Sadly, after messing around with any number of solutions, it seemed that the image background was the only viable, cross-browser solution.

So I figured why not just use a background image that’s needlessly wide? This would allow me to have variable width sidebars while leveraging the same workaround as the first version.

So I whipped out an image that was 1 pixel by 1000 pixels and tried it out. Worked perfectly for every browser except for Safari, which looked something like this:

With a little experimenting, I discovered that in WebKit, if a background image of a child div has a pixel width that is wider than the pixel width of the wrapping div, it wraps around. This is very strange, and threw a bit of a kink in my plans. The WebKit bug meant that I was not only constrained by one variable width, but by two. Grah!

My compromise, for lack of a better solution, was to use an image background that was wide enough that it was unlikely the sidebar would ever grow that big (unless a user has an exceptionally high-resolution monitor) but not wide enough that it was likely to exceed the total width of the main div (ended up being 500 pixels).

Now I can only hope that no one runs into problems; it’s highly unlikely, of course, but I’m still cursing CSS and the browsers for not providing any sort of reliable height controls.

As you may have noticed by the reorganized sidebar, Beckism.com is phasing in a new look! As I slowly expand Beckism.com’s offerings (see, for example, the new By Design section), I’m looking to make the site easier to navigate. I’ll be looking into creating a better archiving system in the near future, and am also developing a reasonably cool feature for the main page (fixing the forums so they work correctly is on the list as well).

I’ve also cleared up a lot of the issues that the site had in Internet Explorer (thanks to the marvelous Parallels Desktop). Hope you enjoy the changes, but feel free to let me know if you don’t.

I’ve always wanted Beckism.com to be something more than “that site I never update.” As I’m nearing the end of my largest college commitment, I think I might actually be nearing the stage where I’ll be more interested in updating this site. With that in mind, I’ve added a couple posts to the Commentary, and will hopefully get a new Dirt Man up soon (although I’m not making any promises, of course).

Also, it looks like one of the newer versions of WordPress might have broken the forum; I’ll be looking into that soon-ish.

I also may do some minor site redesign work; let me know if there’s anything about Beckism.com that could work better, or if you have any ideas for improvements.

I had never heard of this site until I went to download the newest subatomicglue album, but as of tonight I have been introduced to Jamendo, and it’s an amazing site.

Take a bunch of music, allow people to download it for free (Creative Commons rocks my world), and make it super easy to donate for the albums you end up keeping.

Beyond that, artists can opt into a program that gives them 50% of the advertising revenue generated by their page views (for free), and of the money donated to the artist, only about half a Euro goes to Jamendo.

This is an amazingly cool experiment in free music. Go check it out now. In only about an hour I’ve already found five or six albums that were good enough to download and may end up being good enough to donate for. And don’t be surprised if a couple music reviews show up here; Jamendo allows automatic integration with blogs. How cool is that?

Beckist Productions is no more! It was a klunky name, and that globe at the top of the page was getting tired (I’m pretty sure I didn’t even make it originally; it was an example project for a long-defunct free 3D modeling program).

Instead, Beckism.com is now published and designed by One Crayon. The little logo is a Blurburger original, the site is running an all-new custom CMS, and I’ll be trying to do web design full time for the near future. Check it out!

After months of being down, the Idol Bat is finally back online! Our first issue of the year was published Sept. 3rd, and although it is only comprised of three articles, they’re three darn good articles. Check it out at www.idolbat.com.

In sadder news, I probably won’t have much time to update Dirt Man this semester. I’ll see if I can’t whip out an episode or two, but I can’t promise anything. Hopefully I’ll be able to start doing commentary more often, though. I keep having things I want to throw up there, but forgetting to do it. Grah!

Wow; who’d have thought this could happen twice in one summer? Turns out my host once again died on me, and I’ve had to seek yet another new host for my website. However, I am now back online (mostly; still getting email working again), and hopefully this will be the last extended outage for Beckism.com for a while.

Other than that, there isn’t much news. Check back!

Well, who’d have thought this would ever happen? Turns out Beckism.com once more has a forum, currently entitled BeckTalk in a nostalgic nod to the past. Will anyone use it? Beats me. But it’s there if you feel the need.

The new forum is based off of a very slimmed-down piece of forum software called Phorum. No flashy graphics with this one; just a simple text-based interface that integrates seamlessly (assuming that I indeed quashed all the bugs) with the Beckism.com template.

Anyone can view the forum, but if you want to post you’ll need to register via the link in the sidebar. User accounts are handled primarily through the WordPress interface, although you’ll have to define your signature (if you want one) through the forum itself.

There are some things that aren’t as user-friendly as other forums (such as no easy way to insert BB code if you don’t know it), but I’m working on the functionality as best I can. Let me know via the contact page or the forum itself if you run into any bugs or things that just don’t make much sense!

Just when I think things are up and running perfectly, something else goes wrong. The recent site outages for Beckism.com (and all of my other sites for that matter) were due to an issue that I had trouble resolving with my domain name registrar. Thankfully, I have finally gotten into contact with them, and although there may be a brief outage within the next few days the problem should be fixed.

In other news, now that I finally have a site up again I will be trying to update the Commentary page (and other parts of the site) more often. There’s a couple things that I’ve been meaning to post, so I will hopefully get those online soon. Check back, or subscribe to the RSS feed (HTML link, may not be formatted correctly depending on your browser) for notification in your favorite RSS client whenever there’s an update.