Análise
81 posts
Guia para revisões eficientes de UX e UI
Como conduzir revisões de UX e UI: processos, cenários práticos, testes A/B, acessibilidade e iteração contínua para produtos digitais melhores.
Ler artigoSvelte comparado com React e Vue
Svelte vs React vs Vue: comparação completa de frameworks JavaScript. Análise técnica, performance e casos de uso ideais para cada biblioteca. Escolha!
Ler artigoTailwind CSS: adiciona complexidade; não faz nada
Tailwind CSS: framework utility-first revolucionário. Domine classes utilitárias, customização avançada e desenvolvimento rápido com Tailwind. Use agora!
Ler artigoEditorConfig: padronização automática de estilo de código
EditorConfig: padronize automaticamente estilos de código no projeto. Acabe de vez com discussões sobre tabs vs espaços e mantenha consistência na equipe!
Ler artigo6 vantagens em usar BEM ao escrever CSS
Organize e escale seu CSS com metodologia BEM profissionalmente. Descubra 6 vantagens: nomes de classes compreensíveis, consistentes e fáceis de manter!
Ler artigodpw expo #40 - ApexCharts.js, Sal.js, Moveable, Cropper.js, FilePound
Explore ApexCharts, Sal.js, Moveable, Cropper.js e FilePond no dpw expo. Gráficos modernos, scroll animations e upload/crop de imagens profissional. Teste!
Ler artigodpw expo #39 - International Telephone Input, Focus Overlay, JustGage
Explore International Telephone Input, Focus Overlay e JustGage no dpw expo. Input telefone internacional, overlays de foco e gauges animados. Confira!
Ler artigodpw expo #38 - Jurassic Ninja, typical, gameController.js
Explore Jurassic Ninja, Typical e GameController.js no dpw expo. WordPress temporário para testes, efeitos de digitação e gamepads web. Incrível!
Ler artigodpw expo #37 - roughViz.js, free-for.dev, Swiper
Explore Roughviz.js, Free-for.dev e Swiper no dpw expo. Gráficos estilo sketch artístico, recursos grátis para devs e slider mobile moderno. Teste!
Ler artigodpw expo #36 - React Bolt, Butter Cake, Browserhacks
Explore React Bolt, Butter Cake e Browserhacks no dpw expo. Componentes React ultra rápidos, CMS headless moderno e hacks de navegadores. Descubra!
Ler artigoComo diminuímos nossa bounce rate em 67,55%
Case real: como reduzimos bounce rate em 67,55% com redesign. Aprenda com nossos erros e acertos ao otimizar métricas do Google Analytics. Inspire-se!
Ler artigodpw expo #35 - react-spinners-css, SimpleBar, CopyPalette
Explore React Spinners CSS, SimpleBar e CopyPalette no dpw expo. Loaders React elegantes, scrollbar customizada minimalista e paletas de cores. Teste!
Ler artigodpw expo #34 - Can I email, clipboard.js, Flawwwless ui
Explore Can I Email, Clipboard.js e Flawwwless UI no dpw expo. Compatibilidade HTML email, copiar para clipboard fácil e galeria de designs. Confira!
Ler artigodpw expo #33 - filesize.js, Radial Menu, UI Interactions
Explore Filesize.js, Radial Menu e UI Interactions no dpw expo. Formatação de tamanhos de arquivo, menus radiais e coleção de micro-interações. Veja!
Ler artigodpw expo #32 - Image Map Generator, Divjoy, SVG Artista
Explore Image Map Generator, Divjoy e SVG Artista no dpw expo. Crie mapas HTML clicáveis, apps React e arte SVG profissional. Confira agora!
Ler artigodpw expo #31 - Page Transitions, Hopscotch, Agile CSS Framework
Explore Page Transitions, Hopscotch e Agile CSS no dpw expo. Transições suaves entre páginas, tours guiados interativos e framework CSS leve. Teste!
Ler artigodpw expo #30 - collectorium, perfundo, npkill
Explore Collectorium, Perfundo e npkill no dpw expo. Biblioteca de padrões UI, lightbox minimalista elegante e limpeza de node_modules pesados!
Ler artigodpw expo #29 - TypeLighter.js, Codeimg.io, Vuestic Admin
Explore Typelighter.js, Codeimg.io e Vuestic Admin no dpw expo. Highlight de texto elegante, screenshots de código e dashboard admin Vue.js completo!
Ler artigodpw expo #28 - simplePARALLAX, Gitfolio, CSS Border Animations
Explore simpleParallax, Gitfolio e CSS Border Animations no dpw expo. Parallax ultra fácil, portfólio automático do GitHub e bordas animadas. Teste!
Ler artigoBotões-fantasma (Ghost Buttons)
Entenda a evolução dos botões-fantasma no web design. Descubra quando usar, impacto na conversão e a transição do skeuomorfismo para flat design.
Ler artigodpw expo #27 - Gradient Magic, Text stripes, git-pending
Explore Gradient Magic, Text Stripes e Git Pending no dpw expo. Gradientes CSS prontos incríveis, efeitos de texto e gerenciamento de commits pendentes. Teste!
Ler artigodpw expo #26 - Tabulator, react-image-magnifiers, SuperTinyIcons
Explore Tabulator, React Image Magnifiers e Super Tiny Icons no dpw expo. Tabelas interativas poderosas, zoom de produtos e ícones SVG minúsculos. Teste!
Ler artigodpw expo #25 - List.js, 26 recursos VS Code 2019, Color Thief
Explore List.js, recursos do VS Code 2019 e Color Thief no dpw expo. Listas com busca/sort, extensões essenciais e extração de paletas de imagens. Teste!
Ler artigodpw expo #24 - Animista, Static Site Boilerplate, Humanize Duration
Explore Animista, Static Site Boilerplate e Humanize Duration no dpw expo. Gerador de animações CSS, starter kit moderno e formatação de tempo. Experimente!
Ler artigoExplorações de design visual
Explorações criativas em design visual para web moderna. Tendências, técnicas avançadas e experimentos para criar interfaces impactantes. Inspire-se agora!
Ler artigodpw expo #23 - Frappe Charts, Darkmode.js, Eva Design System
Explore Frappe Charts, Darkmode.js e Eva Design System no dpw expo. Gráficos simples e bonitos, dark mode automático e design system completo. Teste!
Ler artigodpw expo #22 - Shape.so, MoveTo.js, uiGradients
Explore Shapes.io, MoveTo.js e UIGradients no dpw expo. Editor SVG visual interativo, scroll animado suave e coleção de gradientes CSS prontos. Teste!
Ler artigodpw expo #21 - freezeframe.js, Spotlight.js, Microjs
Explore Freezeframe.js, Spotlight.js e Microjs no dpw expo. Controle inteligente de GIFs, galeria de imagens overlay e catálogo de micro-frameworks. Veja!
Ler artigodpw expo #20 - Transfonter, Specificity Calculator, ms
Explore Transfonter, Specificity Calculator e ms no dpw expo. Conversor de fontes webfont, calculadora de especificidade CSS e parser de tempo. Útil!
Ler artigodpw expo #19 - Scene.js, Pressure.js, pixelmatch
Explore Scene.js, Pressure.js e Pixelmatch no dpw expo. Animações baseadas em timeline, detecção de pressão touch e diff visual de imagens. Confira!
Ler artigodpw expo #18 - Zdog, Pickr, CSS Grid Generator
Descubra Zdog, Pickr e CSS Grid Generator no dpw expo #18. Engine 3D pseudo-3D para Canvas/SVG, color picker moderno e gerador visual de grids. Teste!
Ler artigodpw expo #17 - micron.js, Tailwind CSS, Tornis
Explore Micron.js, Tailwind CSS e Tornis no dpw expo. Micro-interações elegantes, utility-first CSS e detecção de eventos do navegador. Teste!
Ler artigodpw expo #16 - CSSFX, iziModal, Tippy.js
Explore CSSFX, iziModal e Tippy.js no dpw expo #16. Efeitos CSS prontos para copiar, modais JavaScript customizáveis e tooltips modernos. Confira demos!
Ler artigodpw expo #15 - iziToast, animate.css, CSS3 Transform
Explore iziToast, Animate.css e CSS3 Transform no dpw expo. Notificações elegantes e customizáveis, animações prontas e transformações CSS. Teste agora!
Ler artigodpw expo #14 - Ikonate, SortableJS, TypeIt
Descubra Ikonate, SortableJS e TypeIt no dpw expo. Ícones SVG totalmente customizáveis, drag-and-drop nativo e efeitos de digitação. Experimente!
Ler artigodpw expo #13 - Buefy, BootboxJS, Uppy
Conheça Buefy, BootboxJS e Uppy no dpw expo. Framework Vue.js com Bulma, diálogos JavaScript elegantes e upload de arquivos moderno. Teste já!
Ler artigodpw expo #12 - Medium Zoom, ICONSVG, Choices.js
Explore Medium Zoom, IconSVG e Choices.js no dpw expo. Zoom de imagens estilo Medium, ícones SVG gratuitos e select boxes customizáveis. Experimente!
Ler artigodpw expo #11 - Perflink, CrumbJS, iro.js
Explore Perflink, CrumbJS e iro.js no dpw expo. Ferramentas essenciais para performance web, breadcrumbs dinâmicos e seleção de cores moderna. Teste!
Ler artigodpw expo #10 - DevDocs, Editor.js, RFS
Explore DevDocs, Editor.js e RFS no dpw expo. Hub de documentação offline, editor moderno por blocos e tipografia responsiva automatizada. Confira agora!
Ler artigodpw expo #9 - Micromodal.js, mockAPI, Color.review
Explore Micromodal.js, MockAPI e Color Review no dpw expo. Modais acessíveis e leves, API fake para testes e análise de contraste de cores. Confira!
Ler artigodpw expo #8 - removebg, Cleave.js, NSFW JS
Explore Remove.bg, Cleave.js e NSFW.js no dpw expo. Remoção de fundo automática com IA, formatação de inputs e detecção de conteúdo impróprio. Teste!
Ler artigodpw expo #7 - Lozad, PulltoRefresh.js, StackBlitz
Explore Lozad, PulltoRefresh.js e StackBlitz no dpw expo. Lazy loading ultra performático, pull-to-refresh mobile e IDE online completa. Teste agora!
Ler artigodpw expo #6 - Rellax, spacetime, AmplitudeJS
Explore Rellax, Spacetime e AmplitudeJS no dpw expo. Biblioteca parallax ultra leve, manipulação de timezone e player de áudio HTML5 elegante. Teste!
Ler artigodpw expo #1: k6, CSS Reference, Coolors.co
Explore k6, CSS Reference e Coolors.co no dpw expo. Testes de carga profissionais, referência CSS completa e gerador de paletas de cores. Essenciais!
Ler artigoRetrospectiva 2018
Relembre 2018 no dpw: breakpoints CSS, CSS Blocks da LinkedIn, otimização de estilos e novo tema do blog. Veja os artigos que marcaram o ano!
Ler artigodpw2019: a nova versão do blog
Conheça o dpw2019 com CSS Grid Layout e ritmo vertical tipográfico. Nova versão do blog com legibilidade aprimorada e design minimalista moderno. Veja!
Ler artigoCSS Blocks: introdução à API
Conheça CSS Blocks da LinkedIn: otimizador revolucionário que reescreve CSS para máxima performance. Introdução à API e casos de uso práticos. Otimize!
Ler artigoLinkedIn anuncia CSS Blocks, o novo otimizador de CSS
Descubra CSS Blocks da LinkedIn: tecnologia que otimiza automaticamente seu CSS. Aprenda como reduzir drasticamente o tamanho dos arquivos CSS. Revolucionário!
Ler artigoPorque CSS Grid é melhor que Bootstrap para criar layouts
Comparativo técnico: CSS Grid vs Bootstrap. Descubra por que Grid oferece código mais limpo, flexibilidade superior e layouts antes impossíveis.
Ler artigoRetrospectiva 2017
Relembre 2017 no dpw: JavaScript this, Motion UI, microinterações e o polêmico DOM. Veja os artigos que marcaram o ano e impactaram a web brasileira!
Ler artigoMotion UI: 4 formas de usar animação funcional
Descubra 4 formas essenciais de usar animação funcional em Motion UI. Feedback visual, navegação, orientação espacial e relacionamento. Anime com propósito!
Ler artigoO novo esqueumorfismo está no assistente de voz
Esqueumorfismo não morreu, migrou para assistentes de voz e AI. Análise sobre como metáforas do mundo real evoluíram para interfaces conversacionais!
Ler artigoDesenvolvimento Orientado a Modinha (DOM)
Cuidado com Desenvolvimento Orientado a Modinha (DOM)! Entenda perigos de escolher tecnologias baseado em hype ao invés de análise técnica. Reflita!
Ler artigoÍcones precisam de labels?
Por que ícones precisam de labels em interfaces. Melhore drasticamente acessibilidade e usabilidade com texto descritivo em UI. Implemente agora!
Ler artigoAccelerated Mobile Pages (AMP): 1 ano depois
Análise do primeiro ano do projeto Google AMP na prática. Descubra estatísticas de adoção, impacto real na performance e resultados de publishers. Veja!
Ler artigoUX, UI, IA, IxD: chega de confusão!
UX, UI, IA e IXD: entenda diferenças e relações entre áreas. User Experience, User Interface, Arquitetura da Informação e Interaction Design. Clarifique!
Ler artigodpw2016
Apresentação do dpw2016 com Foundation Framework, Flexbox e ECMAScript 6. Descubra evolução técnica revolucionária e novos recursos visuais modernos. Confira!
Ler artigoWeb design responsivo com DevTools Device Mode
Web design responsivo com DevTools Device Mode do Chrome. Teste, debug e desenvolva sites mobile profissionais usando ferramentas nativas. Domine!
Ler artigoGenymotion: emulador de Android
Genymotion: o melhor emulador Android para desenvolvimento profissional. Extremamente rápido, confiável e essencial para testes mobile. Experimente!
Ler artigodpw2014 - parte 2: desempenho / performance
Guia completo sobre performance web no dpw2014 - Parte 2. Aprenda técnicas de otimização avançadas, front-end performance e melhores práticas. Otimize!
Ler artigoGulp Fiction
Gulp Fiction: automação front-end de forma criativa e eficiente. Técnicas avançadas, plugins essenciais e workflows para projetos modernos. Automatize!
Ler artigodpw2014
Lançamento do dpw2014 sob nova direção da webfatorial. Conheça a parceria estratégica, novo design moderno e melhorias implementadas. Descubra!
Ler artigoGulp
Gulp: automatize tarefas de desenvolvimento front-end. Configure build, minificação, otimização de assets e workflow eficiente com JavaScript. Automatize!
Ler artigo.htaccess: redirecionamento automático para sites em manutenção
Redirecionamento automático com .htaccess para sites em manutenção. Configure HTTP 503 e páginas temporárias corretamente para preservar SEO. Implemente!
Ler artigoEscolha uma Licença
Escolha a licença certa para seu projeto open source brasileiro. Compare MIT, GPL, Apache e outras licenças com linguagem simples e direta. Decida bem!
Ler artigoUIkit: framework front-end modular responsivo
UIkit: framework front-end modular e responsivo profissional. Alternativa leve ao Bootstrap com componentes elegantes para desenvolvimento ágil. Use!
Ler artigoBower: gerenciador de pacotes front-end
Automatize o gerenciamento de dependências front-end com Bower. Instale, atualize e organize bibliotecas JavaScript de forma simples e eficiente.
Ler artigoAlloy UI: componentes, informações e opiniões
Conheça o framework Alloy UI baseado em YUI3 robusto. Explore componentes front-end profissionais usados por empresas como Cisco e Volkswagen. Descubra!
Ler artigodpw2012: novo tema do desenvolvimento para web
Apresentação histórica do dpw2012 com HTML5 Boilerplate e Twitter Bootstrap. Veja tecnologias revolucionárias e motivações do novo tema responsivo!
Ler artigoJSON: JavaScript Object Notation
JSON: JavaScript Object Notation completamente explicado. Formato de dados essencial para APIs, comunicação cliente-servidor e armazenamento. Domine!
Ler artigoMelhores editores WYSIWYG
Compare os 10 melhores editores WYSIWYG para web: TinyMCE, CKEditor, Quill e Editor.js. Escolha o rich text editor ideal para seu projeto. Experimente!
Ler artigoBreadcrumbs: guia completo com exemplos e melhores práticas
Melhore a navegação do seu site com breadcrumbs eficientes. Guia completo sobre tipos, quando usar, benefícios de usabilidade e implementação correta!
Ler artigo6 mitos de SEO que você deve evitar
Desmistifique 6 mitos comuns sobre SEO que você deve evitar. Descubra a verdade sobre meta tags, custos, palavras-chave e otimização orgânica. Clarifique!
Ler artigo8 características de User Interfaces (UI) de sucesso
Crie interfaces intuitivas e eficazes. Conheça as 8 características essenciais que toda UI de sucesso deve ter: clareza, concisão e muito mais.
Ler artigoBoas práticas de SEO para seu site na primeira página do Google
Guia SEO para iniciantes: boas práticas para primeira página do Google. Técnicas on-page, off-page e estratégias comprovadas de ranqueamento.
Ler artigoComponentes de um sistema de navegação
Conheça os 6 componentes essenciais de um sistema de navegação web eficiente: áreas clicáveis, indicadores visuais, ferramentas e feedback. Navegue bem!
Ler artigoMeta tags
Guia completo de meta tags para SEO e redes sociais. Open Graph, Twitter Cards, viewport e tags HTML essenciais para otimização. Implemente!
Ler artigoDiferenças entre IDs e Classes
Entenda de vez as diferenças entre IDs e Classes em HTML, CSS e JavaScript. Guia completo sobre quando e como usar cada um corretamente. Clarifique agora!
Ler artigoSEO para designers: os erros mais comuns na otimização de sites
SEO para designers: erros comuns em otimização de sites. Entenda como design impacta ranqueamento e evite problemas que prejudicam SEO. Otimize já!
Ler artigoAs melhores práticas de SEO para seu site ou blog melhorar o posicionamento nos mecanismos de busca
Guia completo de otimização para mecanismos de busca. Aprenda técnicas comprovadas de SEO: palavras-chave, URLs, meta tags e estrutura de conteúdo.
Ler artigoIdentificador de fontes
Ferramentas essenciais para identificar fontes de imagens e sites. Descubra tipografias desconhecidas facilmente com recursos online e extensões. Identifique!
Ler artigo