Aguarde...

11 de fevereiro de 2021

21 maus hábitos de front-end a abandonar em 2021

21 maus hábitos de front-end a abandonar em 2021

2020 não foi o melhor ano. Paramos de nos exercitar, começamos a gastar muito tempo no Twitter, comemos muito lixo e geralmente nos deixamos levar – e com razão!

Mas 2021 tem uma chance de ser diferente. Portanto, aqui estão 21 maus hábitos iniciais que seria melhor deixar para trás.

Observação: eu ajudo a executar as pesquisas State of CSS e State of JS . Deixe-nos seu e-mail se quiser saber quando as próximas pesquisas começarão!

1. Reclamação sobre CSS

CSS é aparentemente fácil de entender no início. Quer deixar o texto vermelho? color: red. Estrondo. Mas então as coisas começam a ficar complicadas e, antes que você perceba, você está no Twitter reclamando da centralização de CSS. Eu mesmo estive lá.

Mas quando você olha para a enorme descrição do trabalho do CSS (lidar com todos os tipos de dispositivos em todos os tipos de formatos, sem mencionar os diferentes navegadores e sistemas operacionais), fica claro que o CSS é, na verdade, uma linguagem excelente, especialmente com todas as suas melhorias recentes. E se você não acredita em mim, 76% dos entrevistados na pesquisa State of CSS realmente gostam de escrever CSS!

2. Reclamação sobre JavaScript

Logo após a crítica ao CSS, o número dois do Twitter, Frontend Olympic Sport, deve estar reclamando do JavaScript. Está deixando nossos sites inchados! Dói acessibilidade! É usado demais! Está se infiltrando em nosso CSS!

Mas o JavaScript também está indo na direção certa. O React tem uma história de acessibilidade muito boa . Svelte apareceu e apresentou uma nova maneira de gerar pacotes mais leves. E Next.js está experimentando uma renderização mais inteligente do lado do servidor. E mesmo que você odeie CSS-em-JS , a competição extra pode forçar o CSS “tradicional” a inovar ainda mais.

3. Escrevendo postagens de blog da Snarky sobre a “pilha” de HTML / CSS

Tenho certeza de que você já encontrou um ou dois desses. O autor falará sobre como eles estão perfeitamente contentes usando apenas HTML e CSS, sem frameworks, bundlers ou bibliotecas de qualquer tipo.

E isso é ótimo para eles, mas embora haja muito a ser dito sobre a “eficácia irracional” de manter as coisas simples (e sim, um único package.jsonarquivo desatualizado pode arruinar o seu dia ), a verdade é que muitos dos complexidades surgiram para responder às demandas de uma web em constante evolução. Em 2021, a maioria de nós não está mais apenas trabalhando em páginas de destino simples e estáticas, e HTML / CSS nem sempre é suficiente!

4. Dizendo que CSS do Tailwind é uma abominação

O criador do Tailwind CSS, Adam Wathan, ficou tão acostumado a receber respostas que a página inicial do Tailwind CSS adota um tom quase apologético, prometendo que “se você puder suprimir a vontade de vomitar por tempo suficiente para dar uma chance, […] você se perguntará como você já trabalhou com CSS de outra forma. ”

E com certeza o CSS do Tailwind pode parecer estranho e ir contra as práticas recomendadas tradicionais, mas sua popularidade é certa, e foi uma das grandes tendências no relatório State of CSS deste ano .

E o fato de 87% dos desenvolvedores de CSS do Tailwind estarem satisfeitos com ele é o suficiente para mostrar que ele tem vantagens reais.

5. Dizer que o Tailwind CSS é o Santo Graal do CSS

Ao mesmo tempo, existem bons argumentos contra o Tailwind CSS também. Se você é um usuário de CSS do Tailwind satisfeito, isso é ótimo, mas devemos sempre ser cautelosos para não deixar nossa paixão se transformar em bullying ou dogmatismo .

6. Colocando Banners de Cookies em todos os lugares

Eu sei, eu sei GDPR e tudo isso, mas de uma perspectiva UX, esses banners são uma perda líquida. Se você vai ter um, pelo menos tenha a decência de adicionar seu formulário de inscrição no boletim informativo lá também, para que eu possa dispensar os dois de uma só vez.

7. Usando Cookies

Então, como você mantém esses burocratas de Bruxelas longe de suas costas se você não tem um banner de cookies? Simples, não use cookies! A grande maioria dos aplicativos com os quais interagimos só precisa realmente de cookies para autenticação, e aqueles não exigem um banner .

8. Ter análises do lado do cliente

Se você parar de usar cookies, terá que parar de usar análises e rastreamento do lado do cliente, e eu digo boa viagem! O Google Analytics está classificado entre os aplicativos mais confusos que já usei, nem sempre é tão preciso e, falando por mim, sei que provavelmente analiso apenas 1/1000 de todos esses dados, se tanto (e Deus sabe o que o Google faz com o outro 999/1000).

As análises do lado do servidor são mais confiáveis ​​e muitas vezes podem ser suficientes para rastrear as principais métricas. Então, em vez de tentar rastrear o máximo possível, e se tentássemos rastrear o mínimo possível?

9. Sequestrando o pergaminho do povo

Alguém pode me explicar por que o sequestro de rolagem (quando um site usa JavaScript para alterar o ritmo no qual você pode rolar uma página) se tornou uma coisa? O sequestro de rolagem é o equivalente da web a restaurantes que tocam música tão alta que você nem consegue manter uma conversa. Pare de tornar minha experiência pior ativamente!

Além disso, o CSS agora tem gerenciamento de rolagem nativo , o que permite que você acesse pontos de verificação específicos sem fazer o usuário sentir que está rolando pelo melado.

10. Usando Margem

margindeclaração é provavelmente uma das mais comumente usadas em CSS, mas em 2021 há um pequeno – mas – crescente movimento de desenvolvedores sugerindo que talvez devêssemos parar de usá-la .

Mas se você quiser continuar usando as margens, pelo menos reserve algum tempo para finalmente ler sobre as regras do colapso das margens .

11. Adiando Learning TypeScript

Neste ponto, o TypeScript parece uma inevitabilidade. A maioria das principais bibliotecas JavaScript agora são escritas em TypeScript ou em processo de reescrita. VS Code, o editor de texto mais popular, é escrito em TypeScript e tem suporte TypeScript integrado. E apesar de sua popularidade já alta, TypeScript foi a única tecnologia com a maior progressão ano a ano na pesquisa de 2020 State of JavaScript .

Agora, não estou dizendo que você deve usar o TypeScript para todos os projetos se não quiser –ou precisar–. Mas acho que todos deveriam se familiarizar com sua sintaxe e princípios básicos, porque pode ser útil mais cedo do que você pensa.

12. Usando CSS Hacks

Costumava ser, CSS básico poderia ajudá-lo a deixar a fonte em negrito e estilizar seus links, e tudo além disso era um hack. Precisa centralizar um div? Hack de margem negativa. Precisa ter certeza de que está quadrado? Hack de acolchoamento inferior. Precisa limpar alguns flutuadores? Hack do Clearfix.

Mas não mais! É 2021 e agora existem maneiras sãs e documentadas de fazer o CSS fazer tudo o que você precisa, com a última peça do quebra-cabeça sendo a nova propriedade de proporção de aspecto . O único problema é: sobre o que os desenvolvedores front-end farão um blog agora …?

13. Ignorando o som

Na era do Flash, você não podia abrir uma nova guia sem que alguma música techno ofensivamente ruim (é o que costumávamos chamar de EDM na época) reproduzisse automaticamente para você. Como consequência, a maioria de nós jurou nunca mais construir um site que produza ondas sonoras.

Mas designers como Josh Comeau estão mostrando que é realmente possível usar o som de maneiras agradáveis, até mesmo agradáveis, que aprimoram a experiência do usuário. Lembre-se da primeira regra do design de som da web: SEM AUTOPLAY!

14. Criação de sites para cortar biscoitos

Já se tornou um clichê dizer que todo logotipo é igual. Todas as marcas estão deixando de lado suas marcas peculiares e adotando sans-serifs genéricas, tornando-se brandas no processo.

Mas não há razão para que os sites sigam o mesmo caminho! Vamos passar dos dois sites possíveis e, em vez disso, nos inspirar em pessoas como Lynn Fisher , Wes Bos ou Olivia Ng (entre muitos outros), que têm sua própria maneira de usar tipo, cor, bem como toda a gama de propriedades CSS para construir designs únicos.

15. Usando pontos de interrupção do visor para design responsivo

Há anos, o mantra do design responsivo prioriza os dispositivos móveis, o que geralmente significa começar projetando para o menor tamanho de janela de visualização e subindo a partir daí. Mas e se houvesse uma maneira melhor? Com o CSS Grid, agora você pode construir layouts dinâmicos que redimensionam com base no comportamento de seus conteúdos, não em algum ponto de interrupção estático predeterminado.

Além do mais, os fornecedores de navegadores estão trabalhando arduamente em consultas de contêiner (o recurso mais solicitado ausente no CSS ). Assim que pousarem, eles podem muito bem mudar a maneira como lidamos com a capacidade de resposta para sempre.

16. Ter medo do CSS Grid

Quando confrontado com recursos complexos como o Grid, acho que é comum supor que você precisa dominar tudo isso antes de obter as recompensas de seu trabalho árduo. Mas, neste caso, nada poderia estar mais longe da verdade.

Não vou fingir que sou um especialista em Grid, mas o legal do Grid é que mesmo saber os 10% mais básicos é o suficiente para tornar sua vida muito mais fácil. Então, se você está aprendendo sobre grade, pegue uma folha de cheatsheet e comece a grade !

17. Ignorando acessibilidade

Confesso que no passado fiquei assustado com a lista aparentemente interminável de armadilhas de acessibilidade. Estou usando os elementos HTML corretos? Meu site se degradou normalmente? E se o JavaScript não carregar? Como funciona com leitores de tela? E a navegação pelo teclado?

Mas, em vez de ficar frustrado, minha nova resolução é aprender sobre um novo problema de acessibilidade para cada site que eu construo. Por exemplo, recentemente aprendi sobre uma técnica chamada roving tabindex . Se essas palavras são tão sem sentido para você quanto eram para mim há alguns meses, então por que não usar isso como uma chance de aprender algo novo hoje?

18. Layouts pensantes sempre vão da esquerda para a direita

Enquanto digito essas palavras, observo-as aparecerem na tela da esquerda para a direita. Mas para muitas pessoas em todo o mundo, o oposto seria verdadeiro. Árabe, hebraico e farsi são apenas alguns dos idiomas escritos da direita para a esquerda, e o CSS tem se adaptado para lidar melhor com eles.

As propriedades lógicas permitem substituir direções “absolutas” como margin-rightmargin-leftpor direções “relativas” como margin-block-startedmargin-block-end. Quanto mais rápido pudermos nos acostumar com essa nova forma de pensar, melhor será para a experiência dos usuários RTL em todos os lugares.

19. Sem blogar

O blog está prestes a voltar. Muitos de nós usamos o Twitter como uma válvula de escape, mas é um substituto muito pobre, encorajando “pegadinhas” e críticas em vez de críticas construtivas e pensamento mais profundo.

Com plataformas como Gatsby ou Next.js , os blogs pessoais podem ter todos os recursos de que você precisa – mas também existem alternativas mais simples, como Eleventy, se você estiver atrás de algo mais simples. Ou apenas use uma plataforma como Dev.to ! Qualquer coisa é melhor do que as calorias vazias de mais um discurso retórico do Twitter.

20. Fingir que a tecnologia é neutra

É tentador pensar que a descrição do seu trabalho se limita a garantir que clicar no botão vá para a próxima página, sem se preocupar com o que a próxima página tem a dizer.

Da mesma forma, as redes sociais promoveram durante anos a ideia de que eram plataformas neutras, onde tudo é controlado por um algoritmo e o envolvimento humano deveria ser limitado, na melhor das hipóteses. Mas os eventos dos últimos anos nos mostraram as consequências muitas vezes perigosas dessa abordagem laissez-faire.

Isso não significa que você deve gastar cada minuto do seu dia fazendo declarações políticas; mas também está claro que cada um de nós tem a responsabilidade de garantir que os produtos que ajudamos a projetar e construir não estejam piorando as coisas.

21. Escrever artigos de lista excessivamente longos

Você não odeia esses artigos de lista que continuam e continuam apenas para que possam atingir um número predeterminado arbitrário de itens? O que aconteceu para mantê-lo curto e amável?

Em 2021, vamos deixar esse formato desatualizado para trás … especialmente porque não tenho certeza se poderei inventar 22 coisas na próxima vez!

Postado em Blog
Escreva um comentário