Fornecimento de recomendações no site

Para preencher o título de primeiro nível, considere os seguintes pontos:

• Cabeçalhos de primeiro nível devem conter o título mais importante da página, geralmente o título do documento, para transmitir o que é a página.

• O Gerador de sites de carreiras adiciona automaticamente uma tag <h1> para cada página, a partir do Título da página, mas normalmente não é exibido. O site ainda atende às diretrizes de acessibilidade.

• A página inicial de um site do Gerador de sites de carreiras acessará o Título da página em Configurações→Configuração do site→Informações do site, mas não será exibida na página.

  

• Para outros tipos de página, o tag é retirado do Título da página para essa página e está oculto por padrão.

• Nas páginas Categoria, no entanto, a tag pode estar visível ou oculta.

Para verificar se existem cabeçalhos vazios, considere os seguintes pontos:

• Leitor de tela e usuários de teclado geralmente navegam por elementos de cabeçalho. Um título vazio não apresentará nenhuma informação e poderá introduzir confusão.

• Basicamente, qualquer elemento que tenha um cabeçalho deve ter o mesmo preenchido, mas você pode ocultá-lo.

Considere o seguinte ao escolher imagens:

• Use imagens com um ponto focal forte porque elas capturam a atenção do usuário.
• Use um ponto focal consistentemente colocado para controles deslizantes de imagem.
• Use uma seleção diversificada de imagens para manter os usuários engajados.
• Considere a diversidade em segundo plano/primeiro plano, local e assunto.

Identifique o ponto focal "Zona de segurança" por componente.

• A "Zona de Segurança" por componente varia de acordo com a altura/largura de como foi configurada para exibição no desktop/tablet/celular.

• Identifique a "Zona de segurança" visualizando as dimensões finalizadas de seu componente em cada tipo de dispositivo.

Imagens recortadas largas permitem versatilidade das seguintes formas:

• Mais flexibilidade para elementos adicionais de corte e sobreposição no layout

• As imagens podem ser facilmente modificadas em uma variedade de componentes e layouts 

Ao usar o componente Imagem Grande, considere otimizar a imagem para celular e adicionar o componente duas vezes, uma para desktop/tablet e outra para celular. Isso é especialmente útil se houver texto na imagem. No entanto, se houver muitos componentes na página, restrinja a duplicação de componentes de imagem para evitar longos tempos de carregamento da página. 

As imagens são fornecidas pelo cliente, concedendo acesso a uma biblioteca de imagens, logon em um site de fotos ou um arquivo zip de imagens.

• O cliente é responsável por fornecer imagens que estejam em conformidade com as diretrizes. Direcione-os para recomendações de imagem no guia Configuração e atualização do SAP SuccessFactors Recruiting no SAP Help Portal.

• É necessário um mínimo de 15 a 20 imagens de marca de emprego de alta resolução.

• Os seguintes tipos de mídia podem ser usados no Gerador de sites de carreiras: GIF, ICO, JPG, JPEG, PNG, SVG.
  • As imagens de gráficos vetoriais escaláveis (SVG) são renderizadas corretamente, independentemente do tamanho da tela ou do layout. Por esse motivo, uma única imagem SVG do logotipo do cliente pode ser usada para layouts desktop e móvel do site de carreiras.
  • Se a imagem precisar ser redimensionada, o cliente poderá usar um aplicativo para redimensionar arquivos SVG grandes para o tamanho desejado.

• Todas as imagens do Gerador de sites de carreiras devem ser orientadas como paisagem, não como retrato.

• Inclua texto alternativo para cada imagem para melhorar a acessibilidade do site. Consulte a seção Acessibilidade para obter detalhes.

• Para imagens de fundo, escolha padrões e cores sutis.

• O texto em imagens é uma prática web datada e não é recomendada.

• Os controles deslizantes de imagem não são uma prática recomendada.

Texto alternativo (também referido como texto alternativo ou tags alt) são usados para descrever as imagens em sua página da Web. É importante adicionar texto alternativo às fotos em seu site pelas seguintes razões principais:

• Se as imagens não forem carregadas: Se, por qualquer motivo, uma imagem não for renderizada em uma página da Web, a tag alt será exibida em seu lugar. Isso significa que os visitantes dessa página da Web entendem qual imagem deve estar lá, mesmo que eles não possam vê-la.

• Para motores de busca: motores de busca, como Google e Bing rastreiam regularmente páginas da web. É fácil para eles entender cópia de texto em uma página, no entanto, as imagens são difíceis de ler. É aqui que vem o texto alternativo para jogar. O texto alternativo é usado para descrever aos mecanismos de pesquisa o que a imagem está mostrando, permitindo que eles forneçam aos usuários melhores resultados ao executar uma pesquisa de imagem. O texto alternativo também melhora o valor de SEO do site.

• Para leitores de tela: Alguns usuários usam leitores de tela para navegar nas páginas da web. Esses leitores de tela identificarão e interpretarão o que está sendo exibido em sua tela. Por esse motivo, é importante transmitir informações contextuais no texto alt que explicarão a imagem mais detalhadamente.

O texto alternativo deve ser preenchido para todas as imagens, em todos os idiomas. Insira um texto alternativo exclusivo para cada imagem. Inclua qualquer conteúdo único ou relevante sobre a imagem. Adicione texto alternativo da janela Seletor de imagem. Você pode adicioná-la ao carregar uma imagem ou adicioná-la mais tarde.

Certifique-se de fornecer também texto alternativo para logotipos.

Para verificar imagens próximas que têm o mesmo texto alternativo, considere o seguinte:

• Quando duas imagens têm o mesmo texto alt, isso geralmente causa redundância ou indica texto alt incorreto.

• Remova a redundância desnecessária e certifique-se de que o texto alternativo para cada imagem seja apropriado.

• A única vez que você não precisa incluir texto alternativo é quando a imagem é usada como uma imagem decorativa de fundo.

Algumas considerações sobre texto incorporado em imagens incluem o seguinte:

• O texto incorporado não pode ser lido por leitores de tela ou mecanismos de pesquisa.

• A principal prática é não usar texto incorporado em imagens.

• Se o cliente quiser reter imagens que contenham texto incorporado, adicione texto alternativo à imagem.

• Observe que as ferramentas de acessibilidade da web, como o WAVE, não podem detectar texto incorporado em imagens.

Para verificar a existência de links vazios, considere os seguintes pontos:

• Se um link não contiver texto, a função ou o objetivo do link não será apresentado ao usuário, o que pode criar confusão para usuários de leitor de tela.

• O problema mais comum é aproveitar o texto incorporado em imagens como um link.

• Remova o link vazio ou forneça o texto do título dentro do link que descreve a funcionalidade e/ou o destino do link. Ou adicione texto alternativo à imagem.

Para substituir ou remover texto de título redundante, considere os seguintes pontos:

• Qualquer coisa que tenha um link também deve ter uma tag de título. O texto do título geralmente aparece quando o usuário passa o mouse sobre um link.

• O texto do título é usado para fornecer informações de consultoria; especificamente, ele deve indicar o que o link realmente faz. O que está especificamente nessa página? O que você vai aprender lá?

• Como prática principal, o texto do título deve ser diferente do nome do link, mas é melhor usar texto de título redundante do que não preenchê-lo.

Em algumas áreas, o produto duplica o texto do link como texto do título em background, por isso não é marcado como um erro de acessibilidade. Não há como modificar isso.

Considere os seguintes pontos ao remover links redundantes:

• Quando os links adjacentes vão para o mesmo local (como para uma página do produto), isso resulta em navegação e repetição adicionais para leitores de tela e usuários de teclado.
• Os links adjacentes que vão para o mesmo local devem ser combinados, ou um deve ser removido.
• Três componentes de coluna utilizam o mesmo link para o cabeçalho, link e imagem, como mostrado na figura. Isso não pode ser modificado. Você pode remover o link da imagem como mostrado na segunda imagem na figura, ou você pode remover o cabeçalho e/ou link separado.

O formato original da grade de pesquisa não atende às diretrizes de acessibilidade e dificulta que as pessoas com deficiência visual encontrem vagas no site de carreiras.

Trabalhe com seu cliente para ativar o modelo de dados unificado para que os candidatos possam usar a funcionalidade de pesquisa acessível ampliada.

O Mapa de vagas do Google é mantido externamente e não cumpre todas as diretrizes de acessibilidade.

Os clientes podem agora configurar o mapa para exibir uma mensagem anteriormente oculta que só era legível a partir de um leitor de tela. No Componente do Google Map, ative Mostrar título. Em Ferramentas→Traduções, altere o texto fornecido. Clique no link para abrir uma página preenchida com uma barra de pesquisa e resultados de pesquisa.

A SAP não hospeda vídeos. Direcione seu cliente para primeiro publicar os vídeos do site de carreiras no YouTube, Wistia ou Vimeo. Os clientes precisam fornecer o caminho direto para o local onde o vídeo está hospedado online.

• Uma opção é fornecida para ativar a reprodução automática, mas é importante observar que não é a melhor prática.
• Mantenha os vídeos curtos. A duração recomendada é de 30 a 60 segundos.
• Inclua um título informativo e uma breve descrição para o vídeo.