From Two 2 Twelve

8 Tips To Supercharge Your Rails App

posted under web projects

Ruby on Rails is a elegant framework with an abundance of built in functions. However, sometimes finding and implementing the right ones for your project isn't always easy. Here, we'll review 8 lesser-known tips that will enable you to get the most out of your dynamic web application.

Read the rest of this entry

HOW TO: CSS Sprites (Background Image Arrays) - Part 1

posted under web projects

A CSS Background Image Array (also known as a CSS Sprite) is a single image file that contains multiple graphics within it. Using this image file and the CSS background position property you can update all of your website graphics and page titles by editing one file and without changing any code. This technique can also significantly speed up your website’s loading time and help you automatically organize your website’s graphics.

In the first of this 3-part series we’ll cover the steps required to construct a CSS Sprite including the designing, preparing, and XHTML/CSS programming of a sprite, along with the multiple uses that CSS Sprites can be utilized for.

Read the rest of this entry

<

Implementing Standards Into Your User-Driven Website

posted under industry lampooning, web projects

While preforming some intense, in-depth changes for the upcoming release of 72photos I had a small, yet significant epiphany about the standards (or lack of standards) on social network websites and basically any user-content driven website. My epiphany being: These websites are generally ugly and lack a consistent, quality experience.

I became increasingly aware of this when the XMG team and I we’re brainstorming new ways to aggregate users data to create unique avenues for users to explore and browse through content on 72photos. Though, we came up with a myriad of great concepts, unforeseen problems arose late in development. We found the more user-uploaded content we featured, whether it be photos, galleries, or profiles; the more it began to affect the overall quality of the website, and not for the better. This was due mainly to the unpredictability of user content.

Then, I’ve begun to notice this trend throughout the larger, more prominent social websites…The more user content they displayed on their website, the more it affects the overall website quality. After some further research, I’ve reduced this down to 3 factors:

1. User-content is unpredictable, thus unforeseeable pitfalls and issues occur.
2. There is too large of a standards gap between the actual website’s content and user-generated content.
3. These websites just “give up” design-wise and end up aggregating user-content into tables or lists and seem to exclude these areas in the design process entirely.

I’ll forgo the listing of any of the websites who are guilty of the points above and instead, list a few that have risen above these factors.

3 examples of consistent standards in social websites:

• 72photos – Though I may be a little biased on this one (having designed and programmed it myself) I still believe there is a level of quality kept throughout the website, given it’s large amount of user-content.
• PureVolume – With an unhealthy amount of user-based content displayed throughout the entire site, PureVolume has managed to keep the standards up by implementing a level of control and fine-tuning their user’s content.
• Open Source Food – Not a large social network by any means, but good use of CSS and Javascript elements to style their user’s content makes for a smooth, flowing experience when browsing through their site.

So, how does one strive towards displaying all their aggregated user-data while keeping the high quality and standards of one’s website? Not easily…However, here are a few methods that 72photos employed and you can implement to overcome some of these drawbacks:

1. Don’t design “around” your user-content areas, instead, put forth more emphasis on laying out these content areas in interesting ways while designing your website’s pages before you begin implementing anything.
2. Implement CSS techniques / hacks on any featured user-content. For example, when displaying a featured photo from a users profile on your homepage use a PNG overlay or drop shadow on the photo. Perahps even dynamically size images so they don’t bleed over other areas of your page.
3. Truncate and format all user-generated text; removing all illegal characters, links, and anything else that may throw your content flow off.

With a little foresight and some CSS / Javascript trickery you can easily re-gain control of your social website’s design standards. The suggestions above are just a few of many ideas you can implement to keep the design of your site flowing with consistent quality by the end of the week—Win-win.

Anyone In The Market For A MacBook Pro?

posted under apple

It’s been a good run with my ol’ MacBook Pro, however, I couldn’t resist the temptation of the new mercury-free, multi-touch, MacBook Pro goodness.

Anyone in the market for a gently used MacBook Pro? Oh, you are? Excellent! Check out the auction!

New Rails Plugin: OnLooker

posted under web projects

OnLooker is a simple rails plugin that lets a user check the status of his or her website or server. OnLooker uses Ping’s to check via TCP or HTTP whether the site, sites or servers that you specify are online and accessible. OnLooker also supports custom images to distinguish status.

Check out the demo or grab the source.

Have an issue / suggestion for the plugin? drop me a comment below.

<

HOW TO: Ruby on Rails + Passenger on (mt) MediaTemple's (dv)

posted under web projects

After spending 7 painstaking hours attempting to get Rails + Passenger (mod_rails) going on a (dv) VPS I have, I decided to post up my procedure for getting this going (sans the hours spent researching).

This setup wont change much of your current setup, whether it’s a new (dv) or one you’ve been using for a while. I personally preformed the following on my 1 month old, fairly untouched, v3.5 (dv).

Prerequisites
Developer Tools – Install Guide.

Steps

Step 1: Remove all current installations of ruby and ensure sure ruby -v reports nothing.

yum remove ruby

Step 2: Install Ruby v1.8.6 and RubyGems 1.3.1

cd /opt
wget ftp://ftp.ruby-lang.org:21/pub/ruby/1.8/ruby-1.8.6.tar.gz
tar -zxvf ruby-1.8.6.tar.gz
ln -s ruby-1.8.6 ruby
cd ruby
./configure && make && make install
cd ../
wget http://rubyforge.org/frs/download.php/45905/rubygems-1.3.1.tgz
tar -zxvf rubygems-1.3.1.tgz
cd rubygems-1.3.1
ruby setup.rb

Step 2: Install Rails & Passenger Gems and Install Passenger

gem install rails (unless already installed)
gem install passenger
passenger-install-apache2-module

Step 4: Follow the passenger install’s onscreen instructions.

Step 5: chown -R {your_domains_username} {your_rails_app}

Step 6:

service httpd restart

Your Done!

Tips: Ensure your app’s directory is owned by it’s domain’s respective owner, since passenger runs as the apps owner.