Meu Primeiro dia na Irlanda

Numa manhã de quinta-feira às 6:40 o despertador toca, levanto para o meu primeiro dia na Irlanda, tomo café ponho minha roupa às 7:30 desço a Parnell Street sentido O’Connel Street, olho para as pessoas na rua, vejo um casal que se despede e tomam sentidos opostos, talvez vão para o seus respectivos trabalhos. Ando mais alguns metros e cruzo uma moça oriental com um carrinho de bebê toda atabalhoada, dou um sorriso sem resposta, nada fora do normal orientais as vezes são bem fechados.

Chego na O’Connel Street uma das principais ruas, olho para o The Spire aquela estrutura metálica no meio da cidade sempre contrastando com toda aquela arquitetura antiga, numa manhã relativamente quente com seus 14 graus sigo para meu destino. Observo algumas pessoas se arriscando com menos casacos, penso “realmente começou a primavera”. Cruzo o rio Liffey e sempre olho para o prédio da Heineken que sempre me passa uma mensagem ousada e desafiadora estar justamente no meio da terra da Guinness.

Às 7:50 chego ao meu destino o prédio da imigração Irlandesa. Sim! “Hoje é o dia” de tirar meu visto de estudante, a fila já contornava o quarteirão quase com uma volta completa, vou caminhando tentando achar o final da fila e começo a escutar vários idiomas russo, português e espanhol. Olho para toda aquela turma bem compactada tentando fugir do vento frio. Às 8:00 a fila começa a andar, cada vez mais ansioso.

Após 40 minutos pego minha senha de número 171, com um leve sorriso me dou conta que algumas piadas só fazem sentidos em locais específicos nesse caso, para nós brasileiros. O atendente confere meus documentos e pede para voltar às 14:00 da tarde.

number 171

Vou para escola mas foi quase possível estudar, tento me concentrar mas só tenho cabeça para resolver a questão do meu visto. Os minutos vão se arrastando, uma hora minha classmate começa a brincar perguntando se eu não tinha dormido na noite anterior, respondo que vou resolver uma questão que já estava incomodando a algum tempo. Não aguento a aula terminar peço para sair meia hora antes da aula terminar sigo pra casa para almoçar antes de voltar na imigração.

Pego um cartão de débito com meu amigo Caio para pagar o meu visto, já que ainda não tenho conta no banco. Caio também me ajudou a comprovar os 3mil euros um processo meio complicado aqui na Irlanda que tinha falado no post anterior (consegui comprovar o valor depositando na conta do Caio e retirando um Bank Draft). Com o cartão em mãos, sigo para a imigração chegando lá a fila já estava no número 151. Trinta minutos depois minha senha é chamada e um atendente simpático pede os documentos necessários e o pagamento do visto no valor de 300 euros, lembrar que este valor só pode ser pago com cartão de débito irlandês. Tiro minhas digitais e sou avisado que tenho que aguardar o meu GNIB (o Visto de estudante). Às 18h saio do prédio da imigração com minha carteirinha e menos 100 quilos das minhas costas.

Que não acompanhou os posts anteriores, já estou na Irlanda a mais de um mês e durante esse tempo os bancos e governo mudaram as regras para abrir conta em banco, isso acabou prejudicando os estudantes que chegam no país sem nenhum comprovante de residência, foi mais de um mês tentando, entender as novas regras, varias tentativas de abrir uma conta no banco e achar uma alternativa para tirar o GNIB. As regras para estudantes na Irlanda estão ficando cada vez mais restritas, mas essa nova regra tinha relação com os problemas de lavagem de dinheiro. A solução veio por conta própria, a agência Global não ajudou em nada, a escola ATC também bem perdida pouco se mexeu para dar uma solução.

A sensação de quando peguei o GNIB foi que a minha viagem tinha começado naquele momento. Resolvido essa questão poderia apenas me preocupar com os estudos, pegar um emprego part-time, poderia viajar para qualquer lugar e garantir minha estadia por 8 meses. Após sair da imigração, fui encontrar meus classmates em um pub muito legal chamado The Breazen Head, conversando com meus colegas todos tinham a mesma sensação da experiência do antes e depois do GNIB. Assim a noite terminou com muitas gargalhadas, pints e músicas.

pup

Um mês de Dublin

E lá se vão 30 dias após minha chegada em Dublin, tempo passa muito rápido e ao mesmo tempo devagar. Rápido parece que pouca coisa andou por aqui e devagar parece que faz muito tempo que não vejo os meus amigos. Vou pontuar algumas coisas sobre a cidade e a rotina em Dublin. Primeira mês foi bem movimentado: primeira visão sobre a cidade, criando uma rotina, Saint Patrick’s Day, procurando apartamento, tentando abrir conta no banco, inglês e Brasileiros.

Primeira impressões

Dublin é uma ótima cidade com um clima bem louco. Eu achava que São Paulo era louco, mas aqui é bem mais. Aqui é possível fazer sol, chover e nevar ao mesmo dia. A cidade é pequena, comparada a São Paulo. Por exemplo: nos primeiros 15 dias fiz todos os meus compromissos andando. A cidade é plana, assim fica fácil de andar nas primeiras semanas ficava na região norte a 3.5km da minha escola ia andando todos os dias (tive sorte de não chover nesse período). Sobre a culinária, ainda não tive tempo de desfrutar. De volta a vida de estudante, estou fazendo todas as refeições em casa. Mas olhando os preços nos restaurantes, vão de 5 a 20 euros dependendo do lugar, sempre olho os preços e penso com 20 euros posso fazer 6 refeições boas refeições em casa, sem precisar comer porcaria.

Saint Patrick’s Day

É o principal evento, a cidade para fica cheia de turistas e boa parte da população vai ver a Parada que acontece pelas ruas da cidade. As escolas, universidades, polícia, bombeiro e todos os grupos possíveis, desfilam pelas cidades. O desfile vai até o final da tarde e após a parada, todos vão para os pubs beber – foi minha primeira experiência com pubs na Irlanda sai com um grupo de amigos Brasileiros eles decidiram ir na Living Room fica em Dublin 1, muito rock e cerveja.

A parte mais engraçada quando começava uma corrida de cavalo no telão a música parava e todos olhavam aficionados para o telão, dai descobri o primeiro costumo do Irlandês: eles adoram apostar. Depois dessa experiência, sai para andar na região do Temple Bar. Muitos jovens bêbados, o que no começo é engraçado, mas depois fica tudo a mesma coisa e perde a graça quando está sóbrio.

Quando decidi vir para Irlanda meus amigos falaram cara você precisa ir na semana antes do Saint Patrick’s Day e realmente é uma experiência única. Foi legal ver toda a festa, mas existe o outro lado: por ser uma cidade pequena, durante esse período é a pior época para se encontrar apartamento. Mas por que?  Além dos turistas que visitam a cidade, os intercambistas tem 8 meses de visto então ou eles tentam voltar depois do Saint Patrick’s ou chegar antes.

Isso cria uma bolha imobiliária de duas semanas vou falar um pouco na sequência.

Procurando apartamento

Na primeira semana até fiquei um pouco apreensivo em achar um apartamento, todos os anúncios que encontrei tinham um preço acima do que estava pesquisando meses antes, todas as visitas em apartamentos quando chegava no local tinham fila de interessados, as vezes parecia seleção de emprego em multinacional. E não é um problema só para estrangeiros como um vídeo do Foil Arms ang Hog brinca:

Depois muita procura, eu encontrei o apartamento!  Acompanhando os grupos com duas semanas depois as coisas “normalizaram”.

Mas claro tem um lado bom aqui não tem todo aquela questão de fiador ou seguro fiança comparado ao Brasil, você apenas precisa de um depósito de segurança e contrato de um ano ou 6 meses, devido a alta procura é super difícil de encontrar contratos de 6 meses atualmente.

Algumas dicas:

  • Venha dois mês antes do Saint Patrick’s ou um mês depois.
  • Inverno pode ser uma época mais fácil para achar apê, mas pode ser uma época mais difícil para adaptação se você não está acostumado com frio.
  • Pesquise nos grupos de “Classificados Dublin Imóveis” e “The Ideal Flatmate Dublin” no Facebook ou Daft.ie.
  • Tenha paciência porque essa será uma decisão que terá um grande impacto em sua viagem.

Abrindo conta no banco

Nossa pra mim está sendo o maior problema até agora, como funciona isso: 

  1. Você chega na Irlanda para estudar
  2. Para tirar o visto você precisa comprovar que tem os $3.000 euros
  3. Cada escola tem parceria com um banco para abri conta para estudantes, ela faz uma carta comprovando seu endereço
  4. Você leva a carta no banco e abre a conta
  5. Com a conta e os três mil euros você tira o visto e garante a permanência por 8 meses e consegue trabalhar 20h semanais.

Mas o banco que tem parceria o AIB com a escola ATC passou a não aceita a carta da escola, ou seja, você não consegue fazer nada. Estou a um mês esperando uma solução da escola + banco. Se uma conta no banco além de não tirar o visto e só ter permissão de passar 3 meses aqui, não posso ter um celular de conta, contratar internet para meu apartamento, muitos estabelecimentos só aceitam pagamento em débito em conta. O governo tentando resolver o problema mudou as regras a duas semanas atrás, mas a burocracia é tenta que escola e banco não chegaram a uma solução, não vejo o esforço da escola em resolver e o banco quer ditar suas regras. Tenho vários eventos marcados e amigos para visitar a instrução da imigração é que eu aguarde a resolução desse problema antes de sair do país. Sei que pessoas estão viajando sem visto mas não quero correr esse risco.  Agora é paciência e aguardar, o vídeo abaixo fala um pouco sobre o problema dos AIB especificamente.

Inglês e Português

Estou a um mês aqui juntando as horas que falei português é quase a mesma que falei inglês. Ainda não tive uma imersão no idioma na região central e nas escolas os brasileiros dominam. Inicialmente tentei alugar apartamentos com gringos, mas o problema da semana do Saint Patrick’s poderia escolher muito e a localização do apartamento foi decisivo na escolha estou a 10 min da escola.

Falando em escola a ATC, prometia um mix de nacionalidade um dos fatores que decidir estudar na escola, chegando lá apenas 90% da sala são brasileiros e todos foram em busca do mesmo diferencial. Um problema bem grave que você precisa decidir 8 meses da sua vida sem conhecer a escola. Quando chega na escola você tem duas opções: ou aceitar, ou pagar mais mil euros para solucionar o problema mudando de turno. O problema que com esse valor eu entraria numa escola melhor que escolhi, ou economizaria mais optado por uma mais barata que apresentava as mesmas atividades extras. Infelizmente se a escola promete um mix de nacionalidade não acredite, primeiro a escola não pode barrar um estudante por nacionalidade, se entrarem 8 estudantes brasileiros no mesmo nível na mesma época a escola tem que aceitar.

Outro ponto importante escola bem sua agência de viagens; muitas tentam resolver o problema se você não está satisfeito com a escola ou algo do tipo, a exemplo da minha, só tenho respostas prontas que a mais de um mês não ajudaram em nada. Boa parte das coisas estou resolvendo sozinho, então, o papel da agência(Global Study) nesse momento é zero. Por isso, procure saber mais sobre sua escola e até se ela tem escritório na cidade, pois isso também pode ajudar.

Mas esse problema do idioma estou resolvendo participando dos meetups e eventos, sempre o inglês é predominante e nos meetups de DEV você irá escutar todos os sotaques. Se você é da área de front-end alguns grupos legais que participo:

Meetup do AWS User Group de Dublin
Meetup AWS User Group
Meetup do Node.js User Group em Dublin
Node.JS Dublin User Group

Why Dublin?

No ano passado decidi dar um tempo em São Paulo, queríamos um lugar para incrementar o inglês e ter uma experiência diferente. Pesquisei bastante com minha esposa vimos vários “vlogs” sobre pessoas que moram em outros países, Canadá, EUA, Austrália e Dublin.

Canadá possuía os pontos positivos em qualidade do ensino, facilidade de uma possível cidadania, falaram muito bem do povo canadense, possuem ótimas cidades para morar. Os contras eram o clima sempre frio, as dificuldades de trabalhar durante os estudos (você pode trabalhar 20 horas em categorias específicas), tempo para tirar o visto de estudante, valor que você precisa levar para garantir sua estadia. Em Dublin por exemplo, você precisa de de 3.000 euros para tirar o visto de estudante por 8 meses, no Canadá o mesmo período preciso comprovar 6.700 dólares canadense, na época que pesquisamos o dólar canadense operava acima de 3 reais. Então hoje isso seria Canadá: (6.700 * 2.8 = R$ 18.760) e Dublin(3.000 * 4.07 = R$ 12.210).

EUA ficou em terceiro, mas a sairia muito caro passar 8 meses sem trabalhar. O custo de vida seria mais alto que nas duas primeiras opções e existem muitas barreiras para se conseguir um trabalho lá. Não é impossível conseguir algo legalmente, mas exigiria um esforço maior.

Austrália tem ótimo clima, facilidade de arrumar trabalho, todos amigos que foram pra lá tem seu emprego e estão super felizes. O contra é a super distância entre o Brasil.

Então depois de alguns meses recolhendo informações e fazendo conta com o nosso orçamento a cidade escolhida foi Dublin, nunca vou esquecer a pergunta que meu antigo gestor do elo7 fez você vai passar 8 meses num lugar que nunca foi, depois de muita pesquisa estava seguro com a decisão mesmo nunca indo na cidade antes.

Why Dublin?

IMG_20160315_173446193

Pontos negativos

Primeiro vamos começar inicialmente pelos contras, clima: chove praticamente metade do ano (um sinal disso foi minha professora comemorando que fazem 11 dias que não chove. Isso mesmo, 11 dias). Inverno fica entre -3º e 3º e no verão fica na casa dos 15º-19º. Claro que inverno possuem dias que ficam abaixo dos -3º e verão tendo dias que ficam acima dos 19º, por exemplo, agora é começo da primavera na Irlanda a temperatura fica entre 6º e 11º(já estou me acostumando).

Além do clima, as pessoas reclamavam muito sobre a qualidade do ensino, pois antes de 2014 estudar inglês na Irlanda era uma máquina de visto: cada esquina tinha uma escola e com o visto de estudante, na época, você poderia trabalhar 40 horas por semana, uma jornada de trabalho normal. Muitos alunos se matriculavam para ter apenas o visto. Para as escolas mal intencionadas, isso era ótimo, pois ganhavam pra não dar aula para mais da metade dos alunos.

O governo “caiu em cima” mudou a regra para o visto de estudante, agora só é possível trabalhar 20 horas por semana a fiscalização está mais intensa sobre o desempenho dos alunos. Na parte das escolas muitas foram fechadas, foram criadas regras para as escolas melhorarem a qualidade do ensino e dado um prazo para elas se adequarem, várias que não atingiram um padrão de qualidade aceitável e foram fechadas isso deu dor de cabeça em muita gente que estava estudando aqui no dia seguinte você descobre que sua escola foi fechada, conheço gente que passou por isso, mas o governo realocou essa galera.

Outro tema bastante comentado é a presença de brasileiros na cidade e a resposta é SIM, tem muito brasileiro andando pelo centro da cidade e é quase impossível andar uma quadra sem escutar alguém falando português. A sua grande maioria se concentra próximo as escolas, na região central da cidade, aumentando ainda mais a sensação da cidade ser tomadas por brasileiros. Nas regiões periféricas já é diferente a situação.

Em 2015 a Irlanda recebeu 96 mil estudantes sendo 16% deles brasileiros. É o país número um em vistos de estudantes na Irlanda, ou seja, mais de 15 mil brasileiros desembarcam por ano na Irlanda. Mas Fellyph porque reclamar disso? Você vem estudar inglês, você precisa ter uma vivência no idioma!

Por último, o sotaque irlandês os primeiros dias você cruza com algumas pessoas que tem que forçar a entender o que elas falam, mas é igual a qualquer lugar do mundo, por exemplo, no Brasil tem gente que você pergunta se ela realmente fala português. Mas uma coisa que notei na minha escola foi que os professores tem sotaque quase zero. Conversando com outros colegas, eles também não sofrem, acho que eles treinam para tirar vícios locais. O verdadeiro problema é na rua, mas não é uma regra geral, pois 80% eu entendo bem. O vídeo abaixo é de um grupo local que brinca com o sotaque da região:

 

Pontos Positivos

Vamos falar do lado bom da coisa, primeiro você está na Europa: o velho mundo é fantástico, a riqueza da cultura foi um fator de desempate com outras cidades, além da segurança e arquitetura local. E o melhor de tudo que viajar dentro da Europa é muito fácil, pois existem várias companhias de baixo custo. Na primeira semana comprei uma passagem para Londres (vou para o WordCamp London) por menos de 40 euros. Promoções como essa são fáceis de achar.

IMG_20160316_183148820_HDR

Segundo, o custo foi quase 40% menor que se fosse para o canadá, por exemplo. Terceiro a facilidade do visto: ele é feito depois que você chega na Irlanda e você só precisa de uma carta da escola, seguro saúde do período que você vai ficar, 3.000 euros – esse dinheiro você irá gastar para sobreviver aqui, ele é seu, o governo só precisa saber se você não veio na louca – (o ideal é trazer mais que esse valor), uma comprovação da sua passagem de volta. Quarto ponto positivo é o sistema de transporte público que é muito bom, mas dependendo da região que você more da pra fazer tudo andando. Se comparado a São Paulo, a cidade é bem pequena, possui 500 mil habitantes.

IMG_20160315_163145796_HDR

E por último, um fator bem particular pra mim é que em Dublin existe o Silicon Docks uma região que abriga várias empresas de tecnologia como Amazon, Google, Facebook, Linkedin, AirBnb, Etsy, Gilt, Zynga entre outras empresas. Isso cria um ecossistema bem dinâmico pra que é da área. Só em ter a possibilidade de estar em contato com essas empresas, participando de eventos com várias experiências de empresas desse porte, é algo bem válido. Abaixo uma imagem de algumas empresas e institutos de tecnologia que estão em Dublin.

DublinHub1-11

Esses foram os principais motivos que me levaram a escolher Dublin. São pontos bem pessoais. Isso não é uma regra que não se aplica a todo mundo. Já se passaram duas semanas aqui estou curtindo bastante a cidade, até agora valeu a pena toda pesquisa pré se encaixou perfeitamente no que estou vivendo.

 

Otimização de imagens para SEO

Quando estava preparando a palestra para o WordCamp BH, na minha palestra do “Marketplace ao WordPress” um dos pontos da palestra foi a otimização de imagens para SEO. Dei uma lida em alguns posts do Yoast, um deles foi um post sobre otimizar imagens em seu site, que até usei como referência da minha palestra.

Uma ótima opção para ajudar no entendimento do nosso conteúdo, descrever um determinado produto ou explicar um fluxo de uma operação. Temos um ditado “Uma imagem vale mais que mil palavras”. Não poderia ser diferente para que gera conteúdo web e nos itens a seguir vou listar alguns cuidados especiais para melhorar o SEO do seu conteúdo utilizando imagens, está lista é uma adaptação do post: http://yoast.com/image-seo/

Achando a imagem correta

Se você tem a oportunidade de adicionar uma imagem, por favor faça. Suas páginas precisam de imagens, inicialmente seu post precisa de imagens que remetam ao artigo. Se você usa imagem somente para otimizar as métricas de plugin de SEO, você está fazendo errado “meu parça”, a imagem deve refletir o tópico do post.

Existe uma simples razão para isso: uma imagem que é cercada por conteúdo relacionado “rankeia” melhor seu conteúdo. Adicionamos imagens ao nosso conteúdo pelas seguintes razões:

  • Elas enfatizam o título ou o assunto do post
  • Ela vai atrair um visitante para ler o post, sem ele ver o texto
  • As imagens serão usadas por redes sociais como: Facebook e Twitter

Se você não tem como usar fotos do seu próprio conteúdo, existem várias fontes de conteúdo com licença Creative Commons, por exemplo, Flicker outra ferramenta que podemos utilizar é freeimages.com. Mas tome cuidado fique longe das chamadas obvious stock photos, produzir suas próprias imagens tornam o conteúdo mais original.

Outro tipo de imagem que é bem popular hoje são os gifs, podemos utilizar a sequencia de imagens para demonstrar um passo-a-passo, ou uma cena curta. Um portal bastante conhecido começou a utilizar gif’s nas chamadas das matérias um momento chave de um acidente ou fato inusitado, estamos falando do globo.com, alguns gifs entraram até na home do canal de esportes.

Preparando a imagem para uso no seu artigo

Quando você imagem correta o próximo passo será otimizar a imagem para isso temos que levar em conta as seguintes considerações:

Escolha o nome correto para imagem

O inicio para otimizar uma imagem para SEO é dar o nome correto para o arquivo, uma forma de ganhar tráfego organico é  adicionando ao nome do arquivo o que a foto remete, nada de subir imagens no post com o nome DSC938293829.jpg, o formato ideal seria  museu-louvre-paris.jpg.

Escale sua imagem

Será que você realmente precisa realizar o upload de imagens com 2500×1800 pixels por exemplo? Na maioria dos casos a resposta é NÃO. Tempo de carregamento é um fator importante para a experiência do usuário e SEO, quanto mais rápido o site carrega mais fácil torna-se a visita do usuário, Outro fator importante são os usuários mobile, eles não possuem uma experiência totalmente imersiva em relação aos usuários desktop, segundo no carregamento da página são cruciais para você não perde-lo. E o uso de imagens corretas ajudam no tempo de carregamento, muitas vezes em alguns sites e blogs as imagens são os principais gargalos da velocidade de carregamento do site.

Otimize o tamanho do arquivo

Além de utilizar a escala a imagem no tamanho correto, podemos reduzir ainda mais os kb’s de nossas imagens sem ficar longe do resultado original. Primeiro passo é reduzir EXIF data de nossas imagens, também podemos utilizar ferramentas como ImageOptim ou sites como JPEGmini ou PunyPNG.

Podemos analizar o desempenho de nossas imagens com ferramentas como YSlow e PageSpeed Test.

Adicionando a imagem ao nosso artigo

Depois das etapas de otimização da imagem, vamos adicionar nossa imagem ao conteúdo. Primeiramente o conteúdo deve estar situado em um parágrafo que remete a imagem, a imagem deve fazer parte do contexto.

Legendas

As legendas das imagens devem ser um conteúdo que complementa a imagem, Porque isso é importante para o SEO da imagem? Pessoas usam um texto para “scannear” o artigo, depois dos cabeçalhos elas olham para as legendas das imagens como um scanner. Nilsen em 1997 escreveu em sua pesquisa fala sobre os elementos que melhoram a leitura do texto, cabeçalhos, fonts largas, texto em negrito, texto destacados, listas, gráficos e legendas. Em 2012 uma pesquisa publicada pela KissMetric, fala que legendas das imagens são lidas 300% a mais que o corpo dos textos, por isso não usa-las ou fazer o mau uso delas, significa jogar fora uma grande oportunidade de engajar os leitores.

Propriedades Alt e title

O texto alt é adicionado para criar uma um texto alternativo descritivo da imagem, quando por alguma razão o conteúdo não pode ser exibido para usuário como também por questões de acessibilidade, tenha certeza que os possua alguma keyword de SEO em seu conteúdo e relação ao conteúdo do post.

Quando você estaciona o mouse sobre a imagem O IE mostra o conteúdo do alt já o chrome exibe o conteúdo do title. “O atributo title é muito importante mas não é um modo seguro de exibir alguma informação crucial. Em vez disso, ele oferece um modo de fornecer informações não essenciais, por exemplo, o humor da imagem, ou que isso significa no contexto.” É bom ter a informação mas isso não é levado em conta para SEO da imagem.

OpenGraph

Use a imagem correta no HEAD do seu HTML com a meta tags do facebook “og:image”, isto irá garantir que estará usando a imagem correta nas interações com o facebook o openGraph também é usado para o Pinterest. O plugin do Yoast possui uma seção de social onde você pode definir que imagem será usada. A qualidade da imagem será importante, quanto maior a qualidade mais fácil será para estas ferramentas trabalharem com sua imagem, para verificar como o Facebook está lendo seu site pode utilizar o Facebook Debugger. O Plugin do Yoast também dá suporte aos cards do Twitter.

sitemap.xml de imagens

Se você é um desenvolvedor web, você pode se perguntar sobre sitemaps para imagens, o Google é bastante claro sobre isso:

“Para dar ao Google informações sobre as imagens em seu site você vai precisar adicionar tags específicas de imagem a um sitemap. Você pode listar separadamente as imagens, ou você pode adicionar a um sitemap já existente. Use o método que funciona melhor para você.”

O plugin do Yoast não gera um sitemap para imagens, mas em seus posts eles adicionam no sitemap do post a lista de imagens presentes, adicionar imagens ao sitemap ajudo o google indexar suas imagens facilmente.

Resumo

SEO para imagens é uma soma de uma série de elementos, o Google cada dia está reconhecendo melhor estes elementos nas imagens, faz sentido garantir que imagem e todos os elementos apresentados contribuem na experiência do usuário, então tome nota disso para entregar uma experiência melhor e não apenas tentar rankear melhor no Google.

Tome nota dos seguintes pontos

  • Use imagens relevantes ao texto
  • Aplique o nome correto a imagem
  • Tenha certeza que está utilizado as dimensões corretas das imagens
  • Otimize suas imagens
  • Adicione legenda a suas imagens
  • Use alt, o title é opcional
  • Adicione OpenGraph e Twitter Card
  • Use imagens no seu XML sitemap

WordPress 3.9

Saiu no dia 16 de Abril a versão 3.9 do WordPress, intitulada SMITH o foco nessa versão foram as melhorias na parte de edição e controle de mídia.

Na parte de edição de conteúdo foram três mudanças significativas o editor visual o foco foi em performance, acessibilidade e o suporte ao mobile também teve um cuidado especial nessa versão. Edição de imagens agora o acesso a transformer, crop e ferramentas de rotação foram facilitados. Também é possível usar o recurso de drag and drop na tela de edição e não apenas na tela de upload de imagens.

Além das melhorias na parte de edição também foram implementadas as seguintes

  • Preview de galerias recebeu melhorias na parte de design.
  • Player de Audio e vídeo agora possuem uma playlist nativa.
  • Agora na tela de edição do com preview do WordPress é possível personalizar a sessão de widgets.
  • A ferramenta de edição de header também passou por melhorias na parte de upload, crop e administração de headers.
  • A sessão de controle de temas passou por melhorias para tornar a experiência do usuário mais agradável.

Quer conferir a nova versão só acessar o link 

theme1

gallery1

Padrões de código JavaScript no WordPress

Em busca da produtividade e legibilidade do código presente nos temas a equipe do Core do WordPress escreveu uma seção para falar sobre padrões de codificação para plataforma. Esse é o segundo post da sobre o assunto no post anterior falei sobre padronização de código CSS, Nesse post vamos abordar padrões de escrita para JavaScript.

JavaScript tornou-se uma das principais linguagens da atualidade e é um item chave no desenvolvimento de temas e plugins no WordPress. Claro que padronizar seu código JavaScript é essencial para manter consistência no projeto. Todo código base deve parecer escrito por uma única pessoa.

O “WordPress JavaScript Coding Standards” foi uma adaptação do “jQuery JavaScript Style Guide”, o padrão do WordPress difere do jQuery nos seguintes pontos:

  • WordPress usa aspa simples para declaração de string.
  • Instruções de Case são indentadas para indicar as mudanças de blocos.
  • Conteúdo de funções são constantemente indentadas, incluindo os empacotadores de fechamento de todo o arquivo.
  • Algumas regras para espaço em branco são diferentes, para manter consistência com o “WordPress PHP coding standards”.
  • 100 caracteres são o limite para uma linha de código jQuery, mas no WordPress não são rigorosamente aplicadas.

Espaçamento

Uso de espaços livremente em todo seu código. “Em caso de dúvida, tire o espaço.”

Estas regras incentivam o uso de espaço para melhorar a legibilidade do código. O processo de minificação cria arquivos otimizados para os browsers lerem e processarem os arquivos, mas não para os programadores. O ideal é utilizar uma versão minificada para produção e uma versão sem minificação para desenvolvimento.

Além deste quesito temos as seguintes recomendações para espaçamento:

  • Crie indentação com tab.
  • Retire os espaços em branco no final da linha e em linhas em branco.
  • As linhas não devem ser longas, não exceder o limite já especificado de 100 caracteres(contando tabs e espaço). Esta é uma regra “soft”, mas linhas longas geralmente apontam código desorganizado.
  •  if / else / for while / try, os blocos devem sempre utilizar chaves e quebras de linhas, evite utilizar condicionais em uma única linha com chaves.
  • Os operadores de “unários”, exemplo, ++ ou — não devem ter espaço entre seu operando, exemplo “contador++”.
  • Qualquer “,” ou “;” não deve preceder de espaço
  • Qualquer “;” utilizado como sinalizador de um final de uma operação deve estar sempre  ao final da linha, ou seja evite “contador++; a = contador;” na mesma linha.
  • Qualquer “:” depois de um nome de uma propriedade em uma definição de um objeto, não deve ser precedido de espaço, exemplo “valor: 9”.
  • A “?” e “:” de uma condicional ternária deve ter espaço em ambos os lados
  • Não utilize espaço em declarações de tipos vazios, exemplo, {} [] ou fn().
  • Toda “!” utilizada como operador de negação deve conter um espaço em seguida.*
  • Indente todo conteúdo de uma função, mesmo que todo o arquivo esteja contido dentro da função.*
  • Espaços podem podem alinhar comentários ou espaços dentro de uma linha de código, mas somente o TAB pode alinhar o início de uma linha de código.*

Os itens marcados com um “*” ao final da linha fazem parte do WordPress JavaScript standards, sendo um complemento ao padrão do jQuery. Essas aplicações são recomendadas para manter coerência com os padrões de escrita do PHP.

Os espaços em branco são facilmente acumulados no final de cada linha, evite isso utilizando JSHint,  Outra maneira de evitar esses espaços é definindo cores para os espaços no estilo do seu editor.

Objetos

Declarações de objetos podem ser feitas em uma única linha, mas isso não é aconselhável lembrem das recomendações do tamanho da linha. O recomendado é deixar uma propriedade por linha. Nome de propriedades precisam somente de aspas quando possuem uma palavra reservada ou caracteres especiais:

Arrays e Chamadas de Funções

Sempre adicione espaços extras em torno dos elementos e argumentos:

Exceções

Para manter a consistência com o padrão PHP, não inclua um espaço em torno strings ou inteiros usados como keys de uma array:

Função com callback, objetos ou array como um argumento único, sem espaço em ambos os lados do argumento:

Função com callback, objeto ou array no primeiro argumento passamos sem espaço o segundo argumento seguimos o padrão:

Essa regra se aplica caso a função/array/objeto for o último argumento, ela segue sem espaços e os primeiros itens seguem o padrão.

Um bom exemplo de uso de espaçamento:

Indentação e quebra de linhas

Indentação e quebra de linhas adicionam legibilidade para declarações complexas. Tabs devem ser usados sempre para indentação do conteúdo que estiver dentro das chaves, também usamos um tab para sinalizar o nível do conteúdo.

Blocos

IF, ELSE, FOR, WHILE e TRY devem sempre utilizar chaves e estar organizado em multi-lines. A abertura da chave deve estar na mesma linha da definição da função/condicional/loop. A chave de fechamento deve estar na linha seguinte da última declaração do bloco.

Exemplo:

Operações Multi-line

Quando uma operação é muito longa para uma única linha, utilizamos uma quebra de linha e tal deve ocorrer após um operador.

Métodos encadeados

Quando é utilizado um método encadeado ele pode criar uma linha muito longa, o remendado é ter uma chamada por linha, se o método muda o contexto ele deve ser aplicado um nível extra de indentação.

Atribuições e variáveis Globais

Declarando variáveis com var

Cada variável deve começar com a declaração “var” e as variáveis separadas por virgula. Na quebra de linha utilize indentação como no exemplo a seguir:

Variáveis Globais

No passado do WordPress o seu core fazia uso pesado de variáveis globais. Algumas variáveis globais ficam disponíveis por necessidade de integração com os plugins e não devem ser removidas. Outra recomendação é que todas as variáveis globais devem ser documentadas.

Bibliotecas Comuns

Backbone, jQuery, Underscore, e o “wp global” são todos registrados como itens “globais permitidos” no root do arquivo .jshintrc.

Backbone e Underscore podem ser acessados diretamente a qualquer hora. jQuery deve ser acessado $ passando por jQuery como um objeto de uma função anônima:

Isso irá evitar a chamada do “.noConflict()”, ou definir que o $ seja usado com outra variável. Os arquivos que adicionam ou modificam, o “wp object” acessa com mais segurança os itens globais isso evita a substituição previa do set de propriedades:

Convenções de nomenclaturas

  • Variáveis e nomes de funções devem ser palavras completas, utilizando camel case com a primeira palavra em caixa baixa. Esta é uma área que difere dos padrões do PHP para WordPress.
  • Construtores que utilizam “new” devem ter a primeira letra maiúscula.
  • Os nomes das variáveis e construtores devem ser descritivos, mas não excessivamente.
  • Exceções são permitidas para “interators”, tais como o uso de “i” para indicar o indice de um loop.

Comentários

Comentários vem antes do código a qual se refere e deve sempre ser precedido de uma linha em branco. A primeira letra do comentário deve ser maiúscula e inclua frases completas que descrevam a operação, não tenha preguiça de incluir comentários, eles são importantes para manter a fluidez do desenvolvimento. Após “//” inclua um espaço.

Igualdade

As verificações de igualdades estritas(===) deve ser utilizada no lugar da verificação de igualdade abstrata(==). Use somente (==) quando realmente deseja saber se o valor é null ou undefined.

Checando tipos

Para checagem de tipos utilize esse padrão:

  • String: typeof object === ‘string’
  • Number: typeof object === ‘number’
  • Boolean: typeof object === ‘boolean’
  • Object: typeof object === ‘object’ or _.isObject( object )
  • Plain Object: jQuery.isPlainObject( object )
  • Funções: _.isFunction( object) or jQuery.isFunction( object )
  • Array: _.isArray( object ) or jQuery.isArray( object )
  • Element: object.nodeType or _.isElement( object )
  • null: object === null
  • null or undefined: object == null
  • undefined:
    • Variáveis globais: typeof variable === ‘undefined’
    • Variáveis locais: variable === undefined
    • Propriedades: object.prop === undefined
    • Qualquer um dos anteriores: _.isUndefined( object )

Strings

Use aspas simples para string literais:

Switch

O uso de switch é geralmente desencorajado, mas pode ser útil para comparação de um grande números de casos, especialmente quando realizamos uma série de tratamentos e queremos incluir um tratamento para exceções com “default”.

Como usar o switch:

  • Use um “break” para cada “case” com exceção do “default”.
  • Indente o conteúdo dentro do case com um tab

Não é recomendado utilizar o return dentro do case, defina os valores de saída e utilize o return após o switch, podemos ver uma aplicação no código abaixo:

Boas Práticas

Arrays

Crie arrays com [] no lugar de new Array().

Objetos

Existem várias formas para criar um objeto com JavaScript. Notação do objeto literal, “{}”, é considerado o mais performático e de fácil leitura.

A notação literal de um objeto deve ser usado a menos que o objeto trabalhe com prototype, neste caso utilizamos o “new”

As propriedades do objeto devem ser acessados via “.” a menos que a chave da propriedade use o nome de uma palavra reservada, uma string não válida ou venha através de uma variável.

Condicionais “Yoda”

Para manter consistência com os padrões de código do PHP sempre compare com a variável no lado direito e a constante no lado esquerdo, essa regra vale para strings, booleanos, inteiros…

Interações

Quando queremos varrer uma coleção utilizamos o “for”, é recomendado armazenar o valor máximo em uma variável em vez de recalcular o valor máximo em casa interação.

Na documentação temos duas recomendações para underscore, jQuery e uma recomendação para o uso de JSHint. Esse itens eu prefiro tratá-los e um post separado a tradução desse artigo me ajudou bastante muitas recomendações desconhecia. Algumas recomendações tratam da parte visual do seu código um código organizado para mim é igual a uma boa caligrafia. Isso ajuda na legibilidade e claro uma padronização deixa o time bem entrosado.

O artigo original você confere aqui:

http://make.wordpress.org/core/handbook/coding-standards/javascript/

Os Padrões JavaScript coding do WordPress são baseados nos padrões do jQuery você pode conferir aqui:

http://contribute.jquery.org/style-guide/js/

Realizando consultas na base de dados do Parse

Essa semana eu iniciei uma série de posts sobre o Parse, serviço de cloud do Facebook. Neste segundo post vou abordar como realizar consultas em nossa base. Caso não conheça o Parse veja o post de introdução: http://www.fellyph.com.br/blog/tutoriais/parse/.

No post anterior abordamos um pouco sobre consultas, primeiro resgatamos todos os valores de uma base com a função “find”, em seguida resgatamos um único item com a função “get”. Criei um cadastro de carros com as propriedades: modelo, ano e valor para cadastrar os dados utilizei os mesmo padrão do post anterior:

INDEX.HTML

APP.JS

Cadastrei algumas informações na minha base para realizar a consulta:

Captura de Tela 2014-01-16 às 19.53.32

Agora vamos dar uma olhada em algumas funções que podemos trabalhar com a classe Query. A primeira delas será a função equalTo:

equalTo

Na função equealTo passamos dois parâmetros, o primeiro o nome da propriedade e a segunda o valor que você deseja comparar, detalhe sobre a função que sua consulta é case sensitive.

notEqualTo

A função notEqualTo é o inverso da função equalsTo ela retorna todos os valores diferentes do valor repassado. Também é possível realizar queries compostas:

O função oposta seria lessThan ela retorna apenas os valores menores:

limit

Por padrão as consultas tem um limite 100 resultados por query, podemos modificar esse resultado de 1 até 1000. Para aplicar esse limite utilizamos a seguinte função:

first

Em nossa query podemos resgatar apenas o primeiro resultado isso é possível com a função first:

skip

Podemos definir o limite de resultados e também podemos definir o índice inicial do resultado com a função skip, com essas duas funções podemos criar um esquema de paginação.

ascending & descending

Além de criar filtros, busca por valores, limitar a busca… criar paginação… Pensa que acabou? Não ainda podemos ordenar nossa consulta(por ascendente ou descendente):

O resultado será o seguinte:

Captura de Tela 2014-01-17 às 18.08.08

Outra opção com listagem de valores maiores para menores:

containedIn & notContainedIn

Caso queiramos realizar a consulta com mais de um modelo de carro, por exemplo, podemos utilizar a função containedIn ela espera um Array como parâmetro:

O inverso da função containedIn seguindo o padrão é a função notContainedIn, ela retorna o resultado das palavras diferente das que constam no Array:

exists & doesNotExist

O Parse permite criar objetos com propriedades vazias ou modificar os objetos depois de criados adicionando novos atributos, assim os objetos antigos ficam sem a informação gravada, para isso podemos utilizar a função exists para verificar se o objeto possui informação gravada na propriedade requisitada.

Vamos a um exemplo:

No código acima verificamos os itens que tem a propriedade year cadastrada, o inverso seria:

matchesKeyInQuery & doesNotMatchKeyInQuery

A matchKeyInQuery serve para comparar dois objetos de classes diferentes que possuem duas propriedades iguais, por exemplo:

No código acima temos duas class Team e Users esta classe deriva do Parse Porque é uma classe especial, vamos falar dela em um próximo post. Mas voltando a query, comparamos duas propriedades “hometown” e “city” presentes na classe User e Team quando eles forem idênticos apareceram em nossa consulta.

select

Caso queira consultar propriedades específicas com a função select passamos as keys das propriedades que queremos:

Captura de Tela 2014-01-17 às 20.01.44

No caso da imagem acima utilizei a mesma função de exibir os resultados, por conta de utilizar o select a coluna valor veio “undefined” porque eu só escolhi duas propriedades “model” e “year”.

startsWith

Na função equalsTo ele retorna valores estritamente idênticos, com a função podemos resgatar valores que iniciam com a String repassada, ela tem um funcionamento parecido com o operador LIKE do MySQL. Esta consulta também é case sensitive.

Captura de Tela 2014-01-17 às 20.29.05

count

A função count conta “Dan”, isso mesmo ela serve para contar o número de itens do resultado ela funciona da seguinte forma:

No exemplo anterior eu realizei um filtro sobre a query e a função count tem o tratamento similar a função find, falando nela podemos aplicar as duas em conjunto sem problemas. Temos outras queries aplicadas em objetos relacionais mas isso vamos abordar em um futuro. Até o próximo post Pessoal.