Let me get this out of the way upfront: It’s not done.
That having been said, I’ve relaunched my site on an entirely new codebase, and given it a slight design makeover, as well. As you may know if you follow this site and Django, the May reboot version of jeffcroft.com was based on a CMS I wrote when I was very new to Python and Django, using Django .91 — which is pre-magic-removal, in Django parlance.
I’m happy to say that all magic on jeffcroft.com has been removed.
Removing the magic
See, Django is working hard towards its 1.0 release, and the key aspect of that milestone is API stability, such that backwards compatibility can be ensured. That is to say, code that is written for Django 1.0 and higher will not having to worry about newer versions breaking it. Code that is written on a pre-1.0 Django codebase is not guaranteed backwards compatibility.
And in fact, between Django .91 and .95, a lot of Django APIs were overhauled into their 1.0 state — a process the development team called magic removal (Apparently, magic is a bad thing in programming. Personally, I still think Django is pretty magical, but I think I use the term differently than these programming guys). So, Django .95 (and the current trunk development version, which I’m using) is considered damn-near 1.0 and has mostly stable APIs (although there are a few things which still may change).
So while the last version of my site worked pretty darn well, it was based on code that was a bit of a dead end — I needed to port it to post magic-removal Django in order to be able to use it ongoing, into the future. Every line of code I wrote to add new features or bug fixes on the old version would have to be ported at some point. And besides that, I’ve learned a lot about Django and Python since the May 1st go-round, and I really just wanted to re-write the whole thing from scratch anyway, just for the sake of Doing It Right. So that’s what I’ve done.
I’m especially proud of this version of the codebase because I really did write it almost entirely by myself. As you know, I relied very heavily on my co-workers (who are also principal developers of Django) to help me with my first Django version. But now, I’ve learned enough that I only had to bug those guys a couple of times with minor questions. Seems I may not be able to retain my title as “non-programmer” much longer. What can I say? Python has made programming fun again.
The “new” design
Actually, almost all of that has been done for weeks. I was planning to wait on moving my live site to the new codebase until I had some glorious new design to go with it. I’m pretty burnt out on the May 1st version, and I really want something new. But I’ve been a bit inspiration-less and strapped for time, to boot — so I ultimately decided (about a week ago) to just “realign” the current design and get my ass over to the new code.
This new version of the design doesn’t feel very inspired, I know, and it’s definitely nothing innovative or new. What’s more, there are pieces missing (I’ve still not finished the blog archives, for example). And there are pages that simply don’t look “finished” (the portfolo page is in complete disarray and I’m definitely not happy with the top half of the home page yet). But I really wanted to get myself onto this new codebase, so I hope you’ll bear with me as I clean it up over the next few weeks.
Finally, there are several new features I’ve built into the code for the site but haven’t yet built public-facing pages for — so some of the coolest stuff I’ve done isn’t yet available. But, eventually.
What’s new
There are a few new features now, though.
On the homepage (and in the “big footer,” as people seem fond of calling it), you’ll find “Enjoying,” which is a few albums, TV shows, movies, books, etc. that I’m currently digging. Eventually, they’ll have detail pages with more info and I’ll enable comments so you can discuss them — but for now, they’re just small icons that link elsewhere.
I’ve also begun a revamp of the tumblelog (which I’m now calling “Stream”). It’s not done yet, but you can see where I’m headed.
But probably the most interesting feature I’ve added is that of embedded inline content in blog posts. Any sort of content in my CMS (including Flickr photos, Flickr favorites, ma.gnolia links, blog posts, comments, audio files, video files, Flash files, book or music recommendations, portfolio pieces, etc.) are available to be included inline.
This is different than simply using an img tag to include a photo on Flickr into a post. This is getting access to the entire photo object — which includes the image files, all the metadata, the comments, everything — and being able to manipulate it directly in my blog post. And since my database syncs up with external services like Flickr and ma.gnolia every 20 minutes, objects embedded in blog posts are directly tied to their original source. So, for example — say I favorite one of your pictures on Flickr and then decide to use it to illustrate my next blog post (maybe you’ve got it Creative Commons licensed). I can plop it into my post and maybe include your description from Flickr as the caption. If you then change that description, it will change accordingly in my blog post.
Inline system examples
In order to show off how the inlines work, I popped a few into some older blog posts:
I’ve also created a CSS framework that allows for a great deal of flexibility in how these inline content pieces will be displayed within the posts. Hopefully you’ll see the fruits of this as I write more posts in this new system.
My reason for this is a desire to tie different content types together into more interesting ways to tell stories. My May 1st version laid the groundwork for this, pulling various types of content into my own local database. Now, I want to find interesting ways to mash them all up.
The final word
So this design isn’t particularly inspired, and I apologize for that. But, I think by moving onto the current version of Django and building a much more clean CMS on which to work, I’ve built a foundation on which I can do some really creative and innovative things.
They’ll just have to wait for my inspiration to catch up.
Update: After a discussion with Ryan Berg in e-mail, I decided to totally steal his idea of doing code snippets as inline objects, as well. This offers the possibility of having a separate, browseable/searchable code repository. I took the opportunity to add language-aware syntax coloring via Pygments, as well (as as aside, the wealth of awesome libraries like these is a real plus for Python compared to most other agile languages). Have a look at Django for non-programmers, Setting Up Django on Dreamhost, or Django Templates: The Power of Inheritance for examples of inline code objects. Thanks for the kick-ass idea, Ryan!
Dude! Don’t launch it yet! All my buddies kept me going on Whalesalad3 even when I was at the end of my rope and just wanted to launch it. But it’s so great when you can transition to the new design, and then sit back and relax, saying to yourself “Wow, it’s done, I did it!”
But, if you do launch it right now, I think you’ve underestimated your own work. It really does look great. Really clean, fast, smooth, the font’s just look awesome. Everything lines up perfectly. I love it!
Heh. I appreciate that, Michael — but I think I’m going to overrule you. I want this thing out the door. I’ll probably launch it in the next hour or so… :)
(For those not keeping tabs on me, Michael guessed my sandbox domain and has been peeping around, sneak-peek style).
Haha, its ok dude. I love it, every bit of it. And it does look WAY better than the old one (even though the old one looks GREAT). So, can’t wait to see it launched! Great work man, great work.
I like what you’ve done with the place Jeff. I love the colors and the fonts you’ve gone with this time around. I like the fact you have kept the same style comment buttons for so long. They are very effective and look nice to boot. I have been thinking about dipping into Django a bit lately but I’m still just not sure. You may have just helped my decision.
Enough with the apologies already — the new(er) design looks great and the magic behind the scenes sounds pretty interesting as well. Congrats! Love the “Listen up, bitches” addition, too.
Very nicely done, sir. When I get off my lazy ass, I’m sure all your magic-free code will make for good stealing. ;)
Wow. I love your way of indicating your own comments. :)
The inline content is great— the power of that alone may get me to take a look at Django. I’m constantly looking for ways to bring all the separate parts of my online life together smoothly.
Congrats on the new codebase. I’m sure it was more fun and less frustrating the second time around.
I’m working on some inline content issues myself (though I don’t think as complex as yours). I’d be curious to see how you’re pulling it off if you don’t mind sharing. Two years of using Ellington at work has left me spoiled (when our inline content type matches up with the defaults, anyway).
Anyway, back to wrangling with IE6 and floats I go.
Lots of super neat stuff here, Jeff. You’re definitely doing some of the most “real-world valuable” innovation on the web, and I think we’ll see a lot of these ideas making their way into widespread use real soon (especially if you’ll just hurry up and release your JeffCMS for the lazy - aka “busy” - among us).
I’m a fan of your “big footer”, both in content and design. Top notch. Ditto for the Lifestream. You need a little superscript TM after that.
Is the live-search feature getting the boot? Not that I’d miss it — just noticed it wasn’t working. My opinion is that it’s much like “Live Comment Previews”, in that they’re pretty nifty effects you can do with a bit of javascript, though not incredibly valuable.
Love it too, Jeff - but guess who also guessed your sandbox address? Hehe.
Anyways, it does look fantastic.. very well done. I’ve been watching it for about two weeks and it really has progressed so much - brilliant work (even if it’s not finished!)
Glad you guys noticed (and weren’t offended). :)
I hate you, Wilson.
Catch me in person or in e-mail about it. I’d rather not delve into too many details publicly at this time. :)
Thanks, man. That’s a really nice compliment.
Ehh, I don’t think I created it, though. I think the first person I saw use it was Jeremy Keith. He needs a TM after it so people like me won’t steal it. :)
Hmm, it should be working. Seems to work for me. I’ll check into it, though. I’m not planning to remove it — but I am planning to rewrite it using YUI instead of Prototype one of these days. :)
Holy Manholes, Batman!
Hot damn, I didn’t expect to see this so soon. Very nicely done, sir!
Wow. Nice to see that talk of “building systems that let me design every page” finally becoming reality. I love the layout of the Kanye article; it really makes me feel like I’m reading something out of a magazine.
I only have one gripe: the fact that you’re using an OpenType font (Minion Pro) means that while the typography is gorgeous in Safari, it’s horribly mangled in Camino and Firefox on Mac my browser of choice. Kerning is completely whack, and the text overlaps in places where italic/bold meets roman. (Richard Rutter wrote about this recently.)
But other than, very naaaaaice :)
I think the design I put together for you was better.
But this one’s ok. Nice work :)
Does this mean that the whole thing is going back to Django later and, if so, when?
Don’t look now but your relaunch has reset all the dates on your RSS feed and everything you’ve ever tagged as Django has flooded the Community tab of the site making this site look like a splawg. In completely unrelated news, I like the redesign. The comments are lighter which solves an annoyance with the last version. (Switching from dark on light to light on dark) Yet, the cool looking dark footer remains, a nice compromise.
I’d love to hear more about how you handle your inline code.
Looking great, BTW :)
Very nicely done. I actually saw the address when I was up there for training. However, I tried to avoid checking it out early ;-) didn’t want to spoil the surprise.
The type treatment is very nice. Very clean. Good balance. Ditto for the colors.
Although I do miss the rotating flickr photos.
Are those inlines done similarly to the way they are handled in Ellington?
‘tis the season for redesigning. I like it. :)
Nice work, Jeff! While a lot of the programmer talk you’re spitting is Greek to me, I can definitely appreciate the benefits of what you’ve built, and, of course, the visual design. But be careful about getting hung up “innovative” and “new;” there’s already a lot of “innovation” on the web that’s just getting in people’s way. This design works just fine and looks very nice without a lot of superfluous bells and whistles. Oh, and I like that you’re using Minion for your body text. I’ve considered doing something similar (using a font standard for designers, and falling back to Georgia for everyone else), but I still don’t know how I feel about such wildly inconsistent type renderings among my readers, since I’m not sure exactly how much of a majority designers hold among them.
Jeff, I like what you have done. It’s not a huge shift that people will be confused - but its a nice ‘refreshing’ change. Your site gives me more motivation and inspiration to get mine re-launched.
Seriously, you do excellent work. What I like most about your site is:
Anyway, nice job with this quick refresher.
Yeah, I see what you mean. Grrrr. This probably means I”ll have to change back to Georgia or similar.
Dave, it’s all still Django. Just the newer version of Django, now.
Rob, I think you’re absolutely right, and in most cases I’m a little wary of overdoing it, as well. But here, on my personal site — I think this is the right place to explore and try new things.
Thanks, Nate. Really nice compliments. :)
Whoops! I think I’ve fixed this — hopefully the Django community site will catch up to me soon. Sorry about that!
Formatting of your RSS feed in my reader looks a bit wacky (right aligned text and weird list formatting) but otherwise the new site looks good and works really well.
Looks great! Very nice work as usual!
I especially like the faux third column effect by using negative margins on your inline content, can’t wait to test the method on my own.
Thanks for always raising the bar.
Oh wow, very nice! I love the inline content - it’s innovative, and at the same time, very pleasantly organized. The highlighting on the Flickr photos is also very spiffy. I have one small criticism though - the text size in textfields, such as the one in which I am currently typing, is very tiny. Is that stylistic?
And of course, lovely twist on the “Author comment” title. Pink always says things that you never dreamed you could otherwise, and in this context, breaking the illusion of the toe-to-the-line journal is an idea I wish other authors would adopt. Awesome work!
Nope, that’s a mistake. I’ll fix it. :)
I think what impresses me most about your work is the emphasis you seem to put on content and typography. You let your data serve as the main design element and I find that truly refreshing.
Your implementation of embedded inline content is inspiring. Beyond the well thought out templating system you’ve created, I truly like how this site embraces your “web personality” and therefore adds depth and context to your writing. I’d love if you could someday share tidbits of information on how you pulled this off with your Django backend, but for now I’ll just sit back and enjoy your site even more.
Congratulations on another beautiful re-launch, Jeff.
Nothing original to say — it looks great.
I have spent some time with CakePHP and Ruby on Rails - but I still have not looked at django. Now, thanks to you, thats my next stop.
You had to relaunch just as jeffcroft.com gets dugg as one of 50 beautiful CSS-based designs on the web. Great timing! :)
Whoops, sorry! I really wasn’t with it when I was reading. For some reason I got the impression you’d moved from Django to something else while you worked on upgrading. I’ll go back to lurking :)
Pretty nice - but a couple of glitches in your comments section.
1- Any text in a comment that follows a blockquote is shifted off to the left and the first few letters on every line disappear.
2- There are no field names under “Post Yours” - just three input fields with the comments (eg Real names preferred) alongside.
If it helps, I’m using IE6 on Win2000, JS and CSS enabled but not much else (not my computer!)
I’m a big fan of the new inlines too.
Good luck getting the bugs ironed out, and merry Christmas :)
Stevie-
IE6 will probably never be fully supported here. I’m experimenting with pretty advanced CSS selectors and techniques on this personal site, and IE6 doesn’t support several of them. Sorry about that. :(
Woa. Looks really awesome.
Great work :D
Regards, Armin
As usual, very nice.
Very nice work here. Good stuff.
Wow, awesome job, looks really nice! Though right now the font size in this text box is a little too small (Firefox on Windows XP), I don’t know if that’s a browser or site issue. One other thing, this is just my personal preference but I actually preferred the screenshots in the links page, they provided a little splash of colour and variety though functionally speaking they didn’t do much and took up space. Congrats on moving to Django .95 by the way!
Vernon, the text size is too small in textareas, yes. As I said earlier, I will fix it. Also, I kept the screenshots on the link detail pages, just not in the list. but, they may return to the list - I haven’t really fleshed out that page much yet.
Thanks for your comments. Glad you like it. :)
Have you forgot about use 1024x768 users? I get a horizontal scroll bar with some other minor issues. I’m running firefox on openbsd. Let me know if you want a screenshot. Keep up the awesome work.
James, my intention was to have this site fit on 1024px wide, and I thought it was narrow enough to do so. Might still require some tweaks on that front — but no, I haven’t forgotten about 1024px wide visitors. :)
Wow! Being a fan of the previous design, this one’s a good one too. Don’t know yet which I prefer, what about small bugs? This is the first thing I encountered: http://xs110.xs.to/xs110/06514/i… wrong display of italics, not quite a jeffcroft.com bug, more a Firefox bug, but just letting you know ;).
Thanks, Erik. The FF/italic/opentype bug has been mentioned in these comments a few times. I know it’s an issue — just not sure if I care enough to change the font back to Georgia or something similarly boring. We’ll see.
Great new stuff, Jeff. Congrats. I’m amazed.
One question. Any update about the top 10 list of Django bad things? Have you taken advantage of any solved issue in this new reincarnation?
I mean, Django 0.95 solves some of the problems mentioned in that list?
Thanks in advance Jeff.
Alberto-
It’s my personal website. I definitely have a choice. :)
I have a PC here at work with Minion installed on it and it never looks great in anything, not even in MS Word really. I recently viewed your site on a Mac and wow, what a difference! I love the Minion italics, that’s my favorite aspect of that font.
So with Django are you able to execute server-side code that is put into a regular post? (I’m trying to wrap my mind around all the new inline stuff.)
Alberto, that topic sounds familiar:
http://www2.jeffcroft.com/blog/2…
I’ve stopped by often to check out the site. Lovin’ the new design. Well done.
Very, very nice attention to detail Jeff. I’m prefer the lighter style for sure although I was very keen on the previous design’s pink colourway - not sure the orange and grey is for me. Of course that’s purely subjective :)
Jeff - the site looks wicked cool on my vertical monitor. Reads just like a newspaper would feel in your hands. Huge fan - forget traditional widescreen horizontal, vertical is the way to go and this site delivers.
Ok, let’s wait for a new post about that. I’m specially worried about #1 in the list (Painful schema migration). Thx.
Very, very nice attention to detail Jeff. I’m prefer the lighter style for sure although I was very keen on the previous design’s pink colourway - not sure the orange and grey is for me. Of course that’s purely subjective :)
Jeff bodybuilding expert