sexta-feira, 16 de agosto de 2013

Programador: escreva menos, produza mais!

Por João Ângelo de Brito Junior

No desenvolvimento web sempre nos deparamos com a seguinte frase “tempo é dinheiro”.

Portanto, nós programadores sempre somos desafiados a cada vez mais diminuir o tempo gasto no desenvolvimento, obviamente, mantendo a mesma qualidade dos códigos.
 


Desde meados de 2005/2006 temos um aliado: o jQuery, que é uma biblioteca do JavaScript. Ela foi criada para simplificar a forma de codificação do JavaScript nos documentos Web.
  
Uma biblioteca no universo web nada mais é do que um arquivo que possui uma ou várias funções, formando um pacote de alternativas para facilitar o desenvolvimento de uma determinada linguagem

Porque usar jQuery no seu website?

  • jQuery é open source e livre de atributos comerciais; 
  • jQuery  possui uma grande comunidade online,  por esse mesmo motivo, tem muitas funções e componentes prontos, e os bugs são rapidamente extintos; 
  • jQuery é uma biblioteca que inspira o desenvolvedor, pois, com poucas linhas de código, pode se ver grandes resultados; 
  • jQuery é compatível com a maioria dos navegadores;
  • Usada por cerca de 55% dos 10 mil sites mais visitados do mundo;
  • É a maior e mais famosa biblioteca JavaScript já escrita.

O que é possível fazer?


O plugin acima é um exemplo do que é possível desenvolver com o jQuery. 

O plugin é o Nivo Slider, que apresenta uma galeria de imagens, que pode ser facilmente aplicada em uma página inicial de um website, para que seja feita a apresentação de destaques das notícias ou até mesmo promoções de produtos. Com o uso deste plugin conseguimos eliminar o uso do flash, pois os movimentos são realizados através de eventos do jQuery. 

Outro exemplo são as máscaras usadas nos campos de formulários, visando à comodidade de preenchimento do formulário pelo usuário.

domingo, 21 de julho de 2013

Qualidade Comercial

Por Jordânia Marins - Coordenadora de Relacionamento e Qualidade na Prodweb

Com a constante evolução do mundo moderno e principalmente com o desenvolvimento ultra rápido da tecnologia, muito se tem falado em Qualidade.

Vivendo numa época de mudanças aceleradas, as reais necessidades dos clientes se alteram rapidamente com a renovação e o tecnológico, alimentadas por uma concorrência acirrada.

Estudos demonstram que, para a maioria das pessoas, a qualidade do serviço é mais importante do que seu preço. Os clientes consideram a qualidade o primeiro argumento para aquisição de um bem ou serviço.

Atualmente, os programas de melhoria da qualidade têm como objetivo não apenas reduzir ou eliminar os defeitos, mas sim apresentar ao cliente vantagens e benefícios que possam superar suas expectativas.

As empresas necessariamente terão que se adequar a essa nova era, ou seja, preocupar-se com a excelência da qualidade de seus serviços ou não sobreviverão no mercado.

Uma empresa que tem qualidade ganha fama, mais clientes e solidez, afinal qualidade é fundamental para a sua sobrevivência!

quarta-feira, 3 de julho de 2013

O Crescimento da Empresa


Por Michele C. Oliveira Brito - Financeiro na Prodweb

Toda empresa tem o desejo de crescer, de ser conhecida, de prosperar. Para isso, no dia a dia é importante ampliar, melhorar e inovar. A Prodweb cada vez mais aplica boas práticas em seus processos e  vem conquistando novos clientes em função da excelente qualidade de suas entregas e, principalmente, por conta da agilidade em seus atendimentos.
Com o aumento de demanda, novos funcionários são necessários. Para dar suporte ao crescimento, é fundamental um sistema de informação que organize a empresa e faça com que tudo corra de um modo harmônico: um ERP para gestão de clientes, projetos e tarefas, gestão e planejamento financeiro.
O ERP implantado foi desenvolvido pela própria Prodweb, cobrindo todos os processos produtivos e adequando-se às necessidades e realidades de seus negócios. Todas as requisições são tratadas pelo sistema, definindo o que cada funcionário deve realizar diariamente, controlando horas de produção e gerando relatórios de controle. Além disso, cada colaborador tem seu painel de desempenho onde pode avaliar seus próprios resultados e ter seu perfil profissional acompanhando sua história na empresa. A gestão financeira é outro ponto forte, pois através do ERP é possível previsionar e escalonar custos, investimentos e recebimentos ao longo do tempo, facilitando o planejamento a médio e longo prazo.
A Prodweb também investe e valoriza seus funcionários. Existem convênios com plano de saúde e farmácias. Um programa de oferta de cursos (on-line ou presencial) para qualificação e especialização é continuamente aplicado e ampliado para cada uma das áreas de atuação da empresa.
Toda empresa precisa de crescimento e a Prodweb está crescendo muito, pois ela é comprometida com seus clientes e também com seus funcionários, sendo assim o resultado só pode ser o melhor possível: o sucesso da empresa.


quinta-feira, 27 de junho de 2013

Google Glass


Por Natânia Guedes - Relacionamento e Qualidade na Prodweb

Acaba de ser lançado no mercado dos Estados Unidos o Google Glass – a internet de óculos. Ainda é cedo para avaliar tal tecnologia revolucionária, mas já existem críticas a respeito.
O criador do Google, Sergey Brin, já vem anunciando o lançamento dos novos óculos tecnológicos pela sua empresa há pelo menos 1 ano. Em março, 2 mil unidades do primeiro modelo foram colocadas à venda nos Estados Unidos por US$ 1,5 mil, apenas para a elite que se cadastrou no Google I/O 2012, um evento para desenvolvedores e profissionais de tecnologia. Até então, pouca gente havia tido a chance de experimentar o produto.

O aparelho resume as funções de um smartphone, mas não é capaz de fazer ligações se não estiver conectado a um telefone. A tecnologia conecta o usuário à internet e aos serviços do Google, abrindo um visor na parte interna da lente, e também tira fotos e grava vídeos com comando de voz ou toque. Na lateral da armação há uma caixa com sensores de toque manual para a navegação, na extremidade, uma câmera, e, na curva, acima do olho direito, uma pequena tela onde aparecem informações.

Como tudo que é novo gera polêmica, já existem os prós e os contras. A aparência cafona tem sido uma das críticas mais frequentes. Por outro lado, os recursos comuns da tecnologia smartphone, acionados por comandos de voz ou toque, sem precisar recorrer a uma tela fora do alcance da vista, realmente foi o que entusiasmou os primeiros usuários. Tirar fotos e fazer vídeos sem usar as mãos e compartilhar tudo instantaneamente talvez seja a funcionalidade mais interessante e empolgante do glass, fator este que alucina os apaixonados por tecnologias.

Outro ponto positivo seria a navegação. Segundo Tim Stevens, editor chefe do site Engadget, procurar direções por meio da tela dos óculos enquanto se dirige ou se caminha é mais eficiente e distrai menos o usuário do que usar aparelhos de GPS. Entretanto, não poder salvar rotas é uma deficiência que precisa ser repensada. Fazer consultas rápidas e simples na internet também funciona bem.  Em contrapartida, o sistema de áudio é fraco, a bateria dura menos que o prometido, não é possível ditar textos longos, a qualidade das fotos com pouca luz é baixa, e ouvir músicas não é uma experiência muito boa. Mas esses detalhes técnicos ainda poderão ser ajustados nos modelos futuros até o lançamento oficial, previsto para o fim de 2013 ou início de 2014.

Recomenda-se aos fãs esperarem até a terceira versão do modelo, que possivelmente será mais aprimorada e barata.



 
Fonte: Revista Planeta, Ed. 488, Junho de 2013



segunda-feira, 10 de junho de 2013

Identificando Navegador para uso de CSS

Por Luiz Fernando - Programador na Prodweb

Hoje, desenvolver um CSS 100% cross browser é praticamente impossível para layout`s mais complexos. Um dos grandes problemas que encontramos ao implementarmos um site é a inconsistência que ocorre entre os navegadores, sendo que muitas vezes temos que escrever códigos diferentes para cada um deles.

Uma das maneiras de resolver essa inconsistência é adicionar uma class na tag HTML identificando o browser.

<script type="text/javascript">
$(document).ready(function() {
if ($.browser.safari) $("html").addClass("safari chrome");
else if ($.browser.opera) $("html").addClass("opera");
else if ($.browser.mozilla) $("html").addClass("mozilla");
else if ($.browser.msie) {
       if (parseFloat($.browser.version) == 10) $("html").addClass("ie10");
       else if (parseFloat($.browser.version) == 9) $("html").addClass("ie9");
       else if (parseFloat($.browser.version) == 8) $("html").addClass("ie8");
       else if (parseFloat($.browser.version) == 7) $("html").addClass("ie7");
       else if (parseFloat($.browser.version) == 6) $("html").addClass("ie6");
}
});
</script>

O script (jQuery) acima verifica qual é o browser utilizado e adiciona na tag HTML o nome do browser. Assim podemos trabalhar com o CSS de forma a identificar cada navegador pela própria folha de estilo através da class adicionada na tag HTML.

<style type="text/css">
   div.conteudo  {
       color:#FFF;
       background-color: #000;
   }
</style>

O estilo acima diz que toda DIV que tiver a class “conteudo” terá a cor de fundo “preta” e a cor das letras “Branca”.

Se a mesma DIV no IE7 tivesse que ficar com a cor de fundo “vermelha” e a cor das letras “amarela” o estilo ficaria assim:

<style type="text/css">
   html.ie7 div.conteudo  {
       color:#FFFF00;
       background-color: #FF0000;
   }
</style>

Perceba que o navegador foi identificado através da class “ie7” que foi adicionada na tag HTML.
Se nos outros navegadores as cores também fossem diferentes, os estilos seguiriam o exemplo acima, trocando apenas a class do HTML(html.<nome do navegador>).

Com esse método você poderá direcionar um código para o browser específico sem o uso de CSS Hacks ou de comentários condicionais, mantendo todo o CSS em apenas uma folha de estilo.

 


terça-feira, 4 de junho de 2013

Internacionalização em Java (i18n)

Por Jonas Leite - Programador na Prodweb

Internacionalização é o processo de projetar uma aplicação de modo que ela possa ser adaptada a vários idiomas sem mudanças no código. Uma aplicação internacionalizável tem seu código escrito de modo que seja adaptável a diferentes idiomas, sem que para isso seja necessário replicar arquivos fontes.

O termo internacionalização é geralmente abreviado para i18n, que é a abreviação de "internationalization", pois do primeiro i ao último n há 18 letras.

Desenvolver uma aplicação para vários idiomas é cada vez mais comum. Pensar em trabalhar com i18n parece ser uma tarefa difícil, porém é muito simples trabalhar com i18n usando Java, já a linguagem tem recursos que facilitam essa tarefa. Para isso deve-se escolher uma determinada implementação. Neste artigo estarei explicando como deve ser feito em JSTL.


Para fazer com que a aplicação possa funcionar com diferentes línguas, basta criar arquivos de mensagens (*.properties), um para cada idioma diferente. Nesse arquivo de mensagem cada linha deve conter um registro, e cada registro é formado por uma chave e uma mensagem, nele devem ser inseridas todas as mensagens internacionalizáveis da aplicação.

Exemplo de como deve ser o arquivo de mensagens:

app.titulo = Aplicação com i18n

saudacao = Bem vindo

Agora, para usar essas mensagens nas suas páginas JSP, basta usar a taglib fmt da JSTL, ex.:

<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>

<html>
<head>
<title><fmt:message key="app.titulo"/></title>
</head>
<body>
<h1><fmt:message key="saudacao"/></h1>
</body>
</html>

Para fazer com que a aplicação possa funcionar com diferentes idiomas, basta criar novos arquivos de mensagens, um para cada idioma e traduzir as mensagens.

Todo esse processo de criação de arquivos .properties passará a funcionar com a troca do Locale associado ao navegador do usuário. Para isso deve-se usar uma tag da JSTL, a <fmt:setLocale/>, que define qual o idioma a aplicação receberá de acordo com a condição em que ela se encaixa (<c:if>). Veja no exemplo abaixo:

<c:if test="${not empty param.idioma}">

<fmt:setLocale value="${param.idioma}" scope="session"/>
</c:if>

Alguns valores possíveis para o Locale (en_US e pt_BR).



terça-feira, 28 de maio de 2013

Realidade Sustentável

Por Brenno Rodrigues - Relacionamento e Qualidade na Prodweb

Não é novidade pra ninguém que a tecnologia é quem mais cresce no mundo atual. Tudo e todos estão conectados entre si de uma forma ou de outra.

A tecnologia da informação está presente e é indispensável a toda e qualquer empresa, sendo assim um dos principais fatores responsáveis por seu crescimento.

A maioria das empresas se diz preocupada com a degradação do meio ambiente, algumas por “desencargo de consciência” e outras por uma real preocupação com o futuro do planeta. Estão acontecendo mudanças, e é fato que muitas empresas estão se voltando para uma evolução ecologicamente correta.

Estas corporações estão planejando novas formas de desenvolvimento que minimizem o impacto ambiental, buscando formas de utilizar recursos sem prejudicar e nem comprometer gerações futuras. Isso é Desenvolvimento Sustentável.

Para ratificar esse processo foram criadas diversas certificações, dentre elas está a mais conhecida: ISO 14001.

A implantação dessa forma de desenvolvimento vai muito além da questão “meio ambiente”. Significa aumentar ganhos administrativos, uma vez que é possível, através de estudos e processos, identificar pontos desde o desperdício até a contratação de melhores fornecedores. Essas certificações comprovam que a empresa é Verde.

Segundo Rafael Tello, professor e pesquisador associado ao Núcleo Petrobras de Sustentabilidade da fundação Dom Cabral, os selos oferecidos por instituições com boa reputação no mercado podem ser usados como critério de escolha no momento da compra, especialmente por clientes corporativos, gerando diferencial para as empresas cujos produtos ou serviços são certificados.

A TI Verde visa fazer com que as empresas se tornem sustentáveis a partir da adoção de inúmeras práticas que colaborem com a saúde do Planeta, assim mostrando aos seus clientes, parceiros, funcionários e fornecedores sua preocupação e comprometimento com o meio ambiente.




segunda-feira, 20 de maio de 2013

Efeitos CSS3

Por Pablo Elias - Programador na Prodweb

Com a chegada do CSS3 a vida dos desenvolvedores web ficou um pouco mais fácil para criação de efeitos. 

Quando os desenvolvedores web queriam colocar algum efeito na sua página eles recorriam ao javascript, pois o css não lhes dava tanto controle sobre os elementos. Porém, com o CSS3, novos mecanismos e recursos permitem ter um maior controle sobre os elementos HTML.  

Alguns exemplos são: as propriedades transition e transform.

A propriedade transition é um efeito que permite um elemento mudar gradualmente de um estilo para outro. Para fazer isso, você deve especificar duas coisas:

  • Especifique a propriedade CSS que você deseja adicionar um efeito.

  • Especificar a duração do efeito.

Se a duração não for especificada, a transição não terá nenhum efeito, porque o valor padrão é 0. O efeito será iniciado quando o valor da propriedade especificada é alterado. Uma mudança comum de propriedade CSS é quando o usuário passa o mouse sobre um elemento. 

Para adicionar um efeito de transição para mais do que uma propriedade, adicione mais propriedades, separadas por vírgulas.

Sintax: transition: propiedade duração;

Já a propriedade tranform aplica uma transformação 2D ou 3D a um elemento. Esta propriedade permite que você gire, movimente, incline os elementos desejados entre outras transformações possíveis.

Sintax: transform: none|transform-functions;

Com estas duas propriedades os desenvolvedores web podem deixar suas paginas muito mais interessantes, pois proporcionarão ao usuário uma sensação de movimento e rotação em três dimensões.

Exemplos:






segunda-feira, 13 de maio de 2013

Introdução ao Responsive Web Design

Por Luã Leite - Programador na Prodweb

Mais do que nunca a Internet está sendo acessada a todo o momento devido à quantidade de informações e da necessidade de se estar presente neste universo de conexão entre as pessoas. Com o surgimento e disseminação mundial dos dispositivos móveis, criou-se uma demanda de passar uma qualidade de informação para o usuário destes dispositivos, tal qual aquela já consolidada nos desktops. Com isso surgiu a prática e o termo Responsive Web Design.

A princípio na construção de um projeto Web, os desenvolvedores buscavam identificar que tipo de dispositivo estava acessando a página com as Media Types. Através desta identificação era definida qual a formatação e estilo a página receberia. Com o tempo as Media Types foram extendidas e hoje temos as Media Queries. Layout fluído e imagens flexíveis também estão incluídos nesse conceito.

Media Queries são especificações feitas em uma página Web usando Media Types. Porém nesse método podem-se definir restrições mais precisas de qual arquivo de estilo será usado, de acordo com o que você definir em seu projeto. Veja o exemplo abaixo.

<link rel="stylesheet" href="telamobile.css" media="screen and (max-width:480px)">

O atributo media informa para a página que quando um dispositivo de tela colorida (screen), com largura máxima de 480 pixels acessar a página, a mesma deve utilizar o arquivo de estilo telamobile.css. Sabendo disso, podemos definir vários estilos para tamanhos de tela diferentes, desta forma fazendo com que tenhamos um layout agradável independentemente do dispositivo que está acessando determinado conteúdo.

Outra forma de se construir um layout para diversos tamanhos de tela é usar um layout fluido ou líquido. Esta forma é usada desde o início da construção de sites, muitos não o consideram como Responsive Web Design. Este tipo de construção é baseada em proporções (porcentagem ou em) de espaço na tela que cada elemento deverá ocupar. Isso nem sempre é fácil de implementar, pois não se pode ter um controle de forma exata dos tamanhos, portanto pode ocorrer quebra do layout em determinados tamanhos de tela.


Por último, mas não menos importante é o uso de imagens flexíveis. Esta forma é uma maneira de adaptação das imagens em um layout que podem ser usadas de duas maneiras: ser feita através de porcentagem, gerando imagens de alta qualidade e redimensionando proporcionalmente ao tamanho da tela; gerar vários tamanhos de uma mesma imagem, de acordo com os limites de telas especificados, definir a imagem na dimensão que for mais viável para o tamanho da tela do dispositivo que está acessando a página.


O uso de design responsivo traz formas de obtermos qualidade na interação dos usuários com os projetos Web, independente do meio e da resolução do vídeo de onde o conteúdo é acessado. Deve-se planejar bem e, de preferência, usar o Mobile First, ou seja, pensar primeiro em mobile para depois ir para o desktop. Com mais acesso e qualidade na exibição da informação, os resultados tornam-se supreendentes!


Alguns Layouts Responsivos do ranking The Top Responsive sites of 2012

Disney.com








Microsoft 


                                                                    





Starbucks



segunda-feira, 6 de maio de 2013

Suporte Incondicional ao Cliente

Por Helena Esteves - Relacionamento e Qualidade na Prodweb

O primeiro motivo de uma empresa existir é o cliente, por isso o “suporte incondicional “ tem que ser muito mais que um slogan, tem que ser o principal objetivo. A equipe precisa não só atender com precisão, mas também surpreender e encantar cada vez que for solicitada.

Os clientes buscam agilidade e diferencial no mercado, por isso exigem tanto. Querem resultados perfeitos. Analisam o processo de trabalho da empresa como um todo, desde o atendimento telefônico até a conclusão dos serviços prestados. Dessa forma, a busca pela perfeição é essencial por parte de operadores e gestores. O desempenho da equipe faz parte da credibilidade da empresa.


Não se deve apenas cumprir acordos contratuais, embora sejam formalidades importantes, sempre se deve ir além, superar as expectativas para dar soluções de excelência aos clientes, resolvendo problemas, aplicando técnicas inteligentes com inovação e agilidade.


Isso é ter diferencial, isso é suporte incondicional!