O novo visual do Manual do Usuário

Deixei as outras novidades do Manual do Usuário para fevereiro a fim de colocar logo no ar o novo layout do blog. E aí, gostou?

Ele é responsivo, o que significa que se adapta automaticamente às telas menores de tablets e smartphones. É nas grandonas, porém, que o layout brilha — dê uma olhada no review do Moto X, já adaptado. Dá para colocar fotos enormes no meio do texto, vídeos, preencher as laterais com gráficos e imagens menores… Fica lindo.

Alguns detalhes precisam ser arrumados, como o “Responses”/”Comments” não traduzido, mas o grosso está pronto. Se flagrar alguma coisa fora do lugar, deixe um comentário aí embaixo.

E não ache que isso é tudo. Tem mais coisa boa a caminho. 2014 será divertido.

3/1/2014, às 18h25

Deixe uma resposta

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *

32 comentários

  1. Gostei muito do novo visual do Manual do usuário! A navegação ficou bem primorosa em dispositivos móveis. Sinto uma leve inspiração do Medium, que para mim se tornou o formato ideal de leitura de artigos. Parabéns Ghedin!

  2. Achei muito elegante. É visualmente agradável, carrega muito rápido e não tem excessos.

    Além disso, os comentários possuem as letras do mesmo tamanho do texto principal, o que para mim leitor de comentários* facilita a leitura.

    *Pois é, vida difícil…

    1. Meus sentimentos por você, leitor de comentários. Sua vida não é ~fassio~ mesmo.

      P.S. Layout muito bom mesmo, até agora nenhum problema.

  3. Caramba! Adorei!! Especialmente pela barra na lateral esquerda que mostra “publicado por Ghedin”, etc, se fosse em um site normal, aquilo ia ocupar toda a lateral, do topo do site até o fundo. Mas não, no seu caso só ocupa um espaço alí no topo e depois as fotos ocupam o espaço. Não sei se fui claro, mas gostei, continue assim!!

    1. É meio chato mesmo. Já perguntei e recebi a receita de bolo do suporte para que os comentários apareçam abertos de cara, só falta tirar meia horinha para mexer no código e mudar isso.

  4. Gostei Rodrigo! Ficou muito bonito e continua com um visual clean. Mas percebi que parecer haver um problema com as fontes, misturando a atual (não sei qual é…) como Times New Roman, em alguns palavras do texto… Fora isso. Tá show! Belo trabalho. Parabéns!

  5. Olha Ghedin,
    Sexy sem ser vulgar. Apenas.
    Lacrou o [autocensurado] dazinvejoza.
    #please come to brazil

    Só acho que sobre a newsletter ou RSS tinham que ter mais destaque e um “call to action”. Avalio a sua como a melhor newsletter brasileira (não estou puxando saco).

    E também concordo com o cara que pediu o Disqus. Acho que hoje é a mais eficiente plataforma de comentários, pois ela se automodera (através do IP para positivar e do registro para negativar?) e dá destaque a eventuais comentários interessantes que possam surgir.

    1. Poxa, que honra! :-) Valeu mesmo.

      Uma saída seria colocar o formulário da newsletter entre o post e os comentários, como fazia com o bloco de doações no layout antigo. Considerarei isso.

      E quanto ao Disqus, seus argumentos são bons. Antes de lançar o Manual, queria um plugin que me permitisse destacar visualmente os comentários mais legais. Infelizmente o orçamento para o desenvolvimento dele saiu meio salgado e acabei abandonando a ideia.

      Fico com um pé atrás em implementar o Disqus ou qualquer outro sistema de comentários pelo receio de perder a simplicidade e velocidade que o nativo do WordPress dá. Ele é espartano, mas… funciona. E bem. Vou pensar mais sobre isso.

  6. Ficou elegante, exceto pela imagem do topo ocupando espaço enorme e excesso de branco (bastante incômodo às vistas – a imagem lateral do antigo layout amenizava neste aspecto).

    1. Obrigado, Paulo!

      Você usa a janela maximizada e seu monitor tem uma resolução alta, certo? A maioria dos sites é branca no fundo, acho difícil fugir disso sem prejudicar a estética do layout.

      A imagem do topo tem ~330 pixels de altura, mas ajuda a dar forma ao layout. Acho que vale a troca.

  7. Deve ser a primeira vez que comento aqui, mas sigo esse blog desde sempre.

    Ficou bem bacana o layout novo. Só sugiro usar a formatação justificada, é mais agradável de ler e esteticamente melhor. Talvez fosse interessante também mudar a fonte aqui nos comentários, que aparentemente é do mesmo tipo e tamanho que a do corpo do texto.

    1. Valeu, Eduardo!

      Sobre o justificado, prefiro alinhado à esquerda. É curioso como isso varia de pessoa para pessoa, mas acho alinhado à esquerda mais agradável de ler — você tem um gancho visual, o comprimento disforme das linhas, para seguir a leitura sem correr o risco de reler uma delas. Há muita discussão sobre qual alinhamento é melhor, só ainda não ouvi argumento convincente de quem prefere justificado.

      Sobre a diferenciação da fonte nos comentários, de fato ela não existe. E fiquei curioso: você acha legal mudá-la aqui? Por quê?

      1. Eu concordo com o colega. Acho legal mudar a fonte nos comentários para uma um pouco menor da fonte usada no post. O meu argumento é que assim os comentários ficam mais “separados” do post, facilitando a identificação do seu início. Isso é especialmente proveitoso quando voltamos a um post que já lemos e queremos apenas ver os novos comentários. Em uma rolagem rápida fica fácil identificar o início dos comentários pela diferença de tamanho da fonte.

      2. Caramba, depois que vi sua resposta fui pesquisar sobre o tema do alinhamento e fiquei surpreso com a enorme discussão sobre ele! Não imaginava mesmo que esse detalhe fosse tão polêmico.

        Vi argumentos para o alinhamento à esquerda. Alguns fazem sentido, outros me soaram exagerados, forçados.

        1) Melhora a acessibilidade a quem tem deficiências cognitivas.
        Pode até ser verdade (deve haver estudos científicos sobre isso, mas nem pesquisei esse subtema), mas de qualquer maneira, fico curioso em saber como essas pessoas se viram com os materiais impressos, que normalmente vêm justificados.

        2) Evita os rios de branco.
        Achei engraçado esse, hehe! Até fui conferir em alguns trabalhos da faculdade, todos justificados (norma do departamento), e sinceramente não encontrei nenhum na amostra aleatória que peguei aqui. E esse problema não é evitado totalmente com o alinhamento à esquerda, só diminui (bastante) a probabilidade. De qualquer maneira, como esse fenômeno aparentemente é raro na prática, acho que não há muito por que se preocupar com isso.

        3) A irregularidade dos finais de linha ajuda a marcar a posição da leitura.
        Esse argumento foi o que você escreveu. Nem tinha pensado nisso, mas faz sentido. Eu marco minha posição de leitura diferente. Quando termino de ler uma linha, meus olhos já voltam rapidamente para o começo da mesma linha (à esquerda), enquanto pulam para a linha de baixo, assim evito o risco de reler. Mas esse processo deve variar de pessoa para pessoa, e eu mesmo só percebi agora, que inconscientemente faço assim.

        Quanto a argumentos a favor do alinhamento justificado, eu realmente não tenho, ou pelo menos nada “racional”. É apenas a estética mesmo, me parece mais “elegante”. Talvez seja o fato de estar acostumado com esse estilo em materiais impressos e em trabalhos acadêmicos. Na web o mais comum é estar alinhado à esquerda mesmo. Mas confesso que dá uma vontade a mais de ler aquele artigo bacana que encontrei web afora quando ele está com uma tipografia legal, tamanho de letra adequado, sem propagandas e justificado. Por isso que sou fã de serviços como o Pocket, ou até de alguns leitores RSS (testei no iPad o Newsify e o Mr. Reader que você comentou em outro post, e acabei ficando com o segundo. Acho que valeu a compra, estou gostando bastante. Valeu!).

        Já sobre a diferenciação da fonte nos comentários, minha sugestão é apenas para “demarcar” melhor cada seção da página, com uma identidade própria — e coerente com as demais. Da mesma forma que o cabeçalho está com um estilo de fonte, a barra lateral outro, o rodapé outro, o título do texto outro, acho que os comentários ficariam melhores com um estilo diferente do do corpo do texto. Nada radical, só uma fonte um pouquinho menor, ou em cinza escuro, algo que dê mais destaque ao texto, e diferencie visualmente os comentários.

        1. Que pesquisa, Eduardo! Massa :-)

          A única justificativa plausível que já ouvi para justificado é a diagramação em colunas — no caso, algo muito mais comum no impresso.

          Darei uma olhada na fonte dos comentários, vou diminui-la um pouco, dar uma diferenciada para a do post. Valeu pelo feedback!

  8. Tomei um susto quando abri o site! Hoje de tarde não estava assim hahahaha

    Aproveitando, notei um problema com as fontes. Ela muda em alguns trechos do artigo e até nos comentários (como no trecho “preencher as laterais com gráficos e imagens menores…”).
    Já tentei dar um refresh com Ctrl + F5, mas ainda aparece estranho aqui, talvez ainda tenha algo em cache.

    1. É algum problema com o tema mesmo. No meu notebook (Windows 8.1, resolução de 1600×900) ele não acontece, mas no desktop (Windows 7, temporariamente em uma tela com resolução 1280×1024), vejo esses trechos em Times New Roman.

      Abri um chamado para o suporte do tema, logo eles se manifestam para, espero, resolvermos isso.

  9. Achei bonito, mas a imagem no topo não está muito escura, não tem combinado com o clima do site e com a imagem mais alegre do seu blog pessoal e página pessoal.

    Vejo muito para lo meu tablet e tem respondido bem.

    1. Mais alguns comentários.

      Achei fantástico a foto do topo mudar no artigo do Moto X. Mas o post demorou para carregar no meu Nexus 10. Não carregou por completo, foi carregando aos poucos e sempre de maneira picotada. O rodapé está com um bug, conforme rolo a página ele vai aparecendo o que diminui muito a área de leitura e fica feio e estranho.

      1. Obrigado, Pedro!

        Sobre os pontos que levantou:

        Imagem grande/escura: testei várias ali em cima, acabei optando por essa cena da vida noturna de Taipei. Não tem muito a ver com tecnologia, nem nada do tipo, mas acho ela… aconchegante, e casou bem com o topo. Talvez mude e, como você reparou, dá para trocá-la em posts específicos. Farei uso disso sem que convir.

        Lentidão: o Manual está em um plano básico da Media Temple, logo não é o servidor mais rápido do mundo. Posts com imagens grandes, como o review do Moto X, ficaram mesmo mais pesados devido às imagens grandonas. É um contra que, acho eu, se justifica pelas belas imagens em tela cheia. Estou sempre atrás de soluções para otimizar e agilizar as coisas, porém.

        Rodapé: ele aparecer aos poucos, de acordo com a rolagem, é intencional — um efeito chamado paralaxe. Acho que dá um toque estiloso ao layout.

        1. O problema que eu comentei sobre o rodapé parece ter sido resolvido. Não sei se mexeu nos códigos da página ou se a atualização do Nexus 10, mas agora ele aparece de maneira mais fluida e agradavel. Antes ele vinha de forma abrupta e picotada, destruindo por completo a experiência proposta pelo blog.

          Ficou realmente fantástico.

  10. Gostei do leiaute. Principalmente por causa da foto no topo. Preferiria que o sistema de comentários fosse o do Disqus. Mas sei que já é pedir demais.

    1. Talvez não seja pedir demais, mas preciso de argumentos para ser convencido :-)

      Já fui muito entusiasta do Disqus (enchi tanto o saco no Meio Bit que mudaram e estão com ele até hoje), mas nesses últimos anos passei a ver o sistema, esse e outros terceiros, como “intrusos” no blog. Gosto do sistema nativo do WordPress, a despeito da sua simplicidade, pela velocidade e integração que tem com o resto do blog.

O site recebe uma comissão quando você clica nos links abaixo antes de fazer suas compras. Você não paga nada a mais por isso.

Nossas indicações literárias »

Manual do Usuário