Como Otimizar um Site para Visualização em Smartphones

Um estudo recente deixa claro a importância que os dispositivos móveis possuem no consumo de informação. De acordo com a pesquisa, mais de 60% do tempo gasto com mídias digitais se dá através de um smartphone ou tablet, contra 40% do tempo gasto atrás da tela de computadores. Vivemos em um mundo cada vez mais conectado entre tudo e todos, a todo momento.
Como Otimizar um Site para Visualização em Smartphones
Fica evidente a importância de se desenvolver websites que sejam responsivos a dispositiivos móveis. Nesse sentido, existem diferentes maneiras de oferecer uma boa experiência móvel aos usuários. Nem sempre é necessário reconstruir um site a partir do zero para isto. Dependendo da finalidade do site em questão, é possível adotar algumas medidas simples que irão transformar o modo como os seus visitantes podem interagir com o seu conteúdo.

Instalar um Tema ou Plugin Responsivo
A melhor forma de garantir uma experiência de acesso móvel de qualidade é planejando a versão mobile do site desde o início. A forma mais fácil e eficiente de fazer isso é através da instalação de um tema responsivo. O WordPress possui centenas de temas responsivos gratuitos, e existem outros milhares a venda que oferecem funções mais específicas, como integração com e-commerce e outras plataformas.

Caso se trate de um site mais antigo e com um tema instalado que não seja responsivo, uma alternativa é a instalação de um plugin responsivo, que adapta o conteúdo do site conforme a tela em que é exibido. Não é a solução ideal e não funciona perfeitamente em todos os sites, mas pode ser uma boa alternativa temporária até que se resolva por readequar o design do site por completo.

Algumas empresas de hosting oferecem a opção de realizar a instalação do WordPress e seus temas diretamente do painel de controle. É o caso da 1&1, que oferece planos de hospedagem com domínios ilimitados. Com apenas alguns clicks é possível instalar o WordPress e configurar o tema escolhido em questão de minutos. 
Como Otimizar um Site para Visualização em Smartphones
Utilizar Fontes e Botões de Tamanhos Adequados
O tamanho da fonte é um dos fatores mais importantes na visualização de um site em smartphones e tablets. O tamanho mínimo para uma leitura confortável é de 14px. Os únicos campos em que um tamanho menor é aceitável são etiquetas e formulários. 
Quanto aos botões, é importante que sejam de um tamanho grande o suficiente para que os usuários não tenham dificuldade em pressioná-los ou ainda que pressionem o botão errado. O guia de desenvolvimento da Apple, por exemplo, recomenda que sejam de no mínimo 44px por 44px. 

Oferecer a Opção de Visualização de Desktop
Não importa o quão bonito seja o design de um site responsivo, é importante que não se limite a experiência do usuário. É importante oferecer a opção “visualizar a versão para desktop” no rodapé do site mobile. Muitas pessoas podem estar acostumados com a versão completa do site, e podem ter alguma dificuldade em encontrar o que procuram ao acessá-lo através de um smartphone. 

Determinar a Largura das Imagens Para 100%
Se o tema não for responsivo por natureza, as imagens podem apresentar problemas de visualização em dispositivos móveis, as vezes ultrapassando as margens do restante do conteúdo. Para contornar este problema, basta configurar o tamanho máximo de exibição das imagens para 100%. Assim, as imagens irão se adequar naturalmente a qualquer tela em que forem exibidas. Isso pode ser feito com apenas algumas linhas de código CSS, acrescentando “img { max-width: 100% }” ao arquivo da folha de estilos.

A Google oferece uma ferramenta que verifica se um site pode ser exibido sem problemas em dispositivos móveis, e informa os possíveis erros de visualização e maneiras de como podem ser corrigidos.

Smartphones

Qualquer smartphone é um aparelho portátil e fácil de transportar que permite fazer chamadas telefónicas, mas que também lhe acrescenta outras características como a capacidade de enviar e receber e-mail, criar e editar documentos, fotografar, visualizar e transmitir arquivos de dados e de imagem, bem como reproduzir música, para além de outras funcionalidades.
Smartphones
Verdadeiras mini-caixinhas cheias de poderes surpreendentes, os smartphones permitem, a quem pretenda, para além de os usar como instrumentos de trabalho, utilizá-los como verdadeiros instrumentos de diversão.

Entre as diversões possíveis, está a possibilidade de se fazerem jogos com e a partir deles.

Qualquer smartphone permite-lhe aceder imediatamente a qualquer sítio de jogos de casino online e mediante um registo e um depósito – caso pretenda jogar a dinheiro – apreciar qualquer jogo tradicional de casino, como a roleta, o blackjack, as máquinas de slot, o Baccarat e tantos outros. Quase todos os sítios web de jogos de casino online disponibilizam jogos gratuitos, bem como, as regras de qualquer jogo, os procedimentos, as tácticas e até regras de jogo responsável.

Mas, existe também outra forma de se jogar. Para tal, basta ao jogador aceder a qualquer sítio de jogos de casino online como RoletaOnline.pt e descarregar aplicações de casino (casino apps) directamente para a memória do seu smartphone. Estas aplicações, permitem ao utilizador jogar qualquer dos seus jogos preferidos de casino, seja à roleta, às máquinas de slot ou ao poker, entre muitos outros disponibilizados, de forma muito mais segura.

Para quem joga a dinheiro, este tipo de apps de casino são mais seguras, uma vez que, todos os jogadores têm que previamente efetuar um registo, antes de começar a jogar, e os casinos online que os fornecem utilizam tecnologias altamente avançadas de criptografia de dados, o que garante a privacidade e segurança na transmissão de dados e em todas as transações financeiras.

Dicas para o desenvolvimento de um artigo de qualidade

Neste artigo vou mostrar as melhores dicas para o desenvolver de artigos de qualidade e que agradam ao leitor. Eu acho muito importante termos ideia dessas dicas abaixo, pois elas mim ajudam muito quando vou desenvolver o artigo.

Desenvolver artigos com qualidade


Vou reunir aqui as melhores formas de atrair, prender e fazer com que o leitor se agrade de seu artigo.
Pois a qualidade de seus artigos é a peça principal e a base de seu blog, por isso os desenvolva com qualidade, pois ele é o único meio de levar seu blog ao sucesso.

É também muito importante que você busque criar seus artigos sem erros ortográficos e com uma boa estrutura, os desenvolvendo de forma alinhada e utilizando se necessário de imagens, para a melhor demonstração do que você busca expressar.

1. Concisão
Propriedade de ser ser objetivo, breve. É uma ótima forma de tornar a leitura apreciada, fazendo com que o leitor não perca a atenção ao assunto.

2. Clareza
É um dos atributos da boa linguagem e, naturalmente, decorre daquele texto conciso e com correção gramatical.
A clareza pode se mostrar por meio de duas faces:
- Estética: artigo organizado, com uma boa aparência.
- Linguagem: simples e que proponha um bom entender aos leitores.

3. Ideologia
Refere-se às ideias claras, dotadas da objetividade, na linha de raciocínio pelo escritor.

4. Precisão
A linguagem precisa permitirá a escolha da palavra certa na boa medida. Além disso, este atributo denotará a versatilidade vocabular do escritor.

5. Naturalidade
No decorrer do artigo a naturalidade será detectada pela argumentação razoável. Por isso busque expressar suas ideias de forma atraente aos leitores, sem que os mesmos percam a sua essência.

6. Originalidade
É importante que você transmitia aos seus leitores artigos originais e que passem confiança para eles ao lerem.

7. Nobreza
Um bom artigo é aquele que prima pela linguagem minimamente solene, que pode ser apreendida por qualquer leitor, haja visto que o artigo será publicado para pessoas de endereços indeterminados, para que abranja ao maior alcance possível.

8. Harmonia
Um artigo harmônico é aquele que mantém o leitor preso a leitura, que possui ideias ligando a ideias, sem o desvio ou a contradição das mesmas. Mantendo assim a superfície do artigo racional, onde é proposto um ponto de partida e outro de chegada, ou seja, com início, meio e fim. 
Esse recurso é excelente para manter o foco do leitor no artigo e não perca o tema central do mesmo.


E você utiliza dos itens acima para desenvolver seus artigos?

Google Sites - Como hospedar arquivos

Atualmente o blogger ainda não disponibilizou o serviço de hospedagens de arquivos ( exceto imagens ), onde muitas vezes utilizamos de alguns sites externos que oferecem esse serviço. Onde muitas vezes nossos arquivos hospedados nesses sites são excluídos ou acabam ficando com problemas.

Google Sites


O Google, claro, possui grande credibilidade com os serviços que ele oferece. Onde encontrei o Google Sites e notei que ele aceita diversos tipos de arquivos para serem hospedados no mesmo, como imagens, templates, pdf, scripts, etc.

Tutorial
1. Acesse o painel do Google Sites. ( Acesse o painel utilizando sua conta do Google )
2. No painel vai aparecer os seus sites ( normalmente você irá encontrar um site com o nome de sua conta, caso não, crie um ), clique em cima do seu site.
Painel Google Sites.
3. Na página que abriu, clique em "Nova página" ao topo a direita.
Site - Google Sites.
4. Adicione um nome a essa página e, em modelo, escolha “Arquivo”, em local, escolha “Colocar página no nível superior” e depois clique em “Criar”.
Criar nova página.
5. Clique em "Adicionar arquivo", vai abrir uma janela para que você selecione o arquivo que deseja fazer upload.
Adicionar arquivo / Upload.
6. Em meu caso, hospedei um arquivo txt. Após o upload, clique com o botão direito do mouse em "Download" e copie o link/endereço para que você utilize desse arquivo, para disponibilizá-lo para alguém ou para utilizá-lo em algo.
Endereço do arquivo.

E em algum HTML, dessa forma ( deixando o link até a extensão .txt ):

Whois - Veja informações de domínios

O Whois é um programa muito utilizado, pois ele oferece uma ferramenta onde podemos "investigar" domínios, ele permite que você veja diversas informações de domínios ( desde que o próprio não esteja bloqueado ), ele é muito útil para quem quer obter informações de contato do dono do domínio, a empresa que o domínio foi registrado ou pelo simples fato de curiosidade.

Ao baixar e instalar o programa, você pode realizar pesquisas para obter informações sobre o DNS do servidor que o site está hospedado, data de compra e expiração do domínio, entre várias opções. Confira a imagem abaixo.
Wois - DesenvolvendoBlogs.com

Otmizador de imagens online

Deixe suas imagens leves.

Uma boa forma de aumentar a velocidade de carregamento de suas imagens e assim de seu blog ou site é deixando os arquivos com pouco tamanho.
Neste artigo vou mostrar como otmizar suas imagens, tanto elas em seu computador ou ela já sendo hospedadas na internet.
Para utilizar dessa ferramenta online do site DynamicDrive siga o tutorial abaixo:

Tutorial
1. Acesse a seguinte página: http://tools.dynamicdrive.com/imageoptimizer
2. Caso sua imagem já esteja hospedada, no campo 'Enter the url of an image' coloque a url de sua imagem, caso ela esteja em seu computador e queira fazer upload em 'upload one from your computer' selecione a imagem em seu computador.
3. No campo 'convert to'  escolha o formato que você deseja para a imagem ( converter ).
4. Clique em "optimize" para gerar as 10 imagens convertidas e para ver todas elas marque a caixa 'show all results'.
Otimize suas imagens online

Após isso você irá visualizar todas as imagens geradas, para que você salve em seu computador ou utilize dela já hospedada.
Resultado de imagens otmizadas
Cada imagem gerada mostra ao lado seu tamanho e a porcentagem da redução ligada com a qualidade da imagem.

E você gostou do site? Conhece mais algum com essa função? Comente.

ShrinkTheWeb - Tire screenshots das páginas de seu blog

shrinktheweb

Muitas vezes precisamos de tirar um screenshot ( foto ) da página de algum blog ou site para utilizarmos em algum artigo, divulgação do blog, etc. E para isso muitas vezes temos um grande trabalho para algo muito simples. Para isso o site ShrinkTheWeb oferece uma ferramenta onde podemos tirar screeshots de determinadas páginas rapidamente e de forma simples, o site gera imagens das screenshots com o seguinte tamanho: 75×56; 90×68; 100×75; 120×90; 200×150 e 320×200, com o formato .JPG, para utilizar do site siga o tutorial abaixo.

Tutorial
1. Acesse o site http://www.shrinktheweb.com
2. No campo Generate a Screenshot, coloque a URL da página seu blog ou site. Depois clique na setinha verde.
gerar screenshots

3. Vai abrir uma página, nela espere de 15 a 1 minuto para que o site gere as imagens das screenshots. Depois clique no link "Click Here to Check"
url de thumbnails geradas

4. Na página que abriu você irá ver todas as screenshots geradas. Para que você utilize dessas imagens, basta salva-las ou copia-las em seu computador.
screenshots

Pronto aqui acabamos esse tutorial, espero que tenham gostado, aproveite e comente sobre o que você achou do site.

Crie um SlideShow com música para seu o Blog com o Kizoa

Kizoa

O Kizoa é um ótimo site de criação de SlideShows, além da música ele possue diversas ferramentas avançadas que você pode utilizar facilmente.
Siga o tutorial abaixo para saber como criar uma conta e colocar o SlideShow em seu blog.

Tutorial
1. Acesse o site: http://www.kizoa.com
2. Clique no botão "Get Started"
Get Started

3. Vai abir uma página em uma Pop Up com um formulário de cadastro, adicione seu nome, sobrenome, data de nascimento, email e senha. Depois clique em "Confirm registration"
Criando conta no Kizoa

4. Vai abir uma página já com as ferramentas do site, você pode fazer upload de fotos de seu computador para adicionar ao silide. No menu principal clique em "Slideshow maker" adicione as fotos ao seu slide, personalize com transições, efeitos, música a sua escolha. Depois clique em "Save" e coloque o nome de seu slide no box que abriu, depois clique em "Save" novamente.
Criando Slideshow

5. No menu principal clique em "My Slideshows" e no que você criou clique em "Add to Blog" nas opções no fim da página.
Adicionar slide ao blog

6. Vai abrir um box e copie o 'HTML Code' e cole em um gadget ( HTML/JavaScript ) de seu blog.
html code do slideshow

Dica: Explore as diversas ferramentas do site para construir um slideshow bem legal, apesar dele ser em inglês você pode ter algumas noções e tentar utilizar dessas ferramentas.

O que é Link Quebrado? Como verificar se há em meu Blog?

Links Quebrados
Links quebrados são necessariamente links que apontam para nenhum lugar, ou seja, onde não há ligação. Como sabemos podemos inserir links em textos ou mesmo em imagens, mas muitas vezes vamos escrever um link e colocamos por falta de atenção ou descuido alguma caractere a mais e assim acabamos tornando esse link quebrado, pois o link inserido não existe ou está fora do ar.

Como vejo quais os links quebrados em meu blog?
Normalmente se formos fazermos uma revisão em todos o artigos em nosso blog poderemos assim ver se há links quebrados neles, mas isso pode se tornar um trabalho muito longo e cansativo, principalmente para quem possue muitos artigos.
Mas felizmente existem algumas ferramentas online que podem nos fornecer ajuda com relação a isso.
O site Broken Link Checker fornece essa ferramenta, basta acessar o seguinte link: http://www.iwebtool.com/broken_link_checker e em Checker URL você colocar o url de seu blog. Uma dica que ofereço é que se você quizer obter resultados melhores, principalmente que usa o Leia mais ou Continue lendo nas postagens de seu blog, coloque a Url de seu Feed.
Broken Link Checker
O site gera um relatório de links quebrados, veja:
Relatórios de Links Quebrados - Broken Link Checker

Logo Ease - Crie sua Logomarca Online Grátis

Logo Ease
O site Logo Ease possue uma ferramenta de criação de logomarcas para seu blog ou site de uma forma simples, rápida e o mais importante gratuita. Essa ferramenta é muito útil e para quem ainda não possue conhecimento para criar uma logomarca mais porfissioanal esse site pode ser uma ótima opção.
Como já falei aqui no Desenvolvendo Blogs, uma logomarca possue grande importância para um blog ou site no aspecto visual, você pode perceber que elas são uma ótima ferramenta de marketing pois possuem um fator que ajudam as pessoas que conhecem seu blog o reconheçam somente pela logomarca.


Tutorial
Cadastro
Para utilizar do site é preciso fazer um cadastro para que você possa salvar suas logomarcas.
1. Acesse a seguinte página: http://www.logoease.com/registration.aspx
2. Preencha o formulário com suas informações e depois clique no botão "Submit" no fim da página.
Cadastro - Logo Ease
3. Pronto sua conta já foi criada, simples não é.
4. Agora faça login no site, coloque seu nome de usuário e sua senha e clique em "Go"
login

Criando sua logo
1. Acesse a página inicial do site: http://www.logoease.com/
2. Clique em "start you logo"
start you logo
3. Vai abrir uma pop-up é nela que você vai criar sua logo, selecione um tipo de imagem que você deseja.
escolhendo tipo da logomarca
4. Vai aparecer várias imagens relacionadas com o tema escolhido. Clique acima da que você deseja para sua logo.
5. Agora vai abrir um painel de edição, ai você pode colocar frases, nomes, modificar cor do logo, fontes, explore as opções. Após as edições clique em "save".
painel de edição de logomarcas
6. Agora selecione a logo que você deseja, clique no link "download logo".
Download logo
7. Pronto o site vai enviar um link para download de sua logomarca para o seu email.

Criando um Formlário de Contato para o seu Blog - Email Me Form

Email Me Form
O site Email Me Form oferece um serviço de criação de formulários de contatos. Ele possue diversas ferramentas personalizáveis e o uso do site é grátis caso não queira adquirir um plano pago no mesmo, o único defeito dele é que sua linguagem é em inglês, mas isso não influência em nada de seu formulário.
Como já falei em alguns artigos aqui no Desenvolvendo Blogs os formulários de contato possuem grande importância para a interação do visitante e do proprietário do blog, onde você pode criar formulários para responder as dúvidas dos leitores, criar um formulário para quem deseja anunciar em seu blog ou site, entre vários que você pode utilizar.


JotForm - Construtor de Formulários Grátis
Crie um Formulário de Contato Gratuitamente com o FormSite
Crie um Formulário de Contato Rapidamente com o Foxyform
Criar Formulário de Contato - 123ContactForm


Tutorial
Criando uma conta
1. Acesse o site: http://www.emailmeform.com
2. Clique no botão "Signup Now for FREE"
Sign Up - Criar uma conta

3. Vai abrir uma página com um formulário de cadastro, o preecha com seu nome de usuário ( Username ), senha e email ( insira um válido, pois é necessário a confirmação da conta ). Após isso clique em "Sign Up".
Criando uma conta

4. Pronto sua conta foi criada, agora é preciso que você confirme a criação de sua conta em seu email, o site envia um email com um link para que você confirme o cadastro.
confirme a criação da conta em seu email

5. Após confirmar seu email você irá para essa página, clique no link "here"
conta confirmada

6. Pronto você já está logado no painel do Email Me Form, agora você já pode criar seus próprios formulários.

Criando um formulário de contato
1. No painel clique no botão "+ Add Form"
2. Vai abrir uma box e clique no primeiro link.
Criar um formulário

3. Agora você vai começar a editar e configurar o seu formulário, para editar os itens basta clicar no botão "Customize"
Customizar formulário

4. Apartir dai você pode mudar o nome dos itens, adicionar novos itens ao seu formulário, o configurar, explore o site que ele possue diversas utilidades.
5. Após editar e customizar seu formulário, clique em "Save Form"
Salvar formulário

6. Vai abrir outro box, clique no link da opção 4.
Publicar formulário

7. Você será redirecionado para seu painel novamente, só que dessa vez você já possue um formulário, para o publicar, adicionar à alguma página, postagem ou gadget clique no link "Code"
Code

8. Agora em HTML with JavaScript/CSS copie o código e o cole onde desejar. Como eu disse você pode colocar em uma página ou postagem de seu blog, no html delas.
Código do formulário


Lembrando que sempre que você quizer editar ou ver se alguem preecheu o seu formulário basta acessar sua conta no Email Me Form.

Pick a Face - Crie seu Avatar

Pick a Face

O site Pick a Face oferece um ótimo aplicativo de criação de avatares para serem usados em MSN, Facebook, Twitter onde você desejar. Muitas vezes não queremos mostrar nossa foto e para isso um avatar as vezes transmite essa função.

Tutorial
1. Acesse o site: http://pickaface.net
2. Escolha o idioma e depois clique em "create avatar"
3. Escolha o boneco masculino ou femenino.
4. Agora você vai customizar o seu avatar, isso é com você. No menu inferior você pode ir escolhendo diversas características para o seu avatar.
Customizando Avatar

5. Após o customizar, clique no botão "DOWNLOAD". Após isso preecha o formulário com seu nome, nome de usuário ( nickname ) e com seu email. O Pick a Face vai enviar seu avatar para seu email.
Download do Avatar

6. Agora é só você ir a seu email para fazer o download da imagem

Como Ocultar Comentários em Páginas Estáticas no Blogger

Ocutando Comentários em páginas estáticas no Blogger
Olá amigos, neste artigo irei mostar como ocultar os comentários em páginas estáticas do blogger. É muito importante pois muitas vezes colocamos em algumas páginas algum formulário de contato e fica meio disprovido logo abaixo o formulário de comentários, também as vezes criamos páginas com alguns conteúdos que não queremos que ele seja comentado pelos leitores. Por essa e muitas outras causas devemos ocultar o formulário de comentários de algumas páginas.
O tutorial é bem simples e eu ensinarei três maneiras diferentes de como realizar o processo: esconder o formulário de comentários em uma página, em todas as páginas estáticas e em páginas estáticas especificadas.



  • Como Ocultar os comentários no Blogger
  •  
    Tutorial

    Esconder o formulário de comentários em uma página
    1. Acesse o painel de seu Blogger
    2. Clique na guia "Páginas".
    páginas - blogger

    3. Após isso na página que desejar clique em "Editar".
    Editar páginas

    4. Agora ao lado esquerdo clique em "Opções" e depois marque "Não permitir, ocultar existentes".
    não permitir comentários em página estáticas
    Clique na imagem para ampliar
    5. Depois clique em "Concluído" e em "Atualizar" para atualizar a postagem.
    Faça isso em todas as páginas que você queira ocultar o formulário de comentários, caso queira aplicar em todas de uma vez só siga o tutorial abaixo.

    Escondendo o formulário de comentários em todas as páginas
    1. Faça login em seu Blogger
    2. No painel do blogger clique em "Modelo"
    3. Agora clique em "Editar HTML"
    4. Procure pela tag abaixo:
    ]]></b:skin>
    5. Antes do código citado cole o código abaixo:
    <b:if cond='data:blog.pageType == "static_page"'>
    #comments { display: none;}
    </b:if>
    editar html - código de ocultar páginas estáticas

    6. Clique em "Salvar modelo" e pronto todas as suas paginas estáticas estão sem o formulário de contato.

    Esconder o formulário de comentários em páginas especificadas
    1. Acesse o painel de seu Blogger
    2. Clique na guia "Modelo"
    3. Clique em "Editar HTML"
    4. Procure pela tag abaixo:
    ]]></b:skin>
    5. Cole antes da tag citada o código abaixo:
    <b:if cond='data:blog.url == "URL_DA_PÁGINA"'>
    #comments { display: none;}
    </b:if>
    6. Substitua URL_DA_PÁGINA pelo link de sua página.
    OBS.: Não esqueça http://
    OBS.2: Caso queira adicionar outra página copie o código e cole novamente já com a url da outra página.
    7. Clique em "Salvar modelo" e pronto!