Frontend Guidelines – Questionário

HTML

• HTML semântico, autoral e acessível (guia)
• Markup compatível com padrões W3C, uso criterioso de landmarks/aria.
• Comentário: <!-- Explicação clara sobre o bloco -->

• Uso de preprocessador (ex: HAML, Pug) se facilitar sintaxe.
• Motores de template, ex: Mustache.
• Padronização conforme backend e nomenclaturas influentes.

• Indentação: 2 espaços.
• Comentários descritivos em blocos.

CSS

• Modularidade, reutilização e nomeação consistente (CSS Guidelines)
• Metodologias como BEM/OOCSS/SMACSS (SMACSS | BEM)

• Pré-processador (Sass/Less) e guidelines (Sass)
• Base normalize.css ou reset.css
• Uso de autoprefixer/postprocessors.

• Indentação: 2 espaços; propriedades agrupadas; comentários com /* Comentário */

JavaScript

• CLARIDADE, modularidade e uso de padrões documentados (Airbnb)

• Preferir frameworks/componentes estáveis (React/Vue/Angular).
• Testes unitários com Jest/Jasmine e linter ativo.

• 2 espaços, comentários // Comentário breve e padrões como módulo, singleton.

Mídia

• Ícones em SVG ou font icons; imagens responsivas via srcset e otimização automatizada.
• Ferramentas: Otimização

Fontes

• Fontes web via @font-face, Google Fonts ou serviços third-party.
• Apoio em ferramentas como Font Squirrel.

Performance

• Orçamento de performance: testado com Lighthouse/PageSpeed.
• Compressão GZIP, imagens otimizadas.
• Ferramentas workflow: WebPagetest, Speedcurve.

Acessibilidade

• Checklist A11Y Project, uso de ferramentas de avaliação automática.

Ferramentas/Tarefas

• Task runners: Grunt/Gulp, dependency manager: NPM/Yarn.
• Linter configurado (EditorConfig) e automação.

Versionamento

• Git / GitHub com workflows claros (gitflow).

Suporte & Otimização

• Lista de dispositivos/browsers otimizados.
• Uso de sistema de suporte escalonado (Graded browser support).

Localização

• Implementação multilíngue e padrões de regionalização adequados.

Deploy/Integração

• Integração contínua (CI/CD) e deploy automatizado (Netlify/Vercel).

Documentação

• Guia vivo, versionado via repo, exemplos: Pattern Lab
• Responsáveis documentados no rodapé.