Diseño web responsivo: Todo se mide en porcentajes creando un diseño fluido y adaptado a la pantalla, la idea es soportar todos los tamaños desktop, tablets, smartphones. El mismo sitio se adapta solo a la pantalla sin necesidad de crear otro sitio.
Diseño web adaptable: Aplica las mismas ideas que el diseño responsivo con la diferencia de utilizar el servidor para detectar el dispositivo y mostrar el diseño correspondiente segun este., osea diferentes templates para diferentes dispositivos mostrando lo necesario para el usuario segun en el caso de tal dispositivo.
Con el tema de las imagenes(tambien con imagenes de fondo) no podes utilizar una imagen grande siendo tu usuario utiliza su celular., tenes que tener en cuenta que tienen conexiones 3G/4G y en muchos paises es una mentira(como el mio). Para eso se utilizan diferentes tecnicas del lado del servidor u cliente como..
adaptive-images.com: Detecta el tamaño de resolucion con javascript, php por su lado crea cachea una imagen proporcional al tamaño(segun entendi).. el problema utiliza cookies.
https://github.com/scottjehl/picturefill: Utilizando javascript definis la imagen segun la resolucion de pantalla.. el problema varios html markup.
https://github.com/teleject/hisrc: Lo mismo que el de arriba solo que utiliza la libreria Jquery y hace el markup en una sola linea.
https://github.com/scottjehl/picturefill: Lo mismo que los dos ultimos.
La razon por que existen varias tecnicas creo que es por que no esta estandarizado aun..