Decision de diseño: mostrar imagen en ventana completa

Hola todos, ojalá puedan ayudarme con este dilema. Estoy haciendo un portafolio de ilustración, quiero mostrar las imágenes en grande, como si fueran el fondo de la página, no tengo más que tres botones y el logo, por lo que la opción es viable. Pero no puedo decidir cómo es que se comportarán las imágenes, tengo las siguientes opciones:

1. Que la imagen sea escalada de acuerdo al tamaño de la ventana, pero con proporción fija, introduciendo barras negras en el espacio sobrante. De todas formas habría un límite de tamaño (1920x1080), en tal caso el recuadro se centraría y el resto sería negro.
   
2. La otra es que la imagen se recorte para ajustarse a la proporción de la ventana y se escale de acuerdo a la diagonal, para llenar la pantalla a menos que esta sea muy grande. Me parece más difícil de implementar y no se si valga la pena el beneficio.
   
3. otra? sugerencias?
   

Otra cosa.
Cómo hago para que el div contenedor (wrapper) quede centrado verticalmente de no llenar toda la pantalla?

Puedes hacer algo como esto.

y este es el código que usan, mirándolo así por encimita no se ve muy complicado, lo tuyo seria mirarlo con detenimiento para implementar algo parecido en tu sitio si es lo que buscas.

Saludos.

Wow, es hermoso, gracias!

Aún quiero saber cómo centrar el div verticalmente, para evitar que se pixele la imagen cuando el monitor es enorme.

Supongo que con un margin: auto puedes centrarla, si eso no te funciona con jquery podrías hacerlo realizando algunos cálculos simples:

Código Javascript :

// Guardas el alto de la ventana en una variable
var w_h = $(window).height(),

//Guardas el alto de tu div en otra
wrap_h = $('.wrap').height();

//ya teniendo eso el resto es pura lógica
if(w_h > wrap_h) {

marginTop = (w_h - wrap_h)/2;

$('.wrap').css({
           
      marginTop: marginTop
   })
}

oh! gracias Mancera!