Gostei muito deste vídeo com dicas para criação de sites. Recomendo muito para profissionais e estudantes de Marketing Digital. Senti falta de comentar sobre o WordPress e Joomla! como ferramentas para sites fáceis de gerenciar e também o Wix que não podemos ignorar como alternativa.

Texto completo do Youtube

Uma das coisas que mais vejo no campo do Web Design, são perguntas como: Como faço para ter sucesso com meu site? Como coloco o meu site no topo do Google? O Design vem antes ou depois do código? Como estruturar meu projeto? Perguntas assim podem parecer bobas, mas elas correspondem a uma grande parte dos problemas enfrentados por inúmeros Designers e agências digitais do mundo inteiro.

Neste vídeo, ensinarei como podemos trabalhar melhor o workflow do nosso projeto, mostrando ferramentas valiosas e um passo a passo inteligente contendo a importância de casa fase, seguindo a ordem do modelo proposto e adaptado pelo Designer John Furness em meados de 2011, e que foi estruturado nas seguintes etapas: Briefing, Usabilidade e Pesquisa, Arquitetura de informação, fluxogramas e sitemaps, wireframes e prototipação, design, codificação, seo e otimização.

// ARQUIVOS E REFERÊNCIAS DO VÍDEO

1. BRIEFING – 01:08

2. USABILIDADE E PESQUISA – 01:40
UsabilityHub – https://usabilityhub.com/
Usabilla – https://usabilla.com/
Morae – https://www.techsmith.com/morae.html
Testaisso – http://www.testaisso.com.br/
Dribbble – https://dribbble.com/
Behance – https://www.behance.net/
MaterialUp – http://www.materialup.com/
Pintrest – https://br.pinterest.com/

3. ARQUITETURA DE INFORMAÇÃO, FLUXOGRAMAS E SITEMAPS – 06:50
Google Draw – https://docs.google.com/drawings/
Draw.io – https://www.draw.io/
Illustrator CC – http://www.adobe.com/br/products/illu…
Gliffy – https://www.gliffy.com/
Axure – http://www.axure.com/

4. WIREFRAMES E PROTOTIPAÇÃO – 09:25
Axure – http://www.axure.com/
QuirkTools – http://quirktools.com/wires/p0njrs/
Pixate – http://www.pixate.com/
Fireworks – http://www.adobe.com/br/products/fire…
Sketch V3 – https://designcode.io/sketch
Invision (Prototipação colaborativa) – http://www.invisionapp.com/
Adobe Experience Design (Preview) – http://www.adobe.com/jp/products/expe…

5. DESIGN (WEB-DESIGN) – 13:57
Photoshop – http://www.adobe.com/br/products/phot…
Fireworks – http://www.adobe.com/br/products/fire…
Illustrator CC – http://www.adobe.com/br/products/illu…

6. CODIFICAÇÃO – 16:11
SublimeText – https://www.sublimetext.com/
Dreamweaver – http://www.adobe.com/br/products/drea…
Visual Studio – https://code.visualstudio.com/
Brackets – http://brackets.io/

7. SEO & OTIMIZAÇÃO – 19:57
Google Webmaster – https://www.google.com/intl/pt-BR/web…
Google Analytics – https://www.google.com/intl/pt-BR/ana…
Good Adwords (Key Planner) – https://adwords.google.com.br/Keyword…
Bing Webmaster – http://www.bing.com/toolbox/webmaster
Woorank – https://www.woorank.com/pt
OpenLinkProfiler – http://openlinkprofiler.org/
Moz – https://moz.com/products/pro

8. INSIGHTS E MELHORAMENTO CONTÍNUO – 20:57

// +++ BONUS +++ – 23:59
Asana – https://app.asana.com/0/1023004816236…
Redepen – https://redpen.io/
GhostLab (Igual ao AdobeEdge) – https://www.vanamco.com/ghostlab/

// INSCREVA-SE NO CANAL
http://adf.ly/1XvuRS

// REDES SOCIAIS
1. Twitter: http://adf.ly/1XvuFL
2. Facebook: http://adf.ly/1XvuIl
3. Google+: http://adf.ly/1XvuLW