Mostrando postagens com marcador SEO. Mostrar todas as postagens
Mostrando postagens com marcador SEO. Mostrar todas as postagens

14/03/2018

Otimizando as imagens para seu site de forma fácil



Uma das métricas do Google para pontuar seu site e melhorar o ranqueamento do mesmo é ele está bem otimizado. E uma dessas otimizações são a velocidade que ele carrega. Sendo assim é muito importante que as imagens estejam otimizadas e de um tamanho razoável.

Levando então em consideração as imagens, as mesma devem estar de uma boa qualidade porém que seu tamanho em KB seja o menor possível.

Vamos então passar algumas dicas para se otimizar as imagens.

Em primeiro lugar é orientar quem vai tirar as fotos, e ou produzir as mesmas para que sejam incluídas no site para que utilize uma resolução definida por você. Digo pois muitas pessoas tem a ilusão em achar que as imagens devem ter a maior qualidade possível.

Oriente também em procurar usar o padrão de cores RGB que é o utilizado pelos monitores. CYMK são utilizados para impressões o que não é nosso caso.

Já tendo as imagens mostramos no vídeo abaixo métodos utilizando :

TINYPNG: Otimizador on line. Neste no modo gratuito é possível otimizar 20 arquivos de no máximo 5 MB por vez. Pode-se baixar todos os arquivos de uma só vez em um arquivo compactado.

EASY-RESIZE: Otimizador on line. Serviço on line totalmente gratuito o qual pode-se definir a resolução desejada e o tamanho máximo que deseja o arquivo (aproximado). Este é necessário baixar cada arquivo otimizado separadamente

FASTSONE: Programa gratuito conversor de imagens e uma ferramenta de renomeação que pretende permitir aos usuários converter, renomear, redimensionar, cortar, girar, alterar a profundidade de cores, adicionar texto e marcas d'água para imagens em um modo de lote rápido e fácil. A operação do mouse arrastar e soltar é bem suportada.
  • Converta e mude o nome das imagens no modo de lote
  • Suporte JPEG, BMP, GIF, PNG, TIFF e JPEG2000
  • Redimensionar, cortar, alterar a profundidade de cor, aplicar efeitos de cor, adicionar texto, marca d'água e efeitos de borda
  • Renomeie imagens com número sequencial
  • Pesquisar e substituir textos nos nomes dos arquivos 
  • Visualização de conversão e renomeação
  • Estrutura de pasta de suporte / pasta
  • Carregar e salvar configurações
  • E muito mais...

Veja o vídeo abaixo e espero ter sido útil. Caso deseje ver o vídeo diretamente no Youtube clique aqui





19/12/2017

Qual o primeiro passo ao iniciar o projeto no Web Acappella RC?

TEMA: WA RC  |  SEO
ARTIGO: Novo
VERSÃO: WA RC 

É isso aê galera!! Hoje vou fazer uma lembrança muito importante, inclusive para melhorar o SEO  no seu site. 

O procedimento que vou falar aqui é super simples porém  de muita importância, e deve ser o primeiro passo a fazer antes de qualquer coisa ao iniciar um projeto no WebAcappella Responsive.

Todos sabem que as met tags para SEO no site é uma ferramenta importante de comunicação entre o o site e os mecanismos de busca tais como o Google. 

São várias meta tags que podem ser inseridas, porém o Webacappella disponibiliza apenas 3 que podem sem personalizadas através das configurações pelo Webmaster. Algumas ele não disponibiliza  e outras ele já insere automaticamente. Entre elas, não sei se poderia considerar como exatamente uma tag, mas é informar o idioma. 

E é disso que estou falando, o "idioma". Que é o atribudo HTML Lang. Este o Webacappella Responsive insere automaticamente no site. 

Você pode ver após publicar o seu site e na hospedagem editar o arquivo index.html por exemplo. Está logo nas primeiras linhas.

O atributo HTML lang pode ser usado para declarar o idioma de uma página da Web ou uma parte de uma página da Web. Isso é destinado a ajudar motores de busca e navegadores.

Os desenvolvedores do mundo inteiro juntamente com os desenvolvedores de browsers e outros , procuram ter a certeza que os navegadores, robôs de busca, leitores de tela e outros sistemas detectem da forma ideal o idioma correto.

Nós precisamos definir o idioma por alguns motivos:

  • Melhor pronunciação do texto em leitores de tela.
  • Para que os buscadores possam indexar o website no buscador do respectivo idioma. Por exemplo: não tem sentido o Google ranqueear muito bem um site em português no Google americano.
  • Selecionar as fonts corretas para mostrar na tela. Nesse caso para idiomas como Chinês.
  • Para que os browsers escolham o dicionário correto para a correção gramatical nativa em textos e formulários.
  • Renderizar a página rapidamente – o browser carrega o documento mais rápido quando o browser sabe qual o idioma nativo.
Pode-se  definir de várias maneiras o idioma padrão no documento exibido ou em partes do texto para aqueles termos em idiomas diferentes.

  • Podemos definir diretamente via metatag nativa.
  • Pela Metatag podemos definir vários valores no atributo content.
  • Via HTTP Header.
  • Via atributo lang nos elementos do HTML. ( e este que o Webacappella Responsive utiliza e é esse que estamos orientando a mudança) 


Declarações de idioma baseados nestes atributos são importantes para a maioria das aplicações web hoje, que vão desde as corretores ortográficos embutidos diretamente nos browsers até leitores de telas que interpretam as páginas web.

E onde fazer esta configuração no Web Acappella Responsive?

Muito simples, mas é de extrema importância em fazer antes de iniciar o seu projeto, pois caso quiser alterar depois do projeto pronto você tera´que ir depois em cada campo onde foram digitados os textos, inclusive botões , menu e tags e  digitar o texto todo novamente. 

Então vamos o que interessa:

Assim que criar o nome do projeto vá em Website settings na tela inicial:



Caso seu idioma não apareça na lista clique em +.




No caso aqui estou supondo que o site será no idioma Português Brasil, então selecione na lista que aparecer.



Logo em seguida aparecerá uma caixa para selecionar a linguagem que deseja nas mensagens e aplicações. Selecione então a desejada, No caso de nossa explicação será para sites do Brasil, então Português Brasil.





Agora clique em cima do idioma desejado e logo após clicando na seta para cima o posicione na primeira posição




Clique para Salvar e prontinho. Observe agora após publicar que no inicio do código foi definido o idioma escolhido por você.




Outra grande vantagem de fazer essas configurações é que as mensagens do WA como por exemplo de formulários estarão no idioma correto e também por exemplo; se for usar a barra de busca no menu aparecerá Pesquisa em vez de Seach 


Pois é isso aí galera, se a lembrança foi boa.. sinta-se a vontade de compartilhar. 

Um grande abraço.


11/09/2017

Google+ Badge




TEMA: Redes Sociais e SEO 
ARTIGO: Novo
VERSÃO: WA RC  |  WA 4



O Google Badge é seu crachá do Google+ e é uma ótima maneria de aumentar o seu público no Google+ e obter mais recomendações para o seu site na busca do Google.

Você não só terá beneficiando seu site como também seus usuários finais.

O único fator contra é que eles nem sempre combinam bem com o que o site representa.

Em sites de profissionais liberais, freelances e pessoas públicas tais como fotógrafo, cantor,  candidato político e afins é uma ótima opção.

Para implantar o Gaoogle Badge é necessário que tenha uma conta de perfil no Google +.

Então o primeiro passo é fazer login em sua conta.


Após logado vá para o seguinte link:

https://developers.google.com/+/web/badge/



Agora basta configurar a seu gosto como gostaria que fosse mostrado o seu crachá do Google +.

Sugerimos:

Em Recursos deixe marcado como Emblema
Em Layout deixe marcado com Retrato
Em largura deixe no máximo como 320 (garantindo boa apresentação em dispositivo móveis)
Em tema de cores vai depender das cores utilizadas nos seu site e o design (gosto muito do escuro)
Foto da capa deixe assinalado se queira que a imagem da capa do seu google+ apareça em fundo, se não deixe como desativado.
Em frase sugerimos deixar como Desativado.
Em Idioma selecione o seu.

Nas opções avançadas assinale a caixa de verificação em Dinâmico.
Nas opções avançadas em Analisar tags marque como Explícito

Após configurar copie o código que é disponibilizado no quadro abaixo do crachá.


O nosso exemplo ficou como abaixo:







IMPLEMENTANDO NO WEBACAPPELLA 4

Para implantar no Web Acappella 4 nas configurações acima citadas NÃO marque Dinâmico em configurações avançadas conforme dito acima. Deixe sem marcar.

Agora  insira um elemento código HTML no local que deseja que o Google Badge apareça




Cole o código no campo de código no elemento. Dê um nome para o elemento e não marque Ativar pré-visualização, pois a mesma não irá funcionar.



Na mesma janela do eleamento Código html clica na aba da régua. e defina altura e largura com o mesmo valor que definiu nas configurações ao criar o Google Badge.

Publique e pronto.

Para ver on line no Webacappella 4 clique aqui.



IMPLEMENTANDO NO WEBACAPPELLA RC (WA5)


Já no Wa Responsive é necessário que nas configurações para gerar o código seja marcado como dinâmico.

No seu projeto insira um box e um subbox, dentro do subbox insira um elemento HTML




Clique duas vezes no elemento para incluir o código, e insira acima de todo código a expressão <center>. Desta forma a visualização nos dispositivos móveis será centralizada.


Publique o site.

Para ver on line no Webacappella Responsive clique aqui.

É ISSO AÍ GALERA. FICA A DICA.. ABRAÇOS




17/05/2017

URL personalizada



TEMA: SEO
ARTIGO: Novo
VERSÃO: WA4 | WARC


Como todos sabem o posicionamento do seu site nos mecanismos de busca dependem de várias diretrizes.  

Muitos se preocupam com meta tags tipo título, descrição e palavras chaves e esquecem das URLS. Há os que dizem que as URLs não influenciam em nada. Se enganam. Uma URL bem definida pode ajudar e muito o posicionamento nos mecanismos de pesquisa.

Vamos por exemplo tirar como base as próprias url's criadas em nosso blog do WebacappellaShow. O WebAcappellaShow é feito pela tecnologia do " Blogger" que pertence ao Google. 

Peguei o link:
 https://webacappellashow.blogspot.com.br/2016/10/google-analytics-no-site-webappella.html



Repare que se eu não defini uma url personalizada o próprio Blogger criou a url personalizada baseado no título da postagem. Poderia ser https://webacappellashow.blogspot.com.br/2016/10/post200.html.
Mas não!! Ele criou baseado no que se trata, pois no título já informei o assunto.

E os hifens? 

Apesar que o Google por exemplo possui uma tecnologia para reconhecer a separações de palavras, o hífen é de grande importância pois eles ajudam o Google entender do que se trata.  Lembre que existem palavras formadas de mais de uma palavra. 

Por exemplo:
Dentro da palavra legalmente  se encontra legal e mente
Dentro da palavra contador se encontra conta e dor

E para quem não sabe o hífen é um dos coringas do Google. 

Caso queira saber mais sobre estes coringas do google você encontra mais informações clicando aqui

Outro erro que se comentem muito por aí é definir as url somente como a opção usada no menu do website. 

Por exemplo:

Supomos que no site webacappellashow.com.br tem a página contato.

O que não é uma boa prática é definir a url tipo webacappellashow.com.br/contato.html

O que eu sugiro é uma url mais personalizada ficando mais ou menos assim: webacappellashow.com.br/fale-com-quem-tem-conhecimento-em-webacappella.html

ou até mesmo www.webacappellashow.com.br/contatar-profissional-web-acappella.html


No caso acima eu usei no link a palavra Webacappella pois o domínio é webacappellashow.com.br . Sendo que estão duas palavras juntas: webacappella+show. Desta forma eu ajudei ao Google a entender do que se trata.

Pois se o seu domínio já for exatamente o nome ou marca no seu site, não seria necessário repetir na url personalizada.

Agora por exemplo se uma empresa chamar Garden Jardins, e seu domínio for gjpaisagismo.com.br é interessante citar garden-jardins na url. Na página de contato poderia ficar por exemplo assim: www.gjpaisagismo.com.br/fale-com-empresa-jardinagem-garden-jardins.html


Eu tenho um amigo que é dono do site pertoaqui.com.br, que é um script em php.  O Perto Aqui é um site de anúncios. 

No exemplo abaixo onde na imagem está assinalado de vermelho ele tinha cadastrado o anunciante como Fernandes Clean. 



Ou seja, ele cadastrava apenas o nome do cliente. Porém quem procura Fernandes Clean nos mecanismos de busca é somente quem já conhece a empresa, e na maioria das vezes já até sabe o site dela. Depois que ele mudou os cadastros como mostra a imagem acima. O site começou ter muito mais visitas. Ele ainda poderia ter posto melhor. Posto por exemplo: Fernandes Clean, empresa de limpeza no Bairro Betãnia. 

Para vocês verem a importância de uma boa definição para a url.

Veremos agora como personalizar as url no Webacappella 

No WA 4

Para cada página clique na opção Páginas/Matrizes>>Propriedades da Página, na tela que aparecer você clica em SEO e no primeiro campo você digita a url que deseja, conforme imagem abaixo:




Depois clique em Ok


PARA O WA RC (WA5)

Para cada página  clique em Page Properties (Propriedades da página)



E no primeiro campo você digita sua url personalizada. 




Depois Salve 

Finalizando, é importante lembrar que esta é apenas uma das técnicas utilizadas. Muita outras são necessária para que seu site fique cada vez melhor posicionado nos mecanismos de busca.

Em breve mais posts sobre S.E.O.


12/10/2016

Google Analytics no site Webappella




TEMA: SEO
ARTIGO: Novo
VERSÃO: WA4 | WARC

Google Analytics é uma, Interface de Programação de Aplicativos. Ou seja, uma ferramenta ita e disponibilizada gratuitamente pelo Google para ser usada pelos desenvolvedores de sites e profissionais de Search Engine Optimization (SEO). Com o Analytics você consegue acompanhar detalhes sobre a visitação e estatísticas do seu site.

Outro fator importante do Google Analytics é o primeiro passo para que o Google saiba que seu site exista. Vamos pela lógica. Você acha mesmo que se não tiver nenhum outro lugar, seja blog, redes sociais, sites de diretórios e etc ; ou seja ..qualquer outro lugar apontando para seu site, ele será encontrado pelo mecanismos de busca? Sinceramente tenho minhas dúvidas.

Lógico que  tem outros recursos e técnicas para que ele seja melhor posicionado, como o sitemap por exemplo. Mas só de se cadastrar o seu site no Google Analytics, o Google já sabe que ele existe.

Neste artigo não vamos explicar como utilizar o Google Analytics, até mesmo que seria um artigo mais extenso. Mas pode aguardar que farei um artigo sobre isso mais pra frente.  Mas hoje vamos configurar no WebAcappella seu id do Google Analytics. 

O primeiro passo é criar sua conta no Google, neste link: https://accounts.google.com/AddSession

Não posso garantir que este link seja válido para o resto da vida., pois tudo pode mudar.

Após criar a conta você já estará logando no Google Analytics. Caso já tiver uma conta Google vá direto para este link: https://www.google.com.br/analytics/ e faça login.



Caso seja a primeira vez que utilize



Clique em Increva-se e preencha os campos referente ao Website que deseje cadastrar.

Depois clique em Obter ID de acompanhamento.





Aceite os termos.

Você já será redirecionado para a página contendo sua ID  e o código de acompanhamento. 

Eu costumo a criar uma pasta no pc de cada cliente e dentro da mesma um arquivo denominado credenciais.txt onde coloco todas as credenciais e particularidade como esta.

Então dentro deste arquivo eu colei as anotações semelhantes a abaixo


--------- GOOGLE ANALYTCS

ID: UA-85619172-1

CÓDIGO:

<script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

  ga('create', 'UA-85619172-1', 'auto');
  ga('send', 'pageview');


</script>

Caso já tenha algum site cadastrado na conta do Google Analytcs


Caso você ja tenha outro site configurado no Google Analytcs provavelmente vai aparecer uma tela semelhante a esta.



Neste caso para incluir um novo site clique em ADMINISTRADOR >> SELECIONE NA COLUNA DE CONTA A OPÇÃO Criar Nova Conta




Preencha os campos referente ao Website que deseje cadastrar.

Depois clique em Obter ID de acompanhamento.





Aceite os termos.

Você já será redirecionado para a página contendo sua ID  e o código de acompanhamento. 

Eu costumo a criar uma pasta no pc de cada cliente e dentro da mesma um arquivo denominado credenciais.txt onde coloco todas as credenciais e particularidade como esta.

Então dentro deste arquivo eu colei as anotações semelhantes a abaixo


--------- GOOGLE ANALYTCS

ID: UA-85619172-1

CÓDIGO:

<script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

  ga('create', 'UA-85619172-1', 'auto');
  ga('send', 'pageview');


</script> 



O Webacappella tem uma vantagem. Ele já inclui o script do Google Analytcs em todas as páginas do projeto automaticamente. Tanto no WA4 quanto no WARC. 


Este procedimento ajuda a diminuir a taxa de rejeição do site perante ao Google. Então basta configurarmos a ID no site que todas as páginas do projeto já serão configuradas com o script automaticamente no site.


APLICANDO NO WA 4 

Clique em na opção do Menu em SITE>>PROPRIEDADES DO SITE



Na tela que se abrirá, na opção SEO, digite a ID no campo referente Estatísticas do site 



Clique em OK  e agora só publicar o site.



APLICANDO NO WA RC  (WA 5)

Na tela principal do projeto clique em WEbsite Setiings



Role a página até encontrar o campo do Website statistics (Google analytics) e preencha o campo com a ID



Clique em Save and close   e agora só publicar o site.




Prontinho, configurado. Agora só esperar o robô do Google visitar seu site para começar a apurar os dados estatísticos. 

Mais pra frente falaremos mais sobre técnicas de SEO , inclusive sobre o mapa do site.

Grande abraco.


Related Posts Plugin for WordPress, Blogger...