Artigos - Tableless - Website com artigos e textos sobre Padrões Web, Design, Back-end e Front-end tudo em um só lugar.
posts da categoria Artigos
Comparativo entre as duas plataformas.
por Lucas Gonçalves Cunha
Formsquash, formulários para sites estáticos
Criando formulários para sites estáticos com o Formsquash
Como usar auth no Firebase
Autenticação de usuário com o Firebase Auth
por Morais Junior
Circuit break - Resiliência em arquitetura microservices
Adotar uma arquitetura Microservices traz muitos benefícios, mas você precisa estar preparado para lidar com falhas nos serviços. No artigo explico como tratar problemas de Timeout utilizando Circuit Break Pattern.
por Evandro Passos
Toda escolha é um tradeoff
por Vítor Capretz
Como o Airbnb gera código a partir das suas interfaces de baixa fidelidade
por Benjamin Wilkins
Para os desligados, entenda por que a neutralidade da rede está em perigo.
por Tableless
Tem uma faixa de serviços e soluções no mercado de web que viraram comodites.
Você não precisa de muito para criar um ambiente ótimo para as mulheres, você só precisa de respeito.
Um review sobre o Mantra da Produtividade
por Wanderson Macêdo
Estatística básica nas entregas de projetos agile — Moda, mediana e percentil
Como um pouco de estatística básica pode nos ajudar a entender melhor as entregas de projetos web
Algumas informações sobre o novo formato de arquivo do Sketch 43
Agora o Tableless é estático
Tableless não é mais no WordPress.
Entenda como funciona atribuições múltiplas no JS
por Gabriel Prates
Anotações sobre Progressive Web Apps
por Everton de Paula
por DaniloAgostinho
O que aprendi em 5 dias como Front-end, e uma pergunta: você esta preparado para se tornar um desenvolvedor?
por Danilo Agostinho
por thonyconde
Como camuflar seu ip like a ninja
por Júlio Carneiro
Features que sua API REST precisa ter desde o início
por Ulysses Marins
Aprenda um pouco sobre como criar aplicações Web que podem ser utilizadas por humanos e computadores
Entrevista com Bert Bos (Criador da CSS) e W3C
Quem nunca se deparou com o um layout com imagens "sobrepostas" que precisavam ficar suspensas sobre múltiplas imagens de fundo, com CSS3, você pode aplicar aos elementos múltiplas imagens como plano de fundo sobrepostas. Sem a utilização do Z-index, é isso mesmo "necas de pitibiriba" de Z-index. Que Z-index que nada, agora a MODA é Background-image !!!
por Moisés Lopes Ferreira
Upload de imagens desmistificado com simpleGallery.js
Upload, certamente, é uma parte difícil na programação, provavelmente você já teve problemas com isso. Por que não simplificar? Confira como o simpleGallery.js pode lhe ajudar nesta jornada.
Começando com o Angular Material – Parte 1
Um pouco sobre imagens para Web
Princípio de Paretto e o desenvolvimento de jogos indie
por Thiago Teles
Consumo eficiente de recursos computacionais de servidores de aplicação web com Node.js
Este artigo é o resultado de uma análise da plataforma Node.js, especificamente quando submetida a um alto número de acessos simultâneos, comparando os números dos indicadores de serviço e eficiência obtidos em testes de performance.
por Jamerson Bernardo
As funcionalidades async / await não conseguiram chegar para o ES6, mas isso não significa que elas não irão chegar ao JavaScript. Enquanto escrevo esse post, ela é uma proposta na fase 3 e está sendo trabalhada ativamente. As funcionalidades já estão no Edge e devem chegar a outros browsers assim que chegar na fase 4 - pavimentando seu caminho para inclusão na próxima edição da linguagem (veja também: Processo TC39).
por Wendell Adriel
O básico sobre o automatizador de tarefas Make
Vocês trocariam seu Gruntfile (ou semelhantes) por um Makefile?
Lodash ou Underscore? Talvez, nenhum!
por Eduardo Rabelo
Exercícios Simples de JavaScript para Entrevista
Nesse artigo iremos ver alguns exercícios simples e rápidos de JavaScript que podem ser usados para ajudar a você a selecionar candidatos ou para você se dar bem em uma entrevista.
Inteligência Social: Taxa de Engajamento!
JavaScript e CSS no WordPress
A importância de desenvolver considerando off-line first
Uma aplicação web que funcione off-line é fundamental nos dias de hoje, tendo em vista a mobilidade, instabilidade de rede e mesmo a falta de acesso à internet.
Uso acessível: O cumprimento das premissas na web contemporânea
Motivações ao desenvolvimento acessível.
Há 5 anos atrás eu escrevi aqui no Tableless um artigo falando um pouco sobre acessibilidade na web. Cinco anos se passaram e os motivos para se ter esse cuidado ao desenvolver sua aplicação não mudaram, mas novas ferramentas surgiram para que você atenda cada vez mais às demandas dessa parcela da nossa sociedade que tem tanto direito de usufruir de seu website quanto as pessoas sem deficiência alguma.
Sobre organizar equipes multifuncionais em uma empresa gigante.
Sobre comunidade e respeito
O framework Bootstrap chega na versão 4 (alpha) com pré-processador Sass e outras mudanças.
Entendendo Sistemas de Grid CSS do Zero
A matemática por trás dos sistemas de grid.
por Tamiris Bonicenha
Processo front-end na Locaweb
Nosso processo e stack de front-end na Locaweb.
2015 – O ano em que o celular ultrapassou o desktop
Como o Mobile mudou não apenas a internet, mas também a nossa vida e como lidamos com a tecnologia.
Como criar e manter uma cultura de desenvolvimento no seu time
Inspirado no FEMUG SP #23, atitudes para manter o desenvolvimento pessoal dentro da cultura de um time.
por Danilo Vitoriano
Parse – Objetos na nuvem
Parse, um banco de dados, na nuvem, orientado a objetos.
Nós quebramos a web
É sempre difícil apontar o erro de alguém. Ainda mais para pessoas que não aceitam críticas. Porém, é preciso olhar para nós mesmos para corrigir nossos problemas.
por fernahh
Foco e Produtividade. Você tem muito a ganhar com isso
Recentemente tenho me cobrado muito na questão de organização, parei para pensar e vi que minha vida estava desorganizada e consequentemente perdia algo preciso, o tempo.
por Felipe Chama
Entenda um pouco mais como o HTTP2 vai ajudar na construção de sites.
Otimize a performance do seu site com o Kraken
Usando Kraken para otimizar suas imagens.
por FelipeMartinin
Não venda tecnologia. Venda produtos e pense no business.
Entregue resultados, não apenas websites. Seja a peça chave dos negócios.
Otimize suas Campanhas de E-mail Marketing e obtenha os resultados que você tanto deseja.
por Ederson Ribeiro
Explicando o MVC, um padrão de arquitetura para organizar sua aplicação.
por Allan Ramos
HTTP/2 – Atualização do protocolo base da internet
O protocolo HTTP vai receber oficialmente uma grande atualização em breve. Saiba o que mudou.
Cadastre seu post e seja um autor do Tableless
Seja um autor do Tableless. Cadastre-se no nosso Wordpress e compartilhe seus artigos.
Uma excelente ferramenta de minificação de arquivo javascript. Vou falar alguma coisa sobre Closure Tools e alguns exemplos de código fonte.
IE8 Countdown – Enforcando o demônio
O IE8 já ficou velho e está na hora de mandarmos ele pra casa.
Documentário sobre o Jeffrey Zeldman
Documentário sobre um dos lendários da comunidade web mundial: Jeffrey Zeldman.
Conheça o boilerplate focado em design responsivo e performance criado pela equipe da Google.
Temos um novo rockstar no palco.
Yii Framework - um framework PHP profissional, rápido e seguro!
por Diego do Nascimento
OOCSS, SMACSS, BEM, DRY CSS: afinal, como escrever CSS?
por Jean Carlo Emer
O AngularJS oferece muitos recursos ao desenvolvedor, neste artigo vamos conhecer o de Single Page, utilizando ngView e ngRoute.
por Lucas Caprio
O Crescimento da Web e as Tendências de Mercado
Um pouco sobre como o mercado web vem crescendo e como os profissionais devem sempre acompanhar este crescimento e suas as tendências.
O que você faz quando falta a internet?
Não importa o quão avançados são os aparelhos nos nossos bolsos. Em algum momento, serão praticamente inúteis.
Cinco tipos de aplicativos que você deveria usar corretamente
Aplicativos de celular são criados diariamente aos balaios. Eu conheço pessoalmente gente que coleciona aplicativos inúteis e também gente que cria exemplares desses, e essa é a única forma de empreendedorismo que conhecem.
Se você tinha problemas com imagens responsivas, agora não tem mais...
Este post vai explodir seus ouvidos. Veja 3 motivos
Recentemente, o BuzzFeed publicou sua primeira tentativa de viralizar conteúdo em áudio. Alguns produtores de podcasts e empresas de rádio, como a NPR, ficaram de olho. Será que agora vai? Será que o todo-contagioso site conseguirá, finalmente, levar o áudio via web para as massas?
Conheça a Técnica Pomodoro, aprenda a gerenciar melhor seu tempo e entenda como fazer mais pausas pode te deixar mais produtivo.
Web Components: Introdução
Entenda os principais tópicos e as informações iniciais sobre Web Components.
Cinco tecnologias fantásticas de uso corriqueiro
Como a tecnologia comum, que usamos todos os dias, pode ainda impressionar.
Criando um "blog" no Github com tinypress.
Uma ferramenta minimalista para criar um blog estático no Github. Simples, rápido e sem gastar nada.
Macaw: O que você vê é o que você tem.
Desenhe a web.
Ghost – A simples e perfeita plataforma para publicações
E nós não estamos falando de fantasmas.
Duas dicas de como lidar com o Not Provided
por Douglas Faria
BEM, um novo método para seu CSS
A busca por padrões na criação de classes CSS é missão em diversas equipes front-end pelo mundo e o pessoal da Yandex parece ter conseguido definir uma metodologia, simples e funcional. Com vocês, BEM.
Qual a dose certa de JavaScript
O que falamos em 2013?
E o que vamos falar em 2014? Confira alguns do assuntos que fizeram a cabeça em 2013 e podem ser grandes promessas para 2014.
Ensine mais
Aprenda ensinando em 2014.
| Pré-processadores, frameworks, novas propriedades e valores, novidades e mais novidades todas acontecendo ao mesmo tempo e ainda vemos profissionais de front-end perdendo a noção do uso puro e simples de folhas de estilo e da aplicação dos padrões. Por que isso acontece?
Conheça os dados da pesquisa que fizemos este ano para conhecer alguns números e características do mercado de front-end brasileiro.
CSS on steroids
Workflow para cuidar dos seus assets
Como testar design responsivo
Conheça algumas ferramentas essenciais para testar o seu layout, aprenda a sincronizar dispositivos móveis, organize sua própria biblioteca de testes e saiba o que fazer caso você não possua um smartphone.
No dia-a-dia, a correria em cumprir prazos nos faz buscar e fazer uso de ferramentas que possam auxiliar na velocidade de desenvolvimento. Seja no front ou no design, em tempos de mudanças e transições, nada mais justo que uma lista de algumas ferramentas especiais para que você mantenha seu processo profissional e ágil.
Entenda como criar interfaces que se adaptam automaticamente de acordo com o perfil de uso do usuário.
Sobre organizar informação
Um pensamento sobre organização de informação.
Saiba como evitar os principais erros na hora de redigir um e-mail, conheça dicas simples para ganhar a simpatia de quem está do outro lado do monitor e nunca mais esqueça seu portfólio.
O Designer Gladiador
Maximus era um grande guerreiro e demonstrava ser um excelente observador, desde pegar um punho de terra até reconhecer gladiadores nervosos e grandes parceiros de batalha. Antes de iniciar um projeto, você precisa reconhecer a arena e todas as suas variáveis.
por Bernard De Luna
Conheça quais são as técnicas, padrões e principais desafios para o desenvolvimento de aplicativos nativos e interfaces web touch screen.
Um novo mundo com Big Data
Entendendo um pouco sobre informações e big data.
por João Paulo de Almeida
Pré-processadores: usar ou não usar?
Meus dois centavos sobre a utilização de pré processadores de CSS.
Neste artigo entenda como funcionam os modos de mesclagem e saiba como utilizar cada um deles através de simples parâmetros de CSS.
Personalizando o painel de administração do WordPress
Aprenda a modificar o layout da dashboard de maneira simples para facilitar a navegação, personalizar a experiência do usuário e reforçar o branding.
O que é Design Atômico?
Conheça a nova metodologia para criação e desenvolvimento de layouts através de sistemas de interface modulares.
O que é Sass? Entenda esse outro método de escrever CSS
Quando pensamos em produtividade, logo nos perguntamos e pesquisamos como aumentá-la sem grandes impactos. Então, os pré-processadores e frameworks para CSS vem suprir essa necessidade. Com vocês, um pouco de Sass.
Sobre Cor e Webdesign
Entenda o funcionamento dos sistemas de cores mais utilizados da web e conheça ferramentas úteis para criar e organizar suas próprias paletas.
Desenvolvimento ágil utilizando Scrum
Conheça a metodologia Scrum e aprenda a colocar as estratégias na prática para gerenciar qualquer tipo de projeto.
3 parâmetros de HTML que você deve usar em um futuro próximo
Imagens responsivas, downloads automáticos e logos em vetor sempre atualizados. Não é sonho. Conheça algumas novidades que nos esperam em um futuro próximo.
Anotações da palestra do Silvio Meira
Anotações da palestra que o Silvio Meira fez no Encontro Locaweb de Profissionais de Internet em Curitiba.
Grunt: você deveria estar usando!
Entenda como automatizar tarefas com GruntJS.
por Vagner Santana
Um pensamento sobre prazos e produtividade.
WordPress para front-end, iniciando um projeto.
Estranho dizer que vamos falar de Wordpress classificando à um grupo específico, mas se o seu negócio é "html's", "css's" e algumas arriscadas em "jquery's" e "javascript's", você vai entender do que estou falando.
Grids semânticos com LESS
Aprenda a construir rapidamente um grid semântico e responsivo utilizando CSS e uma ajudinha do LESS.
Como iniciamos e por que resolvemos criar um framework próprio aqui na Locaweb.
E-mail Newsletter Responsivo
Entenda como funciona e como fazer um email marketing responsivo.
Depois que o dinheiro pinga no bolso o que sobra é apenas propósito.
Entenda como funciona o efeito parallax.
Imagens em alta resolução utilizando SVG
Entenda o que são imagens SVG e como você poderá utilizá-las hoje.
História da Web – Uma timeline
Conheça a história da web numa linha do tempo completa e muito informativa.
O Front-end auxiliando o Marketing Digital
Nos dias atuais estamos ligados a semântica, seo, performance, boas práticas, entre outros assuntos, que tal ajudar também a equipe de Marketing Digital?
por Deivid Marques
Sites e mais sites sendo lançados a cada segundo, busca desenfreada para alcançar o topo das redes de pesquisa. Como controlar quem entra e saí de seu site? Ficar de olho apenas no Analytics ajuda?
Por que eu não gosto do nome startup
Um texto informal do por que eu não gosto do nome startup.
Drops 12 – Dicas de sobrevivência
| Essas dicas fazem parte da palestra que fiz no Tableless Conf (#tablelessconf).
Um texto que pode ajudar os usuários normais a atualizar seus browsers antigos.
O que é melhor: um site que se adapta bem em diversas telas ou um site totalmente otimizado e de alta perfomance?
"HTTP Archive" Ferramenta para performance
| Verifique algumas características importantes sobre performance e velocidade do seu website.
por Giovanni Keppelen
Um mundo atrás do seu óculos.
Entenda como o Schema pode ajudar a auxiliar o vocabulário de marcação de dados em páginas web.
Será que todo mundo precisa de um design responsivo? Você pode não estar dando atenção para o que realmente importa.
Layouts antigos do Tableless
Versões antigas do layout do Tableless...
Conheça as vantagens do formato, aprenda a criar um livro do zero, descubra as melhores práticas e porquê você deve correr dos geradores automáticos.
A melhor parte da viagem é o caminho
Um pouco de auto ajuda não faz mal a ninguém.
Um pensamento sobre design impresso, desenvolvimento e design para web.
Estamos prestes de presenciar uma invasão eletrônica de dispositivos de todos os tamanhos e utilidades em conjunto com aplicações onipresentes.
O IE6 vai morrer no Brasil
Estamos ficando mais perto do dia em que nossos problemas com o IE vão acabar... ou pelo menos ficar perto disso.
Convencimento e educação = liberdade
A obrigação do desenvolvedor client-side é educar e convencer. Porque ninguém gosta de perder tempo e dinheiro.
Formulários e o Metawebdesign – Parte 1
Como montar formulários quando você é o responsável pelo código e design.
Acompanhar todas as mudanças que o desenvolvimento web vem sofrendo é tarefa muito difícil e bastante trabalhosa. Alguns de nós ainda preferem sentir-se mais seguros quanto a regulamentação dessas diretrizes e outros já estão testando e experimentando. Pra onde podemos direcionar nossa postura às evoluções?
CSS3 com PIE – bordas, sombras e gradiente
Utilizar CSS3 no front-end de websites ainda parece uma realidade um pouco distante devido a incompatibilidade de renderização entre os browsers, mas com o lançamento final dos navegadores IE9 e Firefox 4, esta realidade fica ainda mais próxima da prática efetiva que vai criar a nova etapa do desenvolvimento tableless.
Não quero que você gaste tempo e dinheiro à toa se você pode ter resultados melhores se mudar um pouco o foco do desenvolvimento. Quero que você entenda que os visitantes que utilizam browsers antigos são sempre a minoria.
Um raio-x do seu website
Ferramentas e metodologia para entregar mais e com maior qualidade. O Progressive Enhancement pode nos ajudar como mostramos em outros artigos. E hoje vamos mergulhar em um tópico específico da metodologia.
Aprenda a adicionar menus e edite no seu próprio painel de administração com as páginas ou links que você quer
HTML 5, novos elementos e atributos.
Em meio à tutoriais e artigos a respeito, em alguns minutos consegue-se perceber algumas das novas possibilidades que o HTML 5 proporcionará, mas na prática da construção de códigos para interfaces, o que será possível além de secções, barras de menu, barras laterais, etc?
Boas práticas na estruturação de interfaces.
O planejamento estrutural de seu código html é também de grande importância para organização de tags e propriedades css, para o trabalho em equipe e para uma manutenção facilitada.
Aplicando um Plano de Usabilidade – Parte 1
Aprenda a planejar e analisar seu website antes de colocar a mão na massa - quer dizer, no código.
Voltamos a Xangri-lá, para entender como as coisas funcionam. Veja como aplicar o Progressive Enhancement criando e customizando metodologias de trabalho. As expectativas e considerações do cliente geram o design e a funcionalidade de sua aplicação.
Progressive Enhancement, Graceful Degradation e um horizonte perdido que precisa ser encontrado no desenvolvimento web
Responsabilidade de um dev client-side
Designer de web tem que saber codificar HTML/CSS/Javascript? Um desenvolvedor client-side tem que saber design?
A usabilidade é algo muito abrangente e você, profissional front-end, tem muito a ver com isso.
Como tornar seu website acessível?
Ao ler este título talvez você esteja se perguntando: "mas se ele já foi publicado, já pode ser acessado por todos, certo?!" e a resposta mais correta é: "depende". Que tal entender melhor o que significa acessibilidade na web?
Afinal, o que muda com o HTML 5?
Há algumas mudanças que vão ocorrer tanto nas estruturas técnicas do desenvolvimento de webpages quanto na postura e parâmetros que o profissional deverá apresentar na criação de um website.
Um resumo do que mudou no HTML5 em comparação com o HTML4.
HTML5 e seus companheiros
O HTML5 veio para mudar. Mas o HTML5 sozinho não faz verão. Por isso, é bom que saibamos que o CSS e o Javascript fazem boa parte do trabalho.
O HTML não vai tomar o lugar do Flash, entretanto, o Flash não será a única opção.
Processos e Adoção de Padrões
Um pouco sobre o processo de aprovação e adoção de recomendações do W3C.
Se você é um desenvolvedor de verdade, você deve conhecer seu editor de códigos. Não importa qual ele seja, contanto que você o conheça do começo ao fim, saiba suas limitações e saiba utilizar suas vantagens para minimizar o tempo de produção.
Porque é a web que comanda
Porque fazer um sistema que deve ser instalado no iPhone se você pode fazer um sistema web que pode ser acessível em todos os smartphones?
Pulga na cueca e experimentando o HTML5
Tenho pulga na cueca. Não no sentido literal. Claro. Eu não agüentei e mudei novamente o Tableless, por fora e por dentro. Por fora ele ficou mais bonito. Por dentro, ele está implementado com as novas tags de estrutura do HTML5.
Canivetes na web
Durante muito tempo as agências web achavam que o desenvolvedor deveria ser uma espécie de canivete suiço.
Bem como o CSS3 o HTML 5 vem para mudar totalmente a forma que a web é construída.
Dar atenção a um código XHTML bem escrito, é abrir portas para deficientes e usuários de diversos dispositivos.
Um 2009 sem fôlego
Este foi um ano de batalhas como qualquer outro. Mas 2009 está chegando e quem sabe qual será o caminho que o desenvolvimento web irá percorrer?
Você pode ser diferente, mas isso só depende de você.
O desenvolvimento web para iPhone é o início deu m novo modelo de desenvolvimento web para dispositivos móveis. Os browsers para aparelhos como o iPhone ou aparelhos como os S60 da Nokia, são um novo caminho de navegar.
Modulando o CSS
As vezes não é inteligente fazer o código CSS todo em apenas um arquivo CSS. É aí que entra a modularização do CSS.