A maioria das telas de desktop e laptop hoje em dia tem uma largura maior que a altura. A tela é "larga" e não "alta". Os telefones inteligentes fizeram algo muito legal, permitindo que a orientação do telefone influencie a forma como o conteúdo é apresentado.

Eu gostaria de fazer isso com consultas de mídia, para que, se alguém em um mac com um monitor grande tiver a janela do navegador dimensionada para que seja muito "alto" (a altura é maior que a largura), ele verá um cabeçalho e um rodapé. Mas se eles fossem em tela cheia ou "largos" (a largura é maior que a altura), eles veriam uma barra lateral à esquerda e talvez também a direita.

Eu estou tentando tirar proveito de telas largas e orientações e tal. Como fazer isso com consultas de mídia ou javascript?