dpw expo #16 – CSSFX, iziModal, Tippy.js

CSSFX, site com diversos efeitos CSS para copiar e colar; iziModal, plugin jQuery para modais elegantes e; Tippy.js, para fazer tooltips animados variados.

dpw expo #15 – iziToast, animate.css, CSS3 Transform

iziToast, lib JavaScript para notificações; animate.css, uma das mais tradicionais para animações CSS e; CSS3 Transform, para transformações em CSS.

dpw expo #14 – Ikonate, SortableJS, TypeIt

Veja Ikonate, para montar kits de ícones vetoriais; SortableJS, para listas reordenáveis via drag&drop e; TypeIt, utilitário JS para animação de digitação.

dpw expo #13 – Buefy, BootboxJS, Uppy

Conheça Bufy, lib UI feita com Vue.js + Bulma; BootboxJS, para modais usando Bootstrap e; Uppy, biblioteca JavaScript para uploads de arquivos.

dpw expo #12 – Medium Zoom, ICONSVG, Choices.js

Medium Zoom, para zoom em imagens; ICONSVG, ferramenta para seleção e personalização de ícones SVG e; Choices.js, biblioteca JS para tags e selects.

dpw expo #11 – Perflink, CrumbJS, iro.js

Conheça Perflink, para benchmark de JavaScript; CrumbJS, para trabalhar com cookies e LocalStorage e; iro.js, color pick responsivo moderno.

dpw expo #10 – DevDocs, Editor.js, RFS

DevDocs, documentação de APIs e tecnologias; Editor.js, WYSIWYG diferenciado e; RFS, possível solução final para tamanhos de fontes em design responsivo.

dpw expo #9 – Micromodal.js, mockAPI, Color.review

Conheça Micromodal.js, lib JavaScript leve e rápida para modais; mockAPI, para criar endpoints mockados e; Color.review, que checa o constraste entre cores.

dpw expo #8 – removebg, Cleave.js, NSFW JS

Conheça o removebg, que remove backgrounds de imagens; Cleave.js, para formatar campos e; NSFW JS, identificador de conteúdo +18 diretamente no front end.

dpw expo #7 – Lozad, PulltoRefresh.js, StackBlitz

Conheça Lozad, para fazer lazy loading de recursos web; PulltoRefresh.js, para o efeito “pull to refresh” e; StackBlitz, o VS Code online.

dpw expo #6 – Rellax, spacetime, AmplitudeJS

Conheça o Rellax, biblioteca para efeito parallax; spacetime, para lidar com datas, tempo e fuso horários e; AmplitudeJS, audio player HTML5 moderno.

Explorações de design visual

As explorações de design visual acontecem de diversas maneiras (Mood boards, Style tiles, Element collages). Conheça mais sobre cada uma dessas técnicas.

dpw expo #1: k6, CSS Reference, Coolors.co

Conheça uma ferramenta para medir performance de projetos web, uma referência CSS e também uma ferramenta para criação e descoberta de paletas de cores.

Retrospectiva 2018

Retrospectiva com os melhores artigos de 2018 do seu, do meu, do nosso desenvolvimento para web! ;-)

dpw2019: a nova versão do blog

Conheça a dpw2019, nova versão do blog desenvolvimento para web, um dos blogs sobre webdev mais tradicionais do Brasil!

CSS Blocks: introdução à API

Veja neste artigo uma introdução à API de CSS Blocks e comece a entender porque este é um dos melhores compiladores CSS da atualidade.

LinkedIn anuncia CSS Blocks, o novo otimizador de CSS

Saiba mais sobre CSS Blocks, o novo projeto open source da LinkedIn de um otimizador CSS que promete contribuir muito para o desenvolvimento front-end.

Porque CSS Grid é melhor que Bootstrap para criar layouts

Com o advento de CSS Grid, o framework front-end Bootstrap pode não ser mais tão necessário… Saiba mais sobre os poderes de CSS Grid para layouts.

Retrospectiva 2017

Retrospectiva com os melhores artigos de 2017 do seu, do meu, do nosso desenvolvimento para web!

Motion UI: 4 formas de usar animação funcional

Interfaces animadas/Motion UI são ponto imprescindível para UX. Conheça 4 formas de usar animação funcional em projetos web.

O novo esqueumorfismo está no assistente de voz

O novo esqueumorfismo está no assistente de voz. Leia e saiba mais sobre como esqueumorfismo, assistentes de voz e biomimética estão correlacionados.

Desenvolvimento Orientado a Modinha (DOM)

Você é adepto do Desenvolvimento Orientado a Modinha? Saiba como escapar dos hypes tecnológicos e se preservar através de importantes análises e dicas.

Ícones precisam de labels?

Afinal, ícones precisam de labels ou não? Veja neste artigo uma análise consciente sobre a questão e o que é possível concluir.

Accelerated Mobile Pages (AMP): 1 ano depois

O projeto da Google Accelerated Mobile Pages (AMP) foi lançado há 1 ano. Veja quais foram os impactos na web do mundo todo.

UX, UI, IA, IxD: chega de confusão!

Saiba a diferença entre UX, UI, IA e IxD e as atribuições dos profissionais de cada uma dessas áreas do design.

dpw2016

Conheça as novidades do blog, algumas das novas interações e utilitários visuais e o que esperar do dpw2016!

Web design responsivo com DevTools Device Mode

Conheça as novidades da Device Mode da DevTools e saiba como tirar proveito para desenvolvimento com web design responsivo.

Genymotion: emulador de Android

Genymotion é um emulador Android simples e fácil de usar. Veja como o Genymotion emula dispositivos Android para testes de maneira simples e rápida!

dpw2014 – parte 2: desempenho / performance

Segundo artigo com informações sobre o novo tema do blog, focado em desempenho/performance. Leia e conheça as tecnologias usadas.

Gulp Fiction

Gulp Fiction é uma interface visual para se trabalhar com Gulp. Assista ao screencast e saiba como o Gulp Fiction pode ajudar em seus projetos web!

dpw2014

Conheça as diretrizes do novo desenvolvimento para a web e as tecnologias usadas para criar o tema.

Gulp

Conheça o Gulp, melhor automatizador de tarefas de front-end da atualidade, num artigo repleto de informações, dicas e exemplos.

.htaccess: redirecionamento automático para sites em manutenção

Aprenda como fazer redirecionamento automático para sites em manutenção usando códigos .htaccess.

Escolha uma Licença

escolhaumalicenca.com.br, site para ajudar a escolher conscientemente licenças para projetos open source!

UIkit: framework front-end modular responsivo

UIkit é um framework responsivo modular de front-end projetado para ser leve e simples de se usar. Veja mais informações e conheça seus componentes.

Bower: gerenciador de pacotes front-end

Conheça mais sobre o Bower, gerenciador de pacotes para front-end para um melhor gerenciamento dos recursos de front-end necessários para projetos web

Alloy UI: componentes, informações e opiniões

Alloy UI, um UI framework feito com YUI3, é um projeto com bons componentes para desenvolvimento front-end e já é usado por grandes empresas pelo mundo.

JSON: JavaScript Object Notation

JSON – JavaScript Object Notation – é uma das principais notações para intercâmbio de dados entre aplicativos. Saiba mais e veja exemplos e ferramentas.

Melhores editores WYSIWYG

Conheça os melhores editores WYSIWYG para seu projeto ir para o próximo nível: uma lista de editores WYSIWYG para todos os gostos e necessidades!

Breadcrumbs: guia completo com exemplos e melhores práticas

Guia completo sobre breadcrumbs com exemplos e melhores práticas!

6 mitos de SEO que você deve evitar

O trabalho de otimização para mecanismos de busca, SEO, possue “gurus” que ensinam uma técnica mágica a cada dia. Conheça 6 mitos de SEO que você deve estar ciente e evitar

8 características de User Interfaces (UI) de sucesso

Uma boa user interface garante uma boa usabilidade em seu software ou web site. Conheça 8 características de User Interfaces (UI) de sucesso!

Boas práticas de SEO para seu site na primeira página do Google

“Resumo-tradução” do livro da Google sobre como ter seu site posicionado na primeira página de busca!

Componentes de um sistema de navegação

Conheça os componentes básicos de um sistema de navegação e saiba o que é essencial para seu site permitir a fácil interação de seus visitantes

Meta tags

Um guia sobre meta tags, mostrando as principais meta tags, sua função e exemplos de uso para que você saiba qual meta tag utilizar em cada situação, sumo a um trabalho de SEO mais elaborado e profissinoal

Diferenças entre IDs e Classes

Aprenda a diferença entre IDs e classes, usados em XHTML, CSS e javascript. Saber a diferença entre classes e IDs evita erros básicos e permite desenvolver sites melhores

SEO para designers: os erros mais comuns na otimização de sites

Conheça os erros de SEO mais comuns na otimização de sites e saiba como não cometê-los

As melhores práticas de SEO para seu site ou blog melhorar o posicionamento nos mecanismos de busca

Pratique e tenha um bom posicionamento

Identificador de fontes

Quer usar um identificador de fontes para saber qual fonte foi usada em uma imagem ou texto de um site? Quer saber como identificar uma fonte? Leia mais!