Buttons! (updated)
Permalink | January 19, 2008 by John in JB.com, Web Design
I’ve been doing some tweaking and fiddling. In Firefox I bumped the slideshow out to the left a bit, just to enhance the layering effect (and because I could). I decided I didn’t like that; it looks like I made a mistake. In Firefox and IE7, I’ve implemented the new nav buttons (Home, About, Resume and Contact) as PNG files with alpha transparency. In IE6 and earlier, the buttons get the dark green background.
When I feel like fiddling around a bit again, I might try and get the alpha preloader trick working to make the buttons have transparent backgrounds in IE6. I may also try and make the masthead slideshow overlap the left edge as it is now in Firefox.
But in Firefox, I can safely say the design is final still evolving.
I don’t like the buttons
Permalink | December 19, 2007 by John in JB.com, Web Design
The main navigation buttons are the weak link in the new design. I had some really nice graphic buttons with drop shadows but because of the way WordPress handles those page links and because of older browsers, I scrapped them. But there’s got to be a middle ground.
Extreme Makeover 2007
Permalink | December 16, 2007 by John in Freelancing, JB.com, My 2002 Triumph Bonneville America, Web Design
So here it is. The Dog’s Bollocks.
I’ve been working on this design for quite a while now. Should work in all Gecko-based browsers and Internet Explorer from version 5.5 5.01 forward (it blows up real good in 4.0). I have a ton of tweaking to do but it’s close enough to launch. There is some kind of bug in IE 5.5 and 6 (but oddly enough not in 5.01) that effects the left margin after a blockquote tag. I have to research that.
The graphics and color scheme are inspired by the planned makeover of my bike. The bulldog is going on the sides of my tank, the base color is British racing green and the pale green racing stripes with lime green pinstriping will go over the top of my fenders and tank. The “Friar’s Flyer” number plate at the bottom of the sidebar, visible only in IE7 and Firefox, will adorn something on my bike, either a sprocket cover or the rear fender, overlapping the racing stripe much like it does here. Finally, there will be perforated, brushed-steel accents in various places.
After I delivered the HKM web site I was left with an unused license of Monoslideshow, so it has found a home here. When the bike is done I’ll replace the images in the slideshow with images of the bike. I couldn’t get it to work on the other pages but I think I like the more streamlined look, reserving the slideshow only for the homepage.
Let me know if you see anything anomalous.
P.S. I also used the graphics to redesign my (virtually unused) myspace page.
The Case Against Hyperblogging
Permalink | November 30, 2007 by John in JB.com
Finally, someone provided me with a justification for my blogging style/frequency. Tumblr? Don’t Bothr: The Case Against Hyperblogging:
Someone who talks a lot has less value to their words than someone who rarely speaks. But when that quiet person speaks, people listen. When you publish 20 posts a day, your individual posts lose value. And when you finally do have something important to say, it gets lost among the clutter. Your signal to noise ratio is too low.
Now I need the justification for very short blog posts. I can’t stand blogs with 1000+ word blathering, stream-of-consciousness posts. Of course, 90% of what I post is other people’s words, with 10% being my commentary on what they said. Just like this post!
The Prototype is Finished! I really mean it this time!
Permalink | November 25, 2007 by John in JB.com, Web Design
(Update: looks like ass in Internet Explorer 6. See below.)
Today I put the finishing touches on the prototype for my new blog design.
I was having trouble getting it to look right at 800×600 resolution, letting the layout degrade gracefully to the narrower width. The layout was based on a width of 850. The long term solution is to completely overhaul the layout, which I will do someday. For the short term, I chopped 90 pixels out of the width, a little from the racing stripes (sidebar 210px), a little from the perforated metal (Page navigation 150px) but most from the main content column (400px).
It took a fair bit of fiddling around to get the slideshow to look the way I wanted, that is, sit “behind” the top edge of the main content column. The creator of Monoslideshow was very helpful in getting it working and looking right. Right now I’m using my photos from my ‘07 British Columbia trip, from my ride on the Kootenay Bay Ferry. When my bike makeover is done I’ll swap out the BC pictures for fresh bike pictures. Eventually I’d like to use Flickr to manage the photoset since I’m not really doing anything else with my Flickr account; monoslideshow is supposed to have that functionality but I couldn’t get it to work. Something else to troubleshoot, I suppose.
All that remains is to chop it up and make a WordPress theme out of it.
Internet Explorer 6
Okay, I fixed the layout in IE6. I put the IE6-specific changes in a separate stylesheet with conditional comments in the main file. I replaced the maincap graphic (it overlaps the bottom of the slideshow), eliminating the softer drop shadows that overlay the slides and replaced the bulldog with a traditional GIF, since none of the published hacks worked for displaying PNG-24 transparency properly. Probably has to do with the fact that the images are placed in the background of div elements, not as inline images. I also hid the number plate graphic that is located at the bottom of the sidebar; IE6 users just don’t get to see that bit of fluff. I also made the navigation buttons aliased (read: jaggy edges) but I don’t like that solution so it’s back to the drawing board …some other day. The layout breaks down but is readable in Internet Explorer 5.5, gets progressively worse in IE5, and blows up real good in IE4. I don’t really care about anything older than IE6, but I was curious. There are still a couple of weird text formatting issues. Apparently after a blockquote tag, the following paragraphs don’t want to behave with regards to their margins.
All in all I’m pleased with the IE6 fixes.