you need to have predefined image sizes, WP have 3 default sizes as 100x100 thumbnail, 300x300 medium and 800x800 large, and I have an aditional size called img-polaroid 700x320 defined on functions.ini.
So the code to get images is:
$image_id=get_post_thumbnail_id();
$image_url = wp_get_attachment_image_src($image_id,'img-polaroid');
$image_url=$image_url[0];
'img-polaroid' is the '$size' retreived 700x320, and the way to print the image is:
img src="php echo $image_url" class="img-polaroid" style="margin:5px 0px 15px;"
Where class="img-polaroid" is the real size to print like 100x100 or 200x100 with style of polaroid photo defined on CSS styles; or you can use inside img html code heigh=100 wight=100. with both methods the image will be clear and good definition. for my purposes img-polaroid has a size 320x200 and defined also as responsive size.
If you get the image $image_url = wp_get_attachment_image_src($image_id,'thumbnail'); and tries to print on higher size the image will be blurred. ***
So try to get the image size closest to the size you need to print to not overload your page