Imagens com tamanhos dinâmicos


Como uma determinada página pode ser exibida em diferentes dispositivos, que possuem diferentes tamanhos de tela, devemos nos preocupar com a forma como o conteúdo é exibido. Uma primeira abordagem de responsividade para páginas web é fazer com que imagens de diferentes tamanhos sejam exibidas de acordo com o tamanho da janela. Por exemplo:

foto de tamanho grande

Portanto, usando a tag <picture> junto com as tags <source> e <img> podemos exibir uma imagem com tamanhos diferentes, embora o efeito produzido seja um tanto seco.

Reproduzindo audios


Usando a tag <audio> podemos reproduzir um determinado áudio em uma página web. Podemo adicionar controles, ou reproduzir o áudio automaticamente e tocá-lo em loop. Também podemos especificar uma mensagem que será exibida caso o navegador do usuário não suporte áudios. Será esse recurso uma dádiva dos ninjas!?