Rendering responsive images with field_view_field and the Picture module
I've been working on implementing our theme in Drupal 7 and making it responsive. There are a lot of great modules out there that can help you do this, right now I'm using response.js, Omega, Breakpoints, and Picture.
One thing I've came across a few times is rendering image fields and making use of the Picture module.
$header_image = field_view_field('node', $vars['node'], $header_key, array( 'label' => 'hidden', 'type' => 'picture', 'settings' => array( 'picture_group' => 'NAME_OF_PICTURE_GROUP', 'fallback_image_style' => 'NAME_OF_FALLBACK_IMAGE_STYLE', 'image_link => '' ) );
The field_view_field function makes it really easy to render fields. I'd also take a look at hook_field_formatter_info and hook_field_info for more info on how to use the field_view_field function. Also checkout a post called Responsive Images: A Drupal Implementation that describes a great way on how to setup Breakpoints, Picture and your Image Styles. You can also export all of the configuration in a feature.