AO3 News

Post Header

Published:
2016-01-10 00:05:31 UTC
Original:
Upcoming layout improvements for different screen sizes
Tags:

Quando o Archive of Our Own - AO3 (O Nosso Próprio Arquivo) foi redesenhado em 2011, a maioria das pessoas acedia ao site a partir de dispositivos de secretária, pelo que o layout e o sistema de estilos foram desenhados a pensar em ecrãs de maiores dimensões. Muito mudou nos útimos quatro anos e a maioria do nosso tráfego realiza-se agora a partir de dispositivos com ecrãs pequenos, como tablets e telemóveis, pelo que vamos fazer algumas alterações ao nosso layout e sistema de estilos para refletir esta nova realidade.

Atualmente, o AO3 determina o melhor layout para ti com base na largura da janela do teu navegador em pixels. Se a janela do teu navegador tem 640 pixels ou menos, é-te apresentada uma versão do layout com uma única coluna. Caso contrário, é-te apresentado o layout predefinido.
No entanto, o nosso layout predefinido foi desenhado para ecrãs maiores e por isso se o teu navegador tiver entre 640 e 1024 pixels de largura, páginas do Painel com filtros podem não ter a melhor aparência possível:

A página de obras de um membro com o Painel, as obras e os filtros dispostos em três colunas. A visualização dos filtros é parcialmente obstruída devido ao tamanho do ecrã.

Em breve, iremos adicionar uma nova divisão no código para ajudar quem estiver a visualizar uma versão ligeiramente espalmada do AO3. O layout resultante corresponderá a um ponto intermédio entre o layout predefinido e o móvel: o Painel aparecerá no topo do conteúdo principal, logo abaixo do menu de navegação principal, mas os filtros continuarão a estar no lado direito da página.

A página de obras de um membro com o Painel no topo e o conteúdo principal e os filtros dispostos em duas colunas.

Também iremos deixar de usar pixels para definir estas divisões, passando antes a usar uma unidade relativa designada por em. A unidade em baseia-se no tamanho de letra e utilizá-la para definir as nossas divisões significa que o layout do AO3 irá funcionar melhor para qualquer pessoa que tenha mudado o tamanho da letra predefinido no seu navegador. Por exemplo, definir o tamanho de letra como Muito Grande no Google Chrome corta algum do texto nos filtros e faz com que as informações da obra apareçam muito estreitas e compridas, mesmo que estejas a visualizar o AO3 numa janela com 1024 pixels de largura.

A página de obras de um membro com o tamanho de letra do navegador definido como Muito Grande e o Painel, conteúdo principal e filtros dispostos em três colunas. Os filtros encontram-se quase completamente ocultos.

Assim que adicionarmos a nova divisão, o Painel irá aparecer no topo da página, dando mais espaço aos filtros e informações de obra e tornando mais fácil navegar a página:

A página de obras de um membro, com o tamanho de letra do navegador definida como Muito Grande. O Painel encontra-se agora no topo da página e o conteúdo principal e os filtros aparecem em duas colunas.

As novas divisões de 42em e 62em poderão ser usados em estilos. Quaisquer estilos que usem a divisão atual de 640px serão convertidos automaticamente para a nova definição de 42em.

Estas divisões não correspondem às dimensões de nenhum dispositivo em particular — há demasiados dispositivos para que essa abordagem fosse prática — mas baseiam-se antes no ponto a partir do qual o layout predefinido do AO3 começa a encontrar problemas. Temos noção de que isto não é o ideal para quem cria estilos e escolheu reconstruir o layout na sua totalidade, mas deverá ser uma mudança positiva para a maioria das pessoas que utilizam estilos e estamos a analisar a possibilidade de adicionar divisões personalizáveis no futuro, para que consigas abranger todo e qualquer dispositivo que utilizes para navegar no AO3.

Como sempre, se tiveres quaisquer questões ou encontrares algum problema, por favor contacta a nossa equipa de Suporte, que ficará contente em ajudar!

Este artigo de notícias foi traduzido pela equipa voluntária de tradução da OTW. Para saberes mais sobre o nosso trabalho, visita a página de Tradução em transformativeworks.org.