Cloudbeds Websites - Gerenciamento de imagens e mídias

Objetivo Carregar, organizar, reutilizar e otimizar imagens e outros mídias para o seu site da Cloudbeds.
Ideal para Usuários Gerente/Gerente Geral e Administradores que gerenciam mídias do site ou preparam imagens para um site da Cloudbeds.
Use quando Você precisar adicionar ou organizar mídias reutilizáveis do site, escolher dimensões ou formatos de imagem, ou melhorar o desempenho das imagens.
Requisitos Um site da Cloudbeds e acesso para abrir o Editor do Cloudbeds Websites.
Resultado esperado Sua mídia estará organizada no Gerenciador de Mídia e pronta para reutilização no editor, com imagens dimensionadas e formatadas adequadamente para o uso pretendido.

Introdução

Use o Gerenciador de Mídia no Cloudbeds Websites para carregar, organizar e reutilizar mídias do site a partir de uma biblioteca centralizada. O Gerenciador de Mídia suporta imagens, ícones, vídeos, áudios e arquivos. Este artigo também fornece especificações e orientações de otimização de imagens para que você possa escolher arquivos que exibam bem sem afetar desnecessariamente o desempenho da página.

Use o Gerenciador de Mídia quando precisar construir ou organizar sua biblioteca de mídias reutilizáveis. Quando estiver editando uma página e quiser inserir um recurso existente, use Adicionar > Mídia no Editor do Cloudbeds Websites.

Piscina do hotel e exterior do resort

Conteúdo

Acesso ao Gerenciador de Mídia

Abra o Gerenciador de Mídia no Editor do Cloudbeds Websites sempre que precisar visualizar ou gerenciar ativos reutilizáveis do site.

  1. No Menu Principal do PMS da Cloudbeds Ícone do menu principal acesse Marketing Digital da Cloudbeds e selecione Websites;
  2. Selecione Editar meu site para abrir o Editor do Cloudbeds Websites;
  3. No painel do editor à esquerda, selecione CMS e depois Gerenciador de Mídia.

A navegação do editor mostra o Gerenciador de Mídia sob CMS no painel esquerdo:

Painel esquerdo do Editor do Cloudbeds Websites com CMS expandido e Gerenciador de Mídia selecionado

Carregando e organizando mídias

O Gerenciador de Mídia mantém os ativos reutilizáveis do site em um só lugar. Você pode gerenciar Imagens, Ícones, Vídeos, Áudio e Arquivos na mesma biblioteca.

Você pode usar o Gerenciador de Mídia para:

  • Carregar ou importar mídias: Adicione conteúdo do seu computador ou de serviços em nuvem suportados, incluindo Facebook, Dropbox, Google Drive, Google Fotos e Instagram.
  • Criar pastas: Agrupe ativos relacionados em categorias como logotipos, imagens externas ou tipos específicos de acomodação para facilitar a localização e reutilização.
  • Renomear arquivos e pastas: Use nomes claros que facilitem identificar o ativo ou a categoria posteriormente.
  • Organizar por tipo de conteúdo: Utilize as áreas de Imagens, Ícones, Vídeos, Áudio e Arquivos para trabalhar com o tipo de mídia que você precisa.

 Para assinaturas do Criador de sites da Cloudbeds iniciadas a partir do final de maio de 2026, as imagens existentes no perfil da propriedade e nas configurações de acomodação no PMS da Cloudbeds são importadas automaticamente para a biblioteca do editor.

Use os controles do Gerenciador de Mídia para adicionar e organizar seus ativos reutilizáveis do site:

  • Selecione Nova imagem para carregar uma imagem do seu computador.
  • Selecione Importar imagens para trazer imagens de fontes externas suportadas.
  • Selecione + Adicionar pasta para criar categorias para ativos relacionados, como logotipos, imagens externas ou tipos de acomodação.
  • Use as guias Imagens, Ícones, Vídeos, Áudio e Arquivos para alternar entre os tipos de mídia.
  • Use os controles disponíveis de Ordenar e visualização para organizar e localizar ativos na biblioteca.

O Gerenciador de Mídia abaixo mostra esses controles e os ativos reutilizáveis já disponíveis na biblioteca:

Cloudbeds Websites Media Manager mostrando as guias Imagens, Ícones, Vídeos, Áudio e Arquivos, além de controles de Nova imagem, Importar imagens, Adicionar pasta e ordenação

Usando mídias no editor do site

A mídia adicionada ao Gerenciador de Mídia fica disponível para reutilização durante a edição do seu site. Quando estiver pronto para colocar um ativo existente em uma página, use Adicionar > Mídia no Editor do Cloudbeds Websites e selecione a mídia que deseja usar.

O painel de Mídia mostra os ativos reutilizáveis de Mídia do Site e Mídia Gratuita, com o botão + Adicionar mídia disponível após você selecionar a mídia desejada:

Painel de Mídia do Editor do Cloudbeds Websites mostrando as guias Mídia do Site e Mídia Gratuita, ativos de imagem disponíveis e o botão Adicionar mídia

Requisitos e otimização de imagem

O Cloudbeds Websites cria automaticamente versões menores das imagens carregadas quando necessário, para que uma imagem com tamanho apropriado seja exibida em computadores, tablets e dispositivos móveis. A imagem original não é ampliada, e versões menores são criadas apenas quando a imagem carregada é grande o suficiente para isso.

Requisito Limite
Arquivos por site Até 15.000 arquivos, incluindo imagens, vídeos, clipes de áudio e outros arquivos
Tamanho máximo do arquivo 200 MB por arquivo
Área máxima da imagem 3.145.728 pixels. Multiplique a largura da imagem pela altura para calcular a área total.

Imagens que ultrapassarem os limites suportados podem falhar ao carregar, não exibir miniatura ou não carregar no editor ou no site ao vivo.

 A otimização de imagens pode ser desativada para imagens de fundo suportadas, o Widget de imagem e o Widget de galeria de fotos. Desativar a otimização pode afetar a velocidade e o desempenho da página.

Expanda as seções abaixo para ver os tipos de arquivo de imagem suportados e detalhes sobre compatibilidade com WebP.

Tipos de arquivo de imagem suportados

O Cloudbeds Websites suporta os seguintes tipos de arquivo de imagem:

  • PNG
  • JPG
  • JPEG
  • GIF
  • SVG
  • SVG+XML
  • ICO
  • X-icon
  • WebP

Compatibilidade com WebP

As orientações atuais para imagens suportam imagens WebP nos seguintes dispositivos:

  • iPhone: versão 14 e posteriores
  • Mac/Safari: versão mais recente
  • Chrome: todas as versões
  • Android: todas as versões

Use estas dimensões como orientação geral ao preparar imagens para posicionamentos comuns no site. Escolha o tamanho que corresponda ao uso da imagem, em vez de enviar um arquivo muito maior do que o layout exige.

Uso da imagem Tamanho recomendado
Largura da imagem de fundo 2880 px
Computador 1920 px
Tablet 1280 px
Celular 640 px
Miniatura do blog 160 px ou 300 px

Orientações para imagens por uso

Diferentes componentes do site usam imagens em formatos e tamanhos variados. Expanda a seção relevante quando estiver preparando uma imagem para um local específico.

Imagens do carrousel

As imagens do carrousel geralmente são exibidas em tamanhos maiores e podem se estender por uma ampla área da página. Use imagens com largura suficiente e espaçamento ao redor do assunto principal para que o conteúdo importante não seja recortado quando a imagem for redimensionada.

  • Proporções comuns: 16:9 e 3:4
  • Resoluções comuns: 1600x900, 1280x720 e 1280x960 px

Para carrosseis quadrados, use uma proporção de 1:1. Mantenha as proporções das imagens consistentes dentro do mesmo carrousel para um design mais uniforme.

Os layouts de galeria de fotos suportam uma ampla variedade de proporções de imagem. Combine a proporção da imagem com o estilo de galeria que deseja usar e mantenha as proporções consistentes quando o layout depender de dimensões uniformes das imagens.

  • Galerias em estilo quadrado: proporção 1:1
  • Galerias com imagens altas: por exemplo, 2:5 ou 200x500 px
  • Orientação comum de resolução: use a resolução necessária para o layout, mas evite imagens maiores que 1500 px sempre que possível para melhorar a velocidade da página.

Ícones

Ícones podem usar arquivos PNG transparentes, JPEG ou SVG.

  • Proporção comum: 1:1, embora outras proporções possam ser usadas.
  • Resoluções comuns: 200x200 px ou 80x80 px. Arquivos SVG podem ser escalados sem resolução fixa.

Arquivos SVG podem adicionar mais código a uma página do que arquivos de imagem padrão. Usar muitos arquivos SVG complexos na mesma página pode afetar o carregamento ou a funcionalidade. Quando necessário, converta alguns ícones SVG para formatos de imagem padrão, como PNG ou JPEG.

Favicons

Favicons aparecem na guia do navegador, e não na página do site. O formato ICO é recomendado.

  • Proporção exigida: 1:1
  • Resoluções permitidas: 24x24, 36x36 e 48x48 px

Logotipos

O formato SVG é recomendado para logotipos porque pode ser escalado sem perder qualidade da imagem.

Desempenho da imagem e design responsivo

Use imagens grandes o suficiente para o local onde serão exibidas, mas evite carregar arquivos muito maiores do que o necessário. Imagens excessivamente grandes podem reduzir o desempenho da página sem oferecer uma melhoria visual perceptível após o redimensionamento.

 Combine a imagem original com seu uso pretendido. Por exemplo, se uma imagem for exibida em aproximadamente 300x300 px, evite carregar uma versão de 4000x4000 px, a menos que essa fonte maior seja necessária em outro lugar.

A proporção de tela descreve a relação entre a largura e a altura de uma imagem. Uma imagem de 16:9 pode ter 1600x900 px, 1280x720 px ou outra resolução com a mesma proporção.

Imagens que parecem adequadas em um layout amplo para Computador podem precisar de um tratamento diferente em dispositivos menores. Use os controles disponíveis de visibilidade ou dimensionamento específicos para cada dispositivo quando precisar de um tratamento diferente para layouts de tablet ou celular.


Agora que você sabe como gerenciar mídias reutilizáveis e preparar imagens para seu site da Cloudbeds, use estes recursos para navegação mais ampla no editor, Perguntas Frequentes sobre imagens e fluxos de trabalho com imagens de fundo:

Esse artigo foi útil?
Usuários que acharam isso útil: 3 de 3

Comentários

0 comentário

Por favor, entre para comentar.