Making them click

I recently completed the book Neuro Web Design: What makes them click? by Susan M. Weinschenk (link), and I must say that there are quite a few times throughout reading it that I would just stop and say "Mother F*****!". Why? Not because the book was bad, in fact the book was very good. No the reason I would say that would be because I'd realize that I'd been sucked into things online without me even being aware of it.

I wont give away everything the book talks about, but I'll say what I'm taking away from it.

1. Many of the decisions we make are unconscious ones. If we can engage the different parts of the brain then we can help facilitate unconscious decisions.
2. Humans are social creatures. We like to be connected to others, do what others do, and we need to feel like we belong. Adding social functions to sites can be very powerful tools. Ask yourself this, how many times have you bought something because someone you know told you it was good? Or how often do you watch videos on YouTube because they were located in the "Recommended" section of the site.
3. Knowing that something is scarce or only available for a short time increases your desire for that something.
4. Less is more.
5. If you want to sell something, list that item first.
6. Getting people's attention is very simple if you:
   
   • Change things
   • Display food
   • Imply sex
   • Talk about "You"
7. Attractive people make things they are advertising attractive (at least in our heads)
8. Unleashing emotions in people is very powerful, especial when people feel like they are about to lose something
9. Stories grab attention
10. Like the old saying goes "A picture is worth a thousand words". Use of pictures is far more memorable than text.

Confronting my boss...

Disclaimer: While some of the comments I'm making in this post may portray my boss in a bad light, I actually believe he is an awesome man to work for and I respect him greatly.

For the most part, I am a fairly laid-back guy. I can typically deflect or vent most things that get on my nerves. Recently my parents were over for dinner and we somehow got on the conversation about how I don't really ever get angry. My spouse said that in the six years I've been with her, I've gotten mad maybe three or four times.

Having said that, there was one occasion at work where, I didn't necessarily get mad, but had to correct a problem that really started to grind my gears.

My company had been the software developer for a fortune 500 company for nearly a decade and as with all good things, the contract eventually came to an end. Prior to the actual end date however, the general feelings towards the company we were working for was rather neutral to negative. As our company's role was being replaced by another software company, it was inevitable that people would begin making statements like "they're going to crash and burn without us". These did happen and had been for a little while (I even took part in them at times), but eventually it began to nag at me.

At the time I was a business analyst and my boss was the product owner. Together, we were both main contacts for the customer and as a result, both of us were responsible for being the representatives for the customer. While I hadn't really thought about it much until then, we were also the leaders of our team. And as a result, we should be leading by example. My boss had been the product owner for the team for the nearly the whole length of my near three years with the company at that point and obviously had much stronger feelings about the lost contract than I did. By extension, he was much more vocal about the choices they were making than me or anyone else on the team.

A prime example was us being in a conference call with the customer, and after what we felt was a bad decision by the customer, my boss muted the call, began to harp on the customer to me about how bad of a decision they're making and then return to the call. These little angered complaints repeated a few times a day over the course of a few weeks was enough to get on my nerves.

Since being under his wing, he's told me that anytime I have issues, whether they are coworker, HR, or externally related, that I could pull him aside and we could chat about it. Well one day I decided to take him up on his offer, and oh my, that was the most nervous I've ever been around him - and he was the same guy I took my internship interview with. During the conversation, I think I just plowed through what was on my mind... my face getting hotter and hotter the more I talked. I'm sure that my sentences began all running together as I just wanted to get it all off my chest and by the end of it, my heart felt like it was going to pound out of my chest... especially in the few moments he took to respond.

I think what surprised me most was his reaction because A) I'm sure he wasn't really expecting that kind of talk, and B) no one likes to hear about bad things they are doing. But (if memory serves) what surprised me most was his first words back to me were "Thank You". He did realize that we (he and the team) were becoming rather unprofessional when talking about our customer. And like inappropriate jokes (ex. racial, etc), you get so used to them that eventually you end up telling them to the wrong person... and you never want that when your trying to portray your company as professional.

Having looked back on it, if we didn't have the open professional relationship we did, the meeting probably would have had to have gone through the "official channels" (you know, closed door meetings with HR who have meetings with the problem person later) and that probably just would have aggravated him.

I suppose if there is a point to the story, it is that I hope everyone can have as open a relationship with their bosses as I did mine. Not only did it make working for/with him that much better, but it made dealing with workplace issues that much better. Also, speaking to your boss about problems with them is hard! If you do find yourself having to go to your boss about something like that, make sure it comes out in a clear and professional manner... much clearer than I'm sure mine did.

CSS :before and Internet Explorer 7

Well, if your company is like mine, you have a requirement to support Internet Explorer and versions as old as seven. While supporting Internet Explorer isn't in itself a huge deal, attempting to use new-age CSS with Internet Explorer 7 is.

For me, the CSS psuedo tags :before and :after are particularly useful. Many of the pages I've had to implement recently have included funky icons before menu items. While this wouldn't normally be a big deal as you would think I'd just add the image to the menu's HTML and be done with it. Well, that would work all fine and well except that we have custom built controllers that will automatically generate the menu for us. The reason for this is so that each user of our site can have their own custom made menu. So this is where the problem is: how do I add the funky images to a menu I cannot edit. The answer: Do it with CSS!

I implemented the menu icons using the CSS's :before tag. And it worked beautifully in Firefox, IE8 and IE9; however IE7 displays nothing. So I did a quick Google search and found that it is possible to do this in IE7.

The keen observer will note from that page that the implementation uses the :first-child tag to apply the image to. The problem I observed with this was the image I wanted essentially became a repeating background for the menu item it was to be in front of. So to get around this, I decided to implement a little JQuery script to insert a new element before the menu item.

JQuery:

$(window).load(function () {
    if ($.browser.msie && $.browser.version >= 7 && $.browser.version < 8) {
        var newP = document.createElement('p');
        var newParaText = document.createTextNode("");
        newP.appendChild(newParaText);
        $('#menu-item-selector').before(newA);
    }
});

HTML (in an IE7-specific style tag):

#menu-item-selector>*:first-child {
   background: url('path-to-image');
   height: 5px;
   width: 3px;
   position: relative;
   padding: 0;
   margin: 0 0 0 10px;
}


By inserting a blank <p> before the menu item, the :first-child css would be applied to the P instead of the menu item. And the final result looked like this:



I will note, I didn't feel this was the most graceful approach out there as it uses some of IE7's holes to work, but with our support for IE7 being dropped as soon as our user base drops below 5% on it (currently ~10%), I decided not to worry about it.

About this blog

In order to better mankind or at least the lives of my fellow front-end developers, I felt it responsible of me to begin a blog as a placeholder for my various things learned in the I.T. world. While this will most likely focus on HTML, CSS, etc. There may be times where I deviate and talk about work-related things that were particularly awesome or troubling (I'll have one about putting my boss in his place soon!).

So I hope you enjoy the contents of this blog and/or find them useful. I most likely did.

Thanks for reading.