Blog totalmente reformulado


Tecnologias Web, UX e Design

Novo blog em breve...fique por dentro ->

Olá,

Já tem bastante tempo que não coloco conteúdo novo no blog, e por consequência tem muito conteúdo desatualizado. Foi um ano bem corrido e tenso, mas também foi um ano cheio de experiências novas e muita aprendizagem.

Por isso resolvi que em 2015 seria o ano de recomeçar e dar um “up” tanto no blog como na minha vida. Agora quero compartilhar ainda mais conhecimento de valor e de qualidade para vocês.

Já tem mais ou menos 1 mês que estou trabalhando na nova interface do blog, e foquei muito em destacar os conteúdos, por isso preferi desenvolver um layout mais limpo, moderno e intuitivo para que você tenha uma maior e melhor experiência em navegar no blog.

Decidi desta vez trabalhar com três áreas em específico, são elas:

Tecnologias Web – Essa será a área onde postarei conteúdos que vocês já estão acostumados no blog, como css, html, jquery e php. Pretendo também abordar muita coisa sobre o Joomla, a minha maior ferramenta de trabalho hoje. E ainda pretendo criar sequências de micro cursos essenciais relacionadas a essas tecnologias.

UX (Experiência do Usuário) – Serão postados conteúdos referentes a como o usuário interage com uma interface web e qual a melhor forma para se desenvolver interfaces para qualquer tipo de usuário que venha utilizar seu sistema. Abordarei também conceitos de Usabilidade e Acessibilidade;

Design – Para essa categoria pretendo disponibilizar o processo de criação de cada projeto que desenvolvo, desde a concepção e ideia até a entrega do produto “redondo”. Abordarei criação de logomarcas, identidade visual, criação de layouts e templates.

Para que você fique por dentro do lançamento do novo blog totalmente reformulado clique no botão abaixo e se inscreva. E ainda irá fazer parte da minha lista VIP, onde de tempos em tempos irei elaborar conteúdos exclusivos e de bastante valor para você atualizar seus conhecimentos. Agente se vê em breve 🙂

Quero ser avisado quando o blog for lançado

Redimensionando e protegendo fotos em massa com BDSize


Redimensionar Imagens

Olá pessoal, nesse vídeo ensino como redimensionar suas fotos e ainda protege-la com uma imagem em marca d’água dificultando a divulgação da imagem de forma indevida.

Download BD Sizer

Dicas legais sobre o TCC


TCC

olá pessoal, neste post vou colocar alguns vídeos produzidos pelo admin Interface e uma estrutura básica para começar o Desenvolvimento do TCC >>

Estrutura Básica do TCC

Tema – Ex: Desenvolvimento Web.

Delimitação do Assunto – Ex: Análise de ferramentas para otimização de desempenho para aplicações que rodam na internet.

Relevância – Ex: Melhorar o desempenho das aplicações web e saber utilizar a melhor ferramenta possível para esse fim.

Problema – Ex: Otimizar sistemas de grande porte utilizando ferramentas que realmente aumentem o desempenho e faça com que o desenvolvedor saiba quais os motivos e porque o sistema está pesando.

Objetvios – Ex: Escolher e divulgar a ferramenta ideal, simplificar a busca por aplicações sobre este fim, entre outras.

Metodologia – Ex: Utilização de ferramentas de teste de software para cruzamento de análises, escolha de sistemas weg de grande, médio e pequeno porte para análise de desempenho.

Resultados – Levantar os dados e Analizar se os objetivos foram atingidos.

Conclusão – Como foi a experiência de fazer o trabalho, reforcar algumas das respostas que foram obtidas durante a pesquisa, sugerir outras pesquisas.

Os números de 2012


Os duendes de estatísticas do WordPress.com prepararam um relatório para o ano de 2012 deste blog.

Aqui está um resumo:

600 pessoas chegaram ao topo do Monte Everest em 2012. Este blog tem cerca de 7.900 visualizações em 2012. Se cada pessoa que chegou ao topo do Monte Everest visitasse este blog, levaria 13 anos para ter este tanto de visitação.

Clique aqui para ver o relatório completo

10 erros que não se pode cometer no HTML


Olá pessoal, depois de algum tempo sem postar, resolvi postar algumas dicas de html muito importantes para quem está começando nessa linguagem de marcação e pra quem já tem algum tempo que desenvolve, mas não sabia dessas informações. Vamos lá >>

Erro 1: colocar elementos de bloco dentro de elementos inline

Elementos block e inline

Os elementos HTML podem ser exibidos de duas formas, em bloco ou inline. Cada tag por padrão é naturalmente um elemento em bloco ou inline. Elementos em bloco incluem divs, parágrafos, que compõem a estrutura do documento. Elementos inline, por outro lado deve estar dentro de elementos de bloco e para dar continuidade ao fluxo da página, os exemplos incluem âncoras (links) e tags spam. Com isto em mente, os elementos inline devem sempre ir dentro dos elementos de bloco e nunca o contrário.

Erro 2: Não incluir o atributo ALT em imagens

Atributo alt

O atributo ALT é um elemento necessário em todas as imagens exibidas em uma página. Ele ajuda os usuários a determinar de que é a imagem, se eles tiverem usando um leitor de tela ou tenha uma conexão lenta. O atributo ALT deve descrever a imagem que está sendo mostrada, usar alt=”imagem” é uma prática ruim. Se a imagem é puramente para fins decorativos, basta adicionar o atributo alt vazio, como alt=””.

Erro 3: Não usar listas quando necessário

Tags listas

A tag UL (e OL) pode ser usada para várias coisas e são extremamente versáteis para a exibição de todos os tipos de itens da página. Não é novidade que a tag de lista não ordenada faz um ótimo trabalho para exibir uma lista de informações, então nem pense em usar um monte de quebras de linha para criar uma lista.

Erro 4: Usar <b> e <i> para negrito e itálico

Tags strong e em

As tags <b> e <i> são usadas para deixar o texto em negrito e itálico, respectivamente, mas semanticamente elas são classificadas como tags de apresentação, pois o efeito seria mais bem aplicado com os estilos font-weight e font-style do CSS. Se a passagem do texto sugere uma área de importância, deve ser destacados com as tags <strong> ou <em>, que basicamente faz a mesma coisa que o <b> e <i>, mas também torna o mundo um lugar melhor.

Erro 5: Usando muitas quebras de linha

Não repita a tag br

A tag de quebra de linha <br /> só deve ser usada para inserir uma quebra de linha única no fluxo de texto de um parágrafo. Não deve ser usada para fazer lacunas entre os elementos, ao contrário, você deve dividir o texto em parágrafos separados, ou ajustar a margem pelo CSS.

Erro 6: Usar errado as tags de tachado

tags del e ins

Antigamente se usava as tas <s> e <strike> para informar que um texto foi editado. No entanto elas estão agora classificadas como tags obsoletas, o que significa que ainda funcionam, mas estão em transição. O certo é usar um novo conjunto de tags <del> e <ins>. Estas novas marcas são utilizadas em conjunto para mostrar que este foi excluído e o texto que foi posteriormente inserido no documento.

Erro 7: Usar estilo inline

Estilo inline

Você já deve ter ouvido milhares de vezes, que um estilo inline é ruim. O certo de acordo com a semântica (e a facilidade) é ter a estrutura HTML em um documento e o estilo CSS em outro, por isto simplesmente não faz sentido ir colocando estilo diretamente no documento HTML. Lembre-se de manter os estilos em um arquivo de CSS que eles pertencem.

Erro 8: Adicionar ou remover bordas pelo HTML

Border

O atributo border é outro com efeito de apresentação e de modo semanticamente correto, deve ser deixado para o CSS, mesmo que seja para remover a borda de um elemento.

Erro 9: Não usar tags de cabeçalho

Use headers

As tags de cabeçalho estão disponíveis de <h1> a <h6>, e são uteis para separar o seu documento em seções intituladas. Se você tem uma seleção de palavras que indicam o conteúdo que deve aparecer abaixo é provável que uma das tags de cabeçalho irá caber direitinho. A escolha da tag de cabeçalho vai depender do fluxo do documento, naturalmente, tente inseri-los na ordem de 1 a 6.

Erro 10: O uso de <blink> ou <marquee>

Além de não serem parte da coleção oficial de tags padrão do HTML aprovado pelo W3C, as tags <blink> e <marquee> são pura feiura. Se há algo que você precisa prestar atenção, tenho certeza que você pode utilizar outras alternativas para chamar a atenção para uma região ou texto sem tem que fazê-lo piscar ou ficar navegando pela página.

Fonte: treinaweb.com.br

jQuery – Um Framework Fantástico


Olá pessoal blz … Nesse post vou etá falando um pouco sobre um framework que facilita muito a vida de desenvolvedores Web. O jQuery é uma biblioteca enorme de códigos javascripts prontos para suas páginas ficarem mais dinâmicas e assíncronas. Com esse maravilhoso Framework é possível criar aplicativos web muito próximos de aplicativos desktops.

>> O que é um Framework <<

Os Frameworks facilitam o desenvolvimento de softwares, permitindo que os programadores se ocupem mais com os requerimentos do software do que com os detalhes tediosos, de baixo nível do sistema. Com o uso de Frameworks, os programadores voltam a ter o controle de seu tempo e de seus códigos-fonte, as tarefas repetitivas são minimizadas, os projetos são concluídos com menos tempo, os padrões são seguidos, e a programação volta a ser uma arte.

Um Framework, é composto pelas classes que são um conjunto de “instruções” pré-preparadas para realizar os desenvolvimentos. Um Framework dita regras de como criar uma conexão, como trabalhar com sistema de arquivos, como fazer um programa ler determinado tipo de comando, ou seja, Framework nada mais é do que o carro chefe, seu uso é opcional, e requer um pouco de estudo do mesmo, pois existem vários Frameworks, cada um com sua característica.

>> O que é jQuery? <<

É um Framework JavaScript que simplifica o modo como você trabalha com documentos XHTML, manipula eventos, cria animações, e principalmente interações AJAX.

Podemos dizer que o nome jQuery significa “javascriptQuery” ou “consultas javascript”. É através de “consultas” a seletores CSS que acessamos os objetos da página e os manipulamos.

>> Histórico <<

O jQuery foi criado por John Resig, grande conhecer de JavaScript, que atua na Mozilla.

Ele estava inconformado com a forma de escrever JavaScript, super trabalhoso, códigos gigantes para uma ação tão simples. Foi aí que ele iniciou publicando em seu Blog a metodologia de usar seletores CSS com objetivo de simplificar e dar versatilidade ao código, inicialmente ainda não existia a biblioteca jQuery.

Mas no dia 14 de janeiro de 2006, ele apresentou publicamente os resultados de seu estudo, a palestra foi intitulada de: “jQuery, a nova onda para JavaScript”. E foi no ano de 2006 que marcou o início da tão famosa biblioteca jQuery.

>> Principais Vantagens de se trabalhar com jQuery <<

  • Compatibilidade com qualquer navegador.
  • O tamanho do arquivo .js do jQuery é bem pequeno.
  • Encapsulamento da complexidade, você evita de programar linhas e linhas de código.
  • Você consegue acessar a qualquer elemento ou combinações de elementos.
  • Interação CrossBrowser Perfeita, compatível com todos os browsers atuais.
  • Infinitas as possibilidades de se realizar requisições com AJAX.
  • Open Source, jQuery é Open Source e está atualmente disponível sobre as licenças MIT e GPL

Quer saber mais sobre o jQuery então visite a página >> http://jquery.com
ou faça um curso pela TreinaWeb como eu fiz >> http://www.treinaweb.com.br/

Em breve postarei algumas demonstrações do funcionamento do jQuery … Aguardem!

 

Algoritmo de Validação de CPF


Novo blog em breve...fique por dentro ->

olá pessoal, nesse meu 50º post vou está mostrando um algoritmo que muita gente que está iniciando na programação tem curiosidade de saber como funciona. Vocês vão perceber que é bem simples e depende da criatividade de cada um para desenvolver o melhor algoritmo em qualquer linguagem. Vamos ao algoritmo >>

>> Passos do Algoritmo <<

Para cada indivíduo, a sua inscrição no cadastro de Pessoas Físicas(CPF) é composto por um número de 9 algarismos e outro número de 2 algarismos, vamos considerar esses algarismos como sendo “d1” e “d2”, em que os d1 e d2 são denominados dígitos verificadores. Os dígitos verificadores são calculados, a partir da esquerda, da seguinte
maneira:

  • Os 9 primeiros algarismos são multiplicados pela sequência 10, 9, 8, 7, 6, 5, 4, 3, 2 (o primeiro por 10, o segundo por 9, e assim por diante);
  • Em seguida, calcula-se o resto “r1” da divisão da soma dos resultados das multiplicações por 11, e se o resto for zero ou 1, d1 é zero, caso contrário d1 = (11-r1);
  • O dígito d2 é calculado pela mesma regra, na qual os números a serem serem multiplicados pela sequência dada são contatos a partir do segundo algarismo, sendo d1 o último algarismo, isto é, d2 é zero se o resto “r2” da  divisão por 11 da somas das multiplicações for zero ou 1, caso contrário, d2 = (11-r2);

Para facilitar o entendimento desenvolvi um algoritmo em java.

Primeiramente criei a Classe Valida >>


public class Valida {

   //ATRIBUTOS
   private String cpf;
   private int d1,d2;

   //MÉTODOS
   void setCpf(String cpf){

      this.cpf = cpf;

   }

   void setD1(int d1){

      this.d1 = d1;

   }

   void setD2(int d2){

      this.d2 = d2;

   }

   int getD1(){

      return this.d1;

   }

   int getD2(){

     return this.d2;

   }

   String getCpf(){

     return this.cpf;

   }

   //FAZ O CÁLCULO DO 1º DÍGITO VERIFICADOR
   int dV1(String cpf){

   //declaração do vetor para desmembrar a string
   int v[] = new int[11];
   int soma = 0, sequencia = 10, resto;

   //desmembrando a string e transformando cada caractere em inteiro
   for (int i=0; i<9; i++){

      //transformação dos caracteres em inteiro
      v[i] = Integer.parseInt(cpf.substring(i,i+1));

      //faz o cálculo com a sequência de 10 até 2
      soma = soma + (v[i] * sequencia);

      //decrementa a sequência
      sequencia--;

   }

   //pega o resto da divisão da soma das multiplicações com 11
   resto = soma % 11;

   //caso resto igual a 0 ou a 1 então retorna 0
   if (resto == 0 || resto == 1){

       return 0;

   }else{ //caso contrário retorna 11 menus o resto

       return (11 - resto);

   }

  }

  /** FAZ O CÁLCULO DO 2º DÍGITO VERIFICADOR
  * A ÚNICA DIFERENÇA É QUE A MULTIPLICAÇÃO DA
  * SEQUÊNCIA É FEITA A PARTIR DO SEGUNDO ALGARISMO
  * DO CPF ATÉ O 1º DÍGITO VERIFICADOR
  */
  int dV2(String cpf){

  int v[] = new int[11];
  int soma = 0, sequencia = 10, resto;

  for (int i=1; i<10; i++){

     v[i] = Integer.parseInt(cpf.substring(i,i+1));

     soma = soma + (v[i] * sequencia);

     sequencia--;

  }

  resto = soma % 11;

  if (resto == 0 || resto == 1){

     return 0;

  }else{

     return (11 - resto);

  }

 }

}

Classe Principal >>


  import java.util.*;
  import javax.swing.*;
  /**
  *
  * @author leowgweb
  */
  public class CpfValida {

  public static void main(String[] args) {

  String cpf;

  //instanciando a classe
  Valida v = new Valida();

  /*
  * caso ocorra alguma exceção(Se o usuário digitar
  * caracteres em vez de números)
  */
  try{

     cpf = JOptionPane.showInputDialog(null, "Entre com o seu CPF","Verificação"
     ,JOptionPane.INFORMATION_MESSAGE);

     //caso a quantidade de caracteres exeda ou seja inferior a 11
     if (cpf.length() != 11){

        JOptionPane.showMessageDialog(null, "A quantidade de algarismos "
        + "não está correta!","ERRO",JOptionPane.WARNING_MESSAGE);

     //caso esteje tudo ok
     }else{

        //seta os dígitos verificadores do cpf digitado
        v.setD1(Integer.parseInt(cpf.substring(9,10)));
        v.setD2(Integer.parseInt(cpf.substring(10,11)));

        //faz a verificação dos dígitos verificadores
        if ((v.getD1() == v.dV1(cpf)) && (v.getD2() == v.dV2(cpf))){

            JOptionPane.showMessageDialog(null, "CPF VÁLIDO");

        }else{

            JOptionPane.showMessageDialog(null, "CPF INVÁLIDO","Verifica",
            JOptionPane.WARNING_MESSAGE);

        }

    }

  //caso exista alguma exceção então da um erro
  }catch(Exception e){

     JOptionPane.showMessageDialog(null, "Erro: Digite apenas Números! "
     ,"ERRO",JOptionPane.ERROR_MESSAGE);

  }

 }
}

Quero ser avisado quando o novo blog for lançado

Instalando e Utilizando o Dropbox


e ai pessoal blz … para esse post criei uma vídeo-aula dividida em 2 partes para mostrar para vocês como se instala e utiliza essa maravilhosa ferramenta de compartilhamento de arquivos na nuvem chamada “Dropbox”. O 1º vídeo vou está falando da instalação e do ambiente local e no 2º vídeo vou falar sobre o ambiente na web. Confiram >>

Download Dropbox >> 

Aprender a programar de forma fácil


Novo blog em breve...fique por dentro ->

fala galera blz …  nesse post vou dar algumas dicas de softwares para aprender a programar de forma fácil e ágil. Mas mesmo assim exige um pouquinho de dedicação de cada um. Vamos lá >>

>> Codea <<

É uma ferramenta da Apple para desenvolver para iPad e iPhone.  Está na versão 1.3.6 e veio optimizado para o novo display Retina iPad, e também pode renderizar gráficos 3D.

Acessar página da ferramenta >>

>> Kodu <<

É uma ferramenta da Microsoft destinada a crianças e pessoas que não tem nenhum conhecimento de programação. Se comporta como se fosse um jogo e funciona como um treinamento para lógica de programação. É uma ferramenta rica para a criação narrativa e criação de histórias.

Vídeo de Apresentação do Kodu

Acessar página da ferramenta >>

>> Greenfoot <<

É um software educacional para ajudar a programar de forma fácil em Java

Acessar página da ferramenta >>

>> Hackety Hack<<

Aprenda Ruby uma das linguagens muito difundidas para aplicações web e desktop de forma divertida

Acessar página da ferramenta >> | Download >>

>> Ruby 4 Kids <<

Aprende a desenvolver jogos de forma fácil e divertida. Construído para crianças.

Acessar página da ferramenta >>

>> Small Basic <<

Uma ferramenta da microsoft também com o intuito de programar de forma fácil

Acessar página da ferramenta >> | Download >>

Quero ser avisado quando o novo blog for lançado

Teclas de Atalho no Firefox


olá pessoal, nesse post vou colocar umas dicas que achei na Web sobre teclas de atalho do firefox. É bem interessante pra quem idolatra esse navegador fantástico. E garanto que com pouco tempo na prática vocês vão se familiarizar com os atalhos e usar o navegador com muito mais produtividade. E vão surpreender com a rodinha do meio do mouse, bem legal o que ela pode fazer. Confiram >>

Ctrl + F – Localizar palavra na página

Ctrl + G – Localizar de novo, ou seja, a mesma palavra da pesquisa anterior

Ctrl + K – Ir para a search bar, onde você pode pesquisar no seu sistema de buscas favorito, como Google, Yahoo, e até Submarino, Mercado Livre, etc.

Rodinha do Mouse (ou botão do meio) – Se você quiser abrir um link em uma nova aba, basta clicar nele com o botão do meio do mouse. Você também pode clicar com o botão do meio se quiser fechar alguma aba, pra isso clique em cima da aba com o botão do meio. Se você clicar com o botão do meio no botão ‘Voltar’, a página anterior abrirá em uma nova aba. Maneiro, não?

Ctrl + Rolando a Rodinha do Mouse – Pra aumentar ou diminuir o tamanho da fonte.

Ctrl + (+) ou Ctrl + (-) – Aumenta ou diminui o tamanho da fonte.

Ctrl + B – Abrir a barra lateral de Favoritos (bookmarks)

Ctrl + H – Abrir a barra leteral do Histórico

Ctrl + D – Adicionar site atual aos Favoritos

Ctrl + J – Abrir Gerenciador de Downloads

Ctrl + U – Ver o código fonte da página

Ctrl + (1 a 9) – Selecionar aba

Ctrl + W ou Ctrl + F4 – Fechar aba

Ctrl + Tab – Alternar aba

Fonte: http://firefoxbrasil.blogspot.com.br/2006/01/algumas-teclas-de-atalho-no-firefox.html

Crie um site como este com o WordPress.com
Comece agora