Alfa Jango Blog Engineering, Software, and Entrepreneurship

Communication is about winning. Whenever you engage someone in communication, it is a competition. Who has the better story? Who can talk/write more? Who has the better code? And if you don’t win, you lose.

False.

Fact: if you win a conversation, then you also lose. This is especially true when your conversation must accomplish some achievable goal.

Actionable discussion

Let’s first define “actionable conversation” as that in which we are trying to achieve some explicit goal, whether to persuade someone of something or to find a solution to some problem.

Now, let’s divide actionable conversation topics as one of two types:

Opinion vs opinion

The majority of the time, there is no right or wrong, only opinion and differing opinion. To consider yourself right here is to disregard the differing opinion as decidedly wrong. Be careful, doing this makes it difficult to ever grow and learn.

Fact (true vs false)

Then there are topics for which there is a right and wrong. Let’s say you and I are arguing the solution to 1 + 1 = 2. You say it’s 2, but I say it’s 3. In a technical sense, you are right and I am wrong.

(more…)

CSS3 is great and there is no shortage of amazing showcases highlighting what you can do with a little CSS3 and a lot of time. One popular theme for showing off the capabilities of CSS3 has been creating pure-CSS icons that you’d swear are images (like these or these).

Why other pure-CSS icons are not practical

Complex pure-CSS icons are not practical for use in production websites. They are difficult to maintain and are often only possible with an un-semantic mess of markup. Not to mention, we already have the perfect tool for graphic representations: images. (For more on this, see Faruk Ateş’s post on the subject.)

Why pure-CSS emoticons ARE practical

Think about it, the great thing about emoticons is that they are textual representations that are inherently and immediately recognizable as faces expressing the emotions they represent.

Traditionally, if you wanted to display emoticons graphically on a web page, you used a script (typically javascript) to find and replace text-emoticons with small smiley-faced images that correspond to each emoticon. But if textual emoticons already resemble these faces, isn’t it overkill to completely replace them with images that resemble these faces just slightly more?

Further, inserting images now breaks the ability for visitors to copy and paste the text elsewhere. Well, technically they can still copy and paste, but it completely skips the emoticon images, instead of allowing them to simply copy the original text as written. I.e. The following text:

gets copied and pasted as this:

Notice, the smiley is omitted, potentially altering the context of the original text.

UPDATE: Many browsers will copy the alt attribute text of the image if it is set properly. However, webkit-based browsers, such as Safari and Chrome, do not do this. Thanks for the tip, Faruk Ateş (via email).

Enter our new jQuery plugin / stylesheet. It keeps the text emoticons completely intact, and just gives them a little anthropomorphic nudge with CSS. Now, using pure-CSS emoticons, this:

gets copied and pasted as this:

Benefits of pure-CSS emoticons

There are several reasons to use pure-CSS emoticons over the traditional image-replacement method:

• Keeps text markup semantic (plugin only wraps textual emoticons in a single <span> element).
• Retains original text, as typed, for copy/paste and page indexing.
• Automatically sizes to fit the text. No need for multiple emoticon image sets of varying sizes.
• Does not break the line-height of paragraphs like most of the image-replacement methods.

Check it out

I recently wrote a lightweight jQuery plugin called EasyTabs, and it is now released on the official jQuery plugin website. Most front-end developers are familiar with the jQuery-UI tab plugin. However, it is a very magical plugin with a complex structure, which completely styles your tabs for you, and limits your options when deciding how to structure the tabbed content.

For instance, it is very difficult to place your tabs below the tabbed content with jQuery-UI tabs.. You must perform some crazy CSS trickery, because jQuery-UI tabs forces you to place your <ul> before your content <div>s. Not to mention all of the jQuery-UI styling it does to your tabs by default, making it difficult to override and apply custom stylization to your tabs.

This new plugin, jQuery EasyTabs, is very flexible for the required markup and structure of your tabs and content. Also, it handles only the functionality of creating in-page tabs, leaving all of the styling up to you and your own CSS.

To check it out, see our documentation and demos. Then when you’re ready, you can download it from the jQuery plugins website.

I was just thinking about how often I come across cool projects and libraries people are developing for Ruby. We all know you can create cool web applications Ruby on Rails, but what about all of the other cool things you can do with Ruby. So, I decided to put together a short list with summaries to help me remember why these projects are in my bookmarks. In no particular order:

Nanoc

Nanoc’s website describes it as “a tool that runs on your local computer and ‘compiles’ documents written in HTML, Markdown, Textile, Haml, etc. into a static web site, ready for uploading to any web server.” Basically, it takes your dynamic Ruby code and turns it into static HTML which you can then upload to your server, meaning you don’t necessarily need Ruby installed on your server. Of course, this depends on what your site actually needs to do. But I could see this as a perfect fit for a Blog, for which you write posts on your local machine and deploy. Of course you’d need to implement comments with a third-party javascript widget like Disqus, but that’s just one example.

Mongoid

Mongoid is a Ruby ODM framework for mapping your Ruby application to use MongoDB for object storage. If you haven’t checked out MongoDB as an alternative to using MySQL for your storage needs, it’s worth a look. You may not even realize you have different needs until you discover there’s a database out there to fit those needs. For another cool Database-Ruby integration alternative, see Friendly, a gem that makes MySQL look like a document-store to your application.

(more…)