jQuery reDesign

As many of you have already noticed, our beloved jquery.com had undergone a redesign. I heart jQuery quite a bit and hate to bash the new design, but all I could think of at first glace was - what were they thinking?

On that note, it isn’t all that terrible - please hear me out.

The fact that the site has finally undergone a redesign is great, as the previous version was starting to feel a bit outdated, but I’m not quite sure if this was the right way to go.

Let’s start right at the top.

The new logo is pretty cool, but I have to say it feels a bit futuristic. Sending a futuristic feel though is not a bad thing, as it shows that jQuery truly lives on the edge and is up to date with the latest trends. However, the logo in combination with the “rocker” illustration is too much. Suddenly, the logo looses it’s feel and it all conflicts. The illustration, is very nicely done - props to Varick Rosete for his awesome skills! - but the thing is though, it just does not fit jQuery - at least not from my point of view. Next to the “rocker” illustration is another tagline, which totally throws me off. Is there really a need for another tagline/slogan? “Be a JavaScript Rockstar” is just so amateur/teen-like. What was wrong with just sticking to the simple, yet bold - “write less, do more” slogan? That is such an AMAZING line, it deserves a trademark all of its own!

Overall, the welcome section with the rockstar targets a totally different demographic than what I would consider to be jQuery’s target. It makes the site look amateur, when compared to the very clean look of MooTools and Prototype. I understand that they wanted to go different and over the top, and they sure did! But it does not seem like they considered their demographic. I am a rocker and a heavy metal chick as well as an awesome developer/designer, and so I’m a rockstar as they say (literal/non-literal), but to be honest, I was almost offended as a loyal user/fan. I don’t need to have it blow in my face - it almost felt like mockery.

I must add, that I love the “Who’s using jQuery?” section. That is definitely a great addition. Love it! It would be cool if they would change out/rotate as more big names roll in using jQuery. It would just keep thinks a fresh.

Alright, now that the big/loud portion of the site is out of my system, I can move on to discussing other parts of the site.

Let’s take a look at the colors at that was the next thing that hit me as I reviewed the site. MooTools not too long ago did a redesign of their site from a dark to a light layout. Hmmm… jQuery just did the exact opposite going from light to dark. Could it be that the two rivarling libraries are trying to stay at totally opposite ends of the spectrum? It’s like they’re using their color schemes as a metaphor. Sidenote - While discussing the color schemes, let me state that the Prototype website blue/orange (tips and tuts page) make me think 1990’s like whoa! The site is quite clean with a corporate feel, but whoa! on the tutorials page.

I can’t say I take issue with anything else on the homepage, so next, let’s explore the site as a whole.

The navigation gets a bit confusing for a second there. When the user visits the UI page, the whole layout resizes. I’m not sure why they aren’t the same width, but not a biggie. The thing that I found a little weird, but got over real quick, is that while on the UI page, if the user clicks on “About,” they get the about page for the UI. To get the about page for jQuery, the user must click “jQuery” and then “About.” It’s just a bit odd as it is not the behavior I expected, but how often will a developer use that nav anyways? Like never!? Well, meaning the about pages. And if so, then the users can figure it out just like I did, after all - we are JavaScript ROCKSTARS with jQuery on our side - and I mean that in a true sense, no mockery there!

Saving the best for last, the documentation/tutorial section is MARVELOUS! As expected, it is excellent and I think I really like the new organization. Getting used to it took… oh just under a minute. Just one more reason why jQuery RULES!

So there you have it folks! My thoughts on the redesign.

*** UPDATE ***
Just noticed a tweet from John Resig - the “rockstar” is officially out (awww - now I feel a little sad) and here is their latest post. In response to that, I think there’s definitely ways to have “fun” with the homepage it’s just a matter of finding the right “thing” to represent the fun that fits their demographic. I LOVE that they took immediate action and responded to the wants/needs of the users. Damn… I LOVE those guys! Awesome work and thanks!

Oh, and I DO love the new-new version of the site.

∂ meow


Tags: , ,

CSS Animations and MooTools

Today on Ajaxian I stumbled across an interesting post in regards to CSS animations via MooTools. WebKit’s CSS animations are pretty cool, but not compatible with all browsers. This little script seems to work pretty nicely with most of the browsers. Well, it works wonderfully in Safari, but is a bit buggy in Firefox. It just does a bit of a jump in Firefox, but overall - runs great. You can view Chris’s example here and view the JavaScript here.

I found it really interesting when I read over the article and instantly thought - can I do that with jQuery? We’ll have to see…
∂ meow


Tags: , ,

Spring Fever

So spring is officially here and I seem to be suffering from a little spring fever. It’s not the typical - restlessness or excitement brought upon by spring, but rather my usual fever-flu-cold.

I get a fever-flu-cold on a regular basis of 4 times a year - as the seasons change. And so for the last week, I’ve been really fighting it, but today I lost the battle. I woke up with a killer throat ache, throbbing headache, and even body aches. It really sucked! It sucked especially because it was a beautiful day out, and I had lots of work to do, but had no focus or direction. Hopefully, cups full of herbal teas and orange juice in combination with some rest will get me out of bed and into the world.

On the brighter side - I’ll get to catch up on some reading and doodling.

Oh, oh oh, oh, oh! Almost forgot.

A couple days ago, my boyfriend shared a marvelous piece of information with me and I just have to share with you! So, it turns out, NYTimes prefers to hand-code or use a plain text editor rather than a WYSIWYG editor like Dreamweaver. According to their design director, Khoi Vinh, it just works better. Let me quote:

We just find it yields better and faster results.

Now, that’s awesome. I heart my TextMate and would never give it up! If interested, read the full article here.

∂ meow


Tags: , ,

Recent Book Purchase

After playing with jQuery and MooTools for the last few weeks, I decided it would really help if I knew a little more about JavaScript.

And so, just a couple days ago, I found myself at Barnes & Noble sifting through books of JavaScript. I was specifically searching for the “Pro JavaScript Techniques” by John Resig book. Unfortunately, they did not have any and so I was left to sort through a bunch of other JavaScript books.

After careful analysis, I managed to narrow my selection and I walked out with two books. One: “Simply JavaScript” by Kevin Yank and Cameron Adams. Two: “Designing with Web Standards” by Jeffrey Zeldman (second edition).

Currently, I am in the process of reading the “Simply JavaScript” and it seems like a really good book. Once I’m done, or at least half way through it, I’ll do a fair review of it to let you know if it is worth the time and money.

∂ meow


Tags: , ,

MooTools vs. jQuery

Which library is better?

There has been much hype over the different JavaScript libraries such as Dojo, jQuery, MooTools, Prototype and Yahoo. I’d like to focus on MooTools and jQuery as those are the two libraries I have been personally debating as of recently.

As you may already know, I am fairly new to the world of JavaScript and just recently started using jQuery. Just a couple weeks ago, I wrote my first reactions/review of jQuery and here I am today comparing it head to head with MooTools.

After much analyzing here is what I’ve come up with.

jQuery is really easy to use and learn. After just a day of playing with it, I learned all kinds of things and quickly caught onto the structure of its syntax. The syntax for jQuery is very simple, easy to understand, quite short and the chain-ability is really sweet. On top of all of that, the documentation and tutorials are phenomenal.

After researching and experimenting with MooTools, I must say that the first thing I noticed is the slightly bulky and less friendly syntax. However, MooTools seems to be great for Object-Oriented Programming and it is very smooth with it’s animations - almost a Flash-like feel. I thoroughly enjoyed their demo page when I first visited the MooTools website.

The MooTools documentation is pretty good as well, but their website did lack in tutorials. That must be largely because MooTools is marketing itself toward the intermediate and advanced JavaScript developer. But what about the beginners or the not quite intermediate developers that are eager to learn? A few tutorials wouldn’t hurt, especially, since there seems to be much complaint about the MooTools community and lack of support for the simple-easy questions that someone learning might ask.

After running a SpeedTest found on MooTools website, I found that there is very insignificant difference in the speed of MooTools vs. jQuery and it varies quite a bit from browser to browser and platform to platform. If one takes all of the results into account, overall, MooTools is a bit faster than jQuery. But what is a few milliseconds? Does that really matter?

So where is the hold up and which should you choose?

This got me contemplating on which library would really be the better way to go. I think that is totally up the the individual’s preference and the project at hand. If a few milliseconds and smoother animation really matter to you, then MooTools is the way to go.

Personally, I’m loving the ease and friendliness of jQuery and do not care too much for the slight difference in smoothness of the animation. However, if a project comes along and MooTools seems to be a better fit, then that is what I will use; but by default, I’m staying loyal to jQuery.

It is good to know or at least have a good grasp of both of these libraries, and even some of the other ones, as you never know what you might encounter with a future project or employer. By knowing or at least being familiar with several of these libraries, you’ll be in a better position to judge and decide which is more fitting for individual projects and you.

In quick summary:


jQuery:
Concise syntax
Great documentation and tutorials
Easy to learn, even for beginners
Nice plugin architecture


MooTools:
Better for OOP
Smooth animations
More advanced - harder for beginners
Overall faster

∂ meow


Tags: , , ,