thiago lovizzaro

meu blog profissional ;-)

[lovizzaro-blog]

Automação de Marketing

Veja aqui algumas das principais ferramentas de automação de Marketing do mercado:

Salesforce

Personalize experiências por e-mail, dispositivos móveis, redes sociais, publicidade e Web.

https://www.salesforce.com/br/products/marketing-cloud/overview/

Oracle Marketing Cloud

Com o Marketing Cloud que Profissionais de Marketing adoram e TI Confia.

https://www.oracle.com/pt/marketingcloud/index.html

Adobe Campaign

É um conjunto de soluções que ajudam a personalizar e disponibilizar campanhas em todos os canais online e offline.

http://www.adobe.com/br/marketing-cloud/campaign.html

Campaign Monitor

Na Campaign Monitor, oferecemos pesquisas de marketing, automação e pesquisas on-line simples e poderosas que ajudam empresas em crescimento. Nós fornecemos tecnologia que resolve problemas complexos de uma maneira maravilhosa e sem complicações.

https://www.campaignmonitor.com/

RD Station

O RD Station apresenta todos os recursos necessários para a implementação de uma sólida estratégia de Marketing Digital.

http://www.rdstation.com/funcionalidades/

Marketo

Encontre e envolva os clientes certos. Ajude-os a aprender o que eles querem saber sobre seus produtos à medida que começam sua jornada. Saiba mais sobre marketing de pesquisa, páginas de destino, personalização da web, formulários, mídia social e acompanhamento de comportamento.

https://www.marketo.com/software/marketing-automation/

Act-On

O centro de comando de marketing da Act-On fornece as ferramentas necessárias para obter as mensagens certas, para as pessoas certas, no momento certo. Crie relacionamentos significativos com o seu público e mire o sucesso do seu marketing com facilidade.

https://www.act-on.com/

Nexus Edge

Nós ajudamos marcas inovadoras com a primeira tecnologia proprietária feita exclusivamente para o setor publicitário alimentado por inteligência artificial.

http://nexusedge.com.br/

Hootsuite

Poupe tempo gerenciando todos os esforços de marketing em mídias sociais em um único painel. Com a plataforma Hootsuite, você tem as ferramentas para gerenciar todos os perfis de mídias sociais e encontrar e agendar automaticamente conteúdos de mídias sociais eficazes.

https://hootsuite.com/pt/

Zendesk's Outbound

Outbound ajuda a criar, automatizar e otimizar mensagens através da web, SMS, e-mail e campanhas push para mobile.

https://www.outbound.io/

Engagio

Automatize a liderança confiável para a correspondência de contas e configure seu time para o sucesso da ABM com os dados e a estrutura corretos em um mundo baseado em contas.

https://www.engagio.com/solutions/marketing-operations/

[lovizzaro-blog]

5 tendências para a revolução do Marketing Cloud

Marketing cloud e big data são assuntos que demandam muita análise por parte dos profissionais de marketing. Para alguns, isso pode significar sair da zona de conforto.

O estereótipo desse tipo de profissional é de que eles escolheram o marketing porque não são bons em matemática ou em assuntos científicos. Isso pode ser um mito. A maioria dos ‘marketeiros’ escolhe a carreira porque gosta da energia, da dinâmica do trabalho e essas pessoas costumam ter habilidades criativas, de planejamento e de gerenciamento de projetos. Mas, cada vez mais, aqueles que fazem parte desse novo mundo do marketing moderno gostam de matemática, ciências e têm perfil analítico.

A explosão da big data em todos os segmentos do mercado acabou gerando a necessidade de um marketing mais analítico, focado e que tem o consumidor no centro da estratégia.

Veja quais são as cinco tendências que estão direcionando a revolução do marketing cloud:

1 – Computação em nuvem: um utilitário

Sendo um utilitário muito barato como a eletricidade, a computação em nuvem está possibilitando uma nova geração de usos, aplicações e aparelhos. Isto é perfeito para o marketing, pois permite interações rápidas, experimentação e mensuração de resultados. Também permite a contratação de serviços com o pagamento atrelado à performance, o que é perfeito para o budget de marketing.

2 – É tudo sobre mobile

Os dispositivos móveis estão cada vez mais baratos e com mais alto desempenho e penetração. Agora, até as tarefas mais simples como pedir comida ou chamar um táxi são feitas via aplicativos e esse uso só aumenta. Pode-se esperar uma expansão ainda maior dos apps, exatamente como foi visto quando a internet tornou-se onipresente. As empresas já estão construindo sites a partir do mobile ou apenas mobile para atender à nova e crescente demanda.

3 – Big Data cada vez mais Big

Agora que grande parte da humanidade está conectada via mobile, utilizando aplicativos bacanas e contando com uma ampla demografia de millenials experientes em tecnologia, a big data está explodindo. É uma grande oportunidade para as empresas que estão encontrando novas saídas a partir de novos usuários e novos usos. São necessárias ferramentas para analisar o fluxo de dados que entram na empresa. Profissionais experientes reconhecem isso e estão investindo em análise de dados e em tecnologia voltada à nuvem. Alguns estão até contratando cientistas especializados em dados para integrar a equipe de marketing.

4 – De mudança para a nuvem

De acordo com Scott Brinker, da ChiefMartec.com, existem hoje cerca de 2000 fornecedores de tecnologia de marketing. Com a explosão da Big Data e o barateamento da Amazon Web Services, empresas de tecnologia inteligente mudaram seus modelos de negócios para a nuvem e construíram novas soluções voltadas para a cloud.

5 – Marketing preditivo é o que une tudo isso

Matemática e ciência são o que dão poder ao marketing cloud, é preciso admitir. Também não é possível ignorar a geração de leads ou tratar o marketing automation como uma espécie de caixa-preta. Ao combinar os dados públicos e privados, os profissionais de marketing podem criar modelos para identificar automaticamente tendências, como lead nurturing, lead scoring, adaptação e intenção de compra antes de a venda ocorrer. Inteligência e análise preditiva são as chaves para o sucesso das empresas de marketing cloud que entenderem que o futuro do marketing está em amar matemática e ciência.

Fonte: pmweb - Wunderman

[lovizzaro-blog]

Afinal, o que é Marketing Cloud?

Para o marketing, é uma ilha do tesouro inspiradora e assustadora. Para as companhias de tecnologia e software, ajudar o marketing a colocar esse tesouro em uso é a maior oportunidade de negócios da nossa era. Eles chamam isso de “A nuvem do marketing” (Marketing Cloud).

Vamos começar com o que a nuvem não é. Não é uma atmosfera efêmera de dados. Não se desloca no ar. Ela não se parece com um dinossauro ou um elefante ou com sua tia Bárbara. É uma rede global de centros de dados construídos por algumas das empresas de Internet mais poderosas do nosso tempo. Ela tem uma casa terrestre. Muitas casas, na verdade, em lugares como The Dalles, Oregon (Google), Santa Clara, California (Facebook), Maiden, NC (Apple), Ashburn, Va. (Amazon).

Nuvem dos Negócios

Enquanto isso, os fabricantes de hardware como a IBM, a GE e a Honeywell estavam produzindo computadores gigantes, carinhosamente conhecidos como “big iron”, para as necessidades de negócios das corporações. Essas máquinas poderosas permitiram que as empresas “triturassem” faixas de dados, fazendo com que muitos projetos que exigiam grandes quantidades de computação, se tornassem viáveis pela primeira vez.

Mas eles eram incrivelmente caros. As empresas menores responderam executando linhas diretas para máquinas de propriedade dos fabricantes, universidades e outras partes, que podiam alugar a computação. Este “hardware como serviço” poderia ser visto como uma entrada precoce no conceito nuvem.

Entramos então na era PC, tecnologias de rede de comutação de pacotes derivados da ARPANET fizeram o compartilhamento de recursos de computador ainda mais comuns e eficazes em termos de custos.

Primeiro, terminais deram aos trabalhadores o acesso a unidades de processamento de computador central, geralmente localizado em uma sala arrefecida abaixo do solo. Mais tarde, os espaços foram convertidos para redes de servidores que executam o software internamente.

Mas isso não durou muito tempo. Servidores são caros. E uma vez que a Internet floresceu, essas empresas de software descobriram que através da construção de sua própria computação remota: a nuvem.

Nuvem dos Consumidores

Os consumidores abraçaram de vez a nuvem. Enquanto empresas usaram a nuvem para resolver problemas nos negócios, os consumidores foram para a nuvem “pública”, de serviços gratuitos. Dropbox, Google Drive e Amazon Cloud Drive permitiram aos consumidores salvar e compartilhar arquivos pela nuvem, enquanto a nuvem da Apple garante que todos os dispositivos sejam sincronizados em uma única conta. Outros serviços de nuvem para consumidores são os famosos Spotify e Netflix, que ajudaram a criar uma economia digital de gratificação espontânea.

Nuvem do Marketing

A web está agora inundada com uma tonelada de dados e informações úteis, e o marketing rapidamente cria maneiras de usá-los para afiar a eficácia das suas campanhas.

Serviços de nuvem de marketing, muitas das próprias empresas de software, dão às empresas a possibilidade de recorrer a uma gama diversificada de produção e ferramentas de análise de dados sem lidar com a sua manutenção ou despesas gerais.

Unindo seus dados próprios e de terceiros, os departamentos de marketing criam perfis de audiência completos; racionalizam o fluxo de trabalho e promovem a colaboração entre as equipes, disparam mensagens para os lugares certos na seqüência certa para alcançar o efeito máximo em e-mail, social media e outros canais; proporcionando a oportunidade para métricas e análises unificadas. “Hubs” de marketing baseados em nuvem tornaram-se muito atraentes. O aumento dos dados disponíveis para os profissionais do marketing, inclusive a migração dos consumidores para o mobile, acelerou a adoção de serviços de marketing de nuvem.

Fonte: Digitalks

[lovizzaro-blog]

Toggle Hidden Files on Mac OS X 10.10 (Yosemite)

Enable (and disable) it through the Terminal

Open Terminal Application and run the following script:

To Show

defaults write com.apple.finder AppleShowAllFiles -boolean true ; killall Finder

To Hide

defaults write com.apple.finder AppleShowAllFiles -boolean false ; killall Finder

Automating the toggling of hidden files and creating a context menu item

What to do in Automator

Follow these steps:

Launch Automator located in the applications

Select Service as the type of template to use for your new Automator task, and click the Choose button.

In the Library pane, make sure Actions is selected, then underneath the Library item, click Utilities. This will filter the available workflow types to just those relating to utilities.

In the filtered list of actions, click Run Shell Script and drag it to the workflow pane.

At the top of the workflow pane are two drop-down menu items. Set the Service receives selected to ‘files or folders’. Set the in to ‘Finder’.

Copy the entire shell script command that we created above, and use it to replace any text that may already be present in the Run Shell Script box.

From the Automator file menu, select “Save,” and then give the service a name. The name you select will appear as the menu item. I call mine Toggle Hidden Files.

After saving quit the Atomiser

The Script

#!/bin/bash # # Script to toggle hide/unhide hidden files in the Finder application. # # Author : Bert van Langen # Created : 21 December 2014 # STATUS=`defaults read com.apple.finder AppleShowAllFiles` if [ $STATUS == 1 ] then defaults write com.apple.finder AppleShowAllFiles -boolean false else defaults write com.apple.finder AppleShowAllFiles -boolean true fi killall Finder

This is what you will get:

The source: BVLANGEN

[lovizzaro-blog]

Rounded Corners

Standard:

.element: { -o-border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; /* css3 */ }

Individual Corners:

.element { -o-border-radius-topleft: 10px; -o-border-radius-topright: 20px; -o-border-radius-bottomright: 30px; -o-border-radius-bottomleft: 0; -moz-border-radius-topleft: 10px; -moz-border-radius-topright: 20px; -moz-border-radius-bottomright: 30px; -moz-border-radius-bottomleft: 0; -webkit-border-top-left-radius: 10px; -webkit-border-top-right-radius: 20px; -webkit-border-bottom-right-radius: 30px; -webkit-border-bottom-left-radius: 0; border-radius-topleft: 10px; border-radius-topright: 20px; border-radius-bottomright: 30px; border-radius-bottomleft: 0; }

Shorthand:

border-radius: [top-left] [top-right] [bottom-right] [bottom-left]

.element { -o-border-radius: 10px 20px 30px 0; -moz-border-radius: 10px 20px 30px 0; -webkit-border-radius: 10px 20px 30px 0; border-radius: 10px 20px 30px 0; }

Full article here

[lovizzaro-blog]

Font Awesome, the iconic font and CSS framework

Install via CDN:

https://fortawesome.github.io/Font-Awesome/get-started/

Bootstrap 3.0 - Install via CDN:

http://www.bootstrapcdn.com

[lovizzaro-blog]

Background with CSS3

A little more about background with CSS3

CSS3 contains a few new background properties, which allow greater control of the background element. Here there are:

background-size

background-origin

background-clip

Multiple Backgrounds

CSS3 allows you to add multiple background images for an element, through the background-image property.

The different background images are separated by commas, and the images are stacked on top of each other, where the first image is closest to the viewer.

The following example has two background images, the first image is a flower (aligned to the bottom and right) and the second image is a paper background (aligned to the top-left corner):

#example1 { background-image: url(img_flwr.gif), url(paper.gif); background-position: right bottom, left top; background-repeat: no-repeat, repeat; }

Shorthand property:

#example1 { background: url(img_flwr.gif) right bottom no-repeat, url(paper.gif) left top repeat; }

Background Size Property

The CSS3 background-size property allows you to specify the size of background images.

Before CSS3, the size of a background image was the actual size of the image. CSS3 allows us to re-use background images in different contexts.

The size can be specified in lengths, percentages, or by using one of the two keywords: contain or cover.

The code:

#div1 { background: url(img_flower.jpg); background-size: 100px 80px; background-repeat: no-repeat; }

Define sizes of multiple background images:

#example1 { background: url(img_flwr.gif) left top no-repeat, url(img_flwr.gif) right bottom no-repeat, url(paper.gif) left top repeat; background-size: 50px, 130px, auto; }

Full size background image:

html { background: url(img_flower.jpg) no-repeat center center fixed; background-size: cover; }

Background Origin Property

The CSS3 background-origin property specifies where the background image is positioned.

The property takes three different values:

border-box - the background image starts from the upper left corner of the border

padding-box - (default) the background image starts from the upper left corner of the padding edge

content-box - the background image starts from the upper left corner of the content

#example1 { border: 10px solid black; padding:35px; background:url(img_flwr.gif); background-repeat: no-repeat; background-origin: content-box; }

For a more practical approache.

Background Clip Property

The CSS3 background-clip property specifies the painting area of the background.

The property takes three different values:

border-box - (default) the background is painted to the outside edge of the border

padding-box - the background is painted to the outside edge of the padding

content-box - the background is painted within the content box

#example1 { border: 10px dotted black; padding:35px; background: yellow; background-clip: content-box; }

CSS3 Background Properties

W3Schools articles about each property:

Property Description

background

A shorthand property for setting all the background properties in one declaration

background-clip

Specifies the painting area of the background

background-image

Specifies one or more background images for an element

background-origin

Specifies where the background image(s) is/are positioned

background-size

Specifies the size of the background image(s)

Original article here

[lovizzaro-blog]

Cover Images

The goal here is a background image on a website that covers the entire browser window at all times.

Let's put some specifics on it:

Fills entire page with image, no white space

Scales image as needed

Retains image proportions (aspect ratio)

Image is centered on page

Does not cause scrollbars

As cross-browser compatible as possible

No Flash! Thank God

Awesome, Easy, Progressive CSS3 Way

We can do this purely through CSS thanks to the background-size property now in CSS3. We'll use the html element (better than body as it's always at least the height of the browser window). We set a fixed and centered background on it, then adjust it's size using background-size set to the cover keyword.

html { background: url(images/bg.jpg) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }

Works in:

Safari 3 and higher

Chrome (any)

IE 9 and higher

Opera 10 and higher

Firefox 3.6 and higher

Note: Firefox 4 supports non-vendor prefixed version

A big tks to Chris Coyier @CSS-Tricks.

Source article here

[lovizzaro-blog]

Color hex is a easy to use tool to get the color codes information including color models (RGB,HSL,HSV and CMYK), css and html color codes.

[lovizzaro-blog]

Tumblr is great for a lot of things, but it tends not to be the blogging platform of choice for programmers. Themes don’t let you showcase snippets of code and even creating custom CSS classes can be...

[lovizzaro-blog]

HTML Entities

HTML Entities are reserved characters that must be replaced when you are refering themselve inside a HTML code, otherwise the browser might mix them up with the original code tags. So to avoid this, character entities are used to display the reserved characters in the code (in this case, for HTML).

If you use the less than (<) or greater than (>) signs in your text, the browser might mix them up with the original code.

Entities are also used to present characters thar are not displayed on your keyboard. Like the Euro sign (€)

A character entity looks like this:

& + entity_name + ; OR & + # + entity_number + ;

Everything has a "reason" - try to momorize some of these entities. They are not that hard to remember.

See if you can recognize the pattern in the examples below:

Less Than = < Greater Than = > Non-Breaking SPace =   COPYright = © AMPersand = &

Most Common HTML Character Entities

Description Entity Name Entity Number Result non-breaking space     less than < < < greater than > > > ampersand & & & cent ¢ ¢ ¢ pound £ £ £ yen ¥ ¥ ¥ euro € € € copyright © © © registered trademark ® &#174 ; ®

See more info here.

And for some quick lookup websites ... Character Entity Reference Chart, Character Escape Codes, Character Entities or HTML Entities

[lovizzaro-blog]

How much time should I spend on meta tags, and which ones matter?

If you have ever been told or thought that meta tags don't matter any more, that information is dead wrong. Google has proposed at least one meta tag themselves and support many others. Smaller search engines and directories also use the meta tags for their own specific purposes. And the description meta tag is used universally among major search engines to present how your site is listed.

What Are The Important Meta tags?

Meta Description Tag - The most important of them all: The meta description tag is important from both from a human and search engine perspective, if used intelligently and properly.

Example Code:

<meta name="Description" content="I wouldn't waste 2 minutes optimising my keyword meta tags for search engines." />

Google’s generation of page titles and descriptions (or “snippets”) is completely automated and takes into account both the content of a page as well as references to it that appear on the web. The goal of the snippet and title is to best represent and describe each result and explain how it relates to the user’s query. Matt Cutt

Full Article: SEO Meta Tags Best Practices

Another point of view: Meta Tags & SEO - Dispelling the Myth

[lovizzaro-blog]

A simple way to find out your browser size.

[lovizzaro-blog]

A simple tool for converting HEX values to RGB and vice versa.

[lovizzaro-blog]

Here is an old post with a similar subject.

[lovizzaro-blog]

List of my most used commands and shortcuts in the terminal for Mac

[lovizzaro-blog]

Browsersync makes your browser testing workflow faster by synchronising URLs, interactions and code changes across multiple devices. It’s wicked-fast and totally free.

Here is a link on how to install Remember: install it globally.

And here are some command lines ready to go.

A quick guide on how to move to a specific directory and start BrowserSync using the Terminal:

Open the Terminal;

Type the following to enter the directory where your web project is located: This is an example. I’ve saved my project folder inside the MAMP working directory (htdocs).

cd /Applications/MAMP/htdocs/WEB-PROJECT-FOLDER-HERE/

Then type the following to open and start BrowserSync:

browser-sync start --server --files="css/*.css"