*Aos internautas que utilizarem este material, peço que me...

MONTADO A PARTIR DA INTERNET NÃO PODE SER COMERCIALIZADO

WEB DESIGN CONCEITOS

*Aos internautas que utilizarem este material, peço que me enviem e-mail via Portal Geo

Brasil, alertando os possíveis links quebrados, erros e incoerências.

O web design pode ser visto como uma extensão da prática do design, onde o foco do projeto

é a criação de web sites e documentos disponíveis no ambiente da web.

O web design tende à multidisciplinaridade, uma vez que a construção de páginas web requer

subsídios de diversas áreas técnicas, além do design propriamente dito. Áreas como a

arquitetura da informação, programação, usabilidade, acessibilidade entre outros.

A preocupação fundamental do web designer é agregar os conceitos de usabilidade com o

planejamento da interface, garantindo que o usuário final atinja seus objetivos de forma

agradável e intuitiva.

Planejamento estratégico

Como todo trabalho de design, ele é um projeto, e necessita uma análise informacional, a

partir de um briefing. Detectar corretamente o objetivo do projeto é essencial para um bom

planejamento, de modo que as ações sejam tomadas de forma correta.

É sempre necessário definir o público alvo do site, o objetivo, os serviços oferecidos, o

diferencial para o público. A partir desses e de outros elementos que sejam especificamente

relevantes ao projeto, será definida a estrutura do site (Arquitetura de informação), a

tecnologia empregada e o layout.

De uma forma geral, embora usualmente possa parecer que a primeira impressão que se tem

de um site é o visual, na verdade o visitante busca o conteúdo, por esse motivo o primeiro

passo estratégico é definir bem todas as informações que o site terá, definir claramente a

arquitetura de informação do site e por último, o design visual do site, que não precisa pular,

girar e piscar, a não ser que o que se esteja vendendo é design/imagem (que não se aplica ao

meio informacional que é a Web), mas ter um aspecto profissional seguindo pelo menos os

conceitos básicos do design como aproximação, contraste, alinhamento, dentre outros.

Há uma diferença conceitual marcante entre design nos meios tradicionais, como no gráfico e

o design aplicado na web. Na web, a estética deve ser moldada ao dispositivo que acessa ao

site ou mesmo desabilitada caso não seja necessária no contexto de utilização. No meio gráfico

é possível prever como o usuário final verá a estética do produto, já na web isto não é possível,

pois a aparência pode e deve mudar radicalmente de acordo com o sistema operacional

utilizado, configurações pessoais, navegadores, resoluções de tela e dispositivos, como celular,


TV, impressora, leitores de telas etc. Por este motivo, a informação (HTML) deve trabalhar

independente da formatação (CSS) e do comportamento (scripts), que são recomendações do

W3C.

Estrutura

A estrutura, também conhecida como arquitetura de informação, do site deve contemplar seu

objetivo, tornando a experiência do usuário a mais confortável e fácil possível, chamamos isso

de usabilidade. Deve-se planejar a estrutura de forma que o usuário obtenha facilmente a

informação ou serviço desejado. Hoje em dia são inúmeras as formas que um site pode

adquirir e a criatividade continua ser o grande diferencial na produção de web.

Layout

O layout precisa transmitir a informação desejada com eficiência. É preciso que o layout seja

um elo de comunicação com o usuário, que sua linguagem seja condizente com o objetivo do

site. Conhecer heurísticas de usabilidade é fundamental para se gerar layouts para a web.

Cada elemento inserido em um website deve ter um objetivo, a perfeição de um website se

atinge quando não há nada a ser retirado e não quando não há nada mais a ser inserido.

A maioria dos layouts antigos dos sites da Web eram feitos com tabelas na linguagem HTML,

porém esta forma é inapropriada pois tabelas devem ser utilizadas apenas para exibir dados

tabulados. Entretanto existem layouts que são completamente produzidos sem a presença de

tabelas, são os famosos "tableless" e esta sim é a melhor forma de estrutura para layouts.

Navegadores

São programas responsáveis por interpretar o conteúdo de um web site, disponibilizando

assim a interface com a qual o usuário final irá interagir. O navegador está para o web design

assim como o papel está para o jornal. A grande variedade de navegadores e discrepância

entre os recursos fez seus próprios criadores caminharem em direção a um padrão comum.

Atualmente é indispensável criar sites seguindo os padrões da W3C.


No desenvolvimento do site, o HTML deve ser criado seguindo os padrões do W3C (Web

Standards) de forma que fique funcional, independente dos dispositivos (TV, celular,

impressora, monitor etc). Apesar de em tese não haver a necessidade de testar em diversos

navegadores, é um bom hábito testar em mais de um navegador (Firefox, Internet Explorer,

Netscape, Opera, Safari, Chrome e outros), pois o layout do site pode apresentar diferenças

em determinados navegadores, e o usuário que navega não entenderá o que está

acontecendo.

Padrões

A World Wide Web Consortium (W3C) é o órgão responsável por recomendar padrões de

desenvolvimento para a internet. Por meio destes padrões se pode classificar: web sites de

acordo com suas características técnicas, indo além do visual e; navegadores, de acordo com

sua capacidade em atender aos padrões definidos.

O grande objetivo de seguir os padrões do W3C é de possibilitar que a informação veiculada

pelo site permaneça independente do dispositivo utilizado pelo visitante e que seja acessível.

Programas utilizados

Existe um leque enorme de programas usados pelos web designer. Para construção do código,

por se tratar de simples texto, qualquer editor de texto pode servir de suporte para a criação

do código. Entretanto, há programas tanto gratuitos como de uso comercial, com interface

WYSIWYG, que são amplamente utilizados no mercado tanto para gerenciar sites, quanto para

apenas editar códigos, como é o caso do Dreamweaver, Aptana, Frontpage (pouco

aconselhável por gerar HTML exclusivamente para o Internet Explorer, além de gerar código

com possíveis erros de sintaxe), na parte visual, os editores gráficos vetoriais Corel Draw,

Illustrator ou o Inkscape), de bitmap GIMP, Photoshop ou o Fireworks. Para animações e

recursos dinâmicos, o Flash é o mais utilizado. Em relação ao Flash, deve-se ter o cuidado de

usá-lo apenas onde a solução seja impossível de ser reproduzida em HTML, jamais se usa em

menus e áreas de conteúdo por ser um arquivo binário, não ser acessível e estar em desacordo

com as recomendações do W3C.

WEB DESIGNER

Web designer é o profissional competente para a elaboração do projeto estético e funcional

de um web site. Para o desenvolvimento de websites esse profissional deve ter a compreensão


da aplicação em mídia eletrônica de disciplinas como: Teoria das cores, Tipografia, Arquitetura

de informação, Semiótica, Usabilidade, e Conhecimento de Linguagens de Estruturação e

Formatação de Documentos hiper textuais como XHTML (Extensible Hypertext Markup

Language) e CSS(Cascade Style Sheet). Para a aplicação desse conhecimento, de forma geral, o

web designer recorre a softwares de tratamento e edição de imagens, desenho e

codificadores.

WEB MASTER

Um webmaster é um profissional que tem por finalidade a tarefa de instalar, dar manutenção,

criar e realizar a gestão de um determinado site. Por vezes, o webmaster acumula a tarefa de

administração de servidores na qual se hospeda o site.

Para colocar uma página na Internet, é necessário um profissional que saiba operar as tarefas

entre um computador e a Internet. Este profissional é o Webmaster. O webmaster (se for o

caso) recebe do webdesigner os arquivos (em disquete ou CD) do Site com o design pronto e já

pré-configurados para ser colocado na Internet. Depois, insere algumas configurações como:

incluir contador de acesso, registros em formulários e alguns outros registros de

funcionamento. O webmaster também executa algumas outras funções como:

1- Manutenção de um Site. (atualizações e modificações)

2- Cadastrar seu Site (como um pequeno anúncio) em Sites de busca nacionais e

internacionais.

3- Verificar com frequência se o Site está em perfeito funcionamento.

http://blog.thiagobelem.net/zen-coding-criando-html-como-um-ninja/

http://blog.thiagobelem.net/zen-coding-criando-html-como-um-ninja/


*Gerador de Código rápido HTML

http://www.ornj.net/webalbum/

* Gerador de Galeria de Imagens

http://www.says-it.com/record/45.php (Passatempo)

* Faca o seu Disco

http://pixopoint.com/products/suckerfish_css/

* Menus em CSS

http://www.inexistentman.net/2007/10/14/lista-de-geradores-online/

* Acima temos uma lista de geradores online

http://dicasplugins.net/2009/02/15-geradores-online-para-o-design-do.html

* Mais uma lista de Geradores Online

http://www.cssmenumaker.com/

* Outro Gerador de Menu em CSS

http://colorschemedesigner.com/

http://www.ornj.net/webalbum/

http://www.says-it.com/record/45.php

http://pixopoint.com/products/suckerfish_css/

http://www.inexistentman.net/2007/10/14/lista-de-geradores-online/

http://dicasplugins.net/2009/02/15-geradores-online-para-o-design-do.html

http://www.cssmenumaker.com/



* Gerenciador de Cor para seu projeto

http://www.bannerfans.com/banner_maker.php

* Gerador de Banner

http://web2.pdfonline.com/

* Gerador de PDF para imprimir sua webpage online

http://iplotz.com/app/index.php?

* Gerador de Wireframe para projetos web (ING)

http://www.smartdraw.com/downloads/

* SmartDraw Gerador de SiteMap e Wireframe

http://www.stripegenerator.com

* Gerador de fundo listrado para seu site

http://www.rssinclude.com/

http://www.bannerfans.com/banner_maker.php

http://web2.pdfonline.com/

http://iplotz.com/app/index.php

http://www.smartdraw.com/downloads/

http://www.stripegenerator.com/

http://www.rssinclude.com/


* Gerador de Script para colocar seu RSS direto na página

http://www.go2web20.net/twitterFollowBadge/

* Coloque o link do Twitter na lateral da sua página

http://freetwitterdesigner.com/

* editor de Background para seu Twitter

Fontes

RUAS, NILSON. Criando Sites Web com HTML 4. 1ªed. Visual Books, 2002.

MARCONDES, C. ALFIM. HTML 4.0 Fundamental - A Base da Programação Para Web. 1ªed.

Érica, 2005.

CARVALHO, ALAN. Criando Sites Profissionais HTML 4.1 E CSS 2.1: Manual Completo. 1ªed.

Book Express, 2004.

CAMPOS, LEANDRO. HTML Rápido e Prático. 1ªed. Terra, 2004

MULLEN, ROBERT. HTML 4: Guia De Referência Do Programador. 1ªed. Ciência Moderna, 1998.

NIEDERAUER, JULIANO. Desenvolvendo Websites Com PHP. 2ªed. Novatec, 2004.

http://www.go2web20.net/twitterFollowBadge/

http://freetwitterdesigner.com/


YNEMINE, S. TAYHATA. Dreamweaver MX 2004. 1ªed. Visual Books, 2004.

OLIVIERO, CARLOS ANTONIO JOSÉ. Faça Um Site Dreamweaver 8 - Orientado Por Projeto - Para

Windows. 1ªed. Erica, 2006.

PAGE, KHRISTINE. Dreamweaver 8: Guia Autorizado Macromedia. 1ªed. Campo, 2006.

MEDEIROS, FERNANDO. Dreamweaver 8 - Fundamentos E Aplicações. 1ªed. Erica, 2006.

ALVES, W. PEREIRA. Crie, Anime E Publique Seu Site Utilizando Fireworks 8, Flash 8 E

Dreamweaver 8. 1ªed. Érica, 2006.

MEADHRA, MICHAEL. Faça de Tudo com o Dreamweaver MX 2004. 1ªed. Alta Books, 2004.

ELLIOTT, SHANE. Flash MX 2004 Dicas Geniais. 1ªed. Ciência Moderna, 2005.

SOARES, F. BARBIERI. Publicidade Com Flash MX 2004: Banners. 1ªed. Ciência Moderna, 2005.

KERMAN, PHILLIP. Programando Actionscript Em Flash. 1ªed. Ciência Moderna, 2001.

YNEMINE, SILVANA TAUHATA. Flash 8 Professional. 1ªed. Visual Books, 2005.

PATTON, BROOKS; FRANKLIN DEREK. Macromedia Flash 5! Animação Criativa na Web. 1ªed.

Campos, 2001.

MACEDO, MARCELO DA SILVA. Integrando Flash Com Asp E Asp.Net. 1ªed. Ciência Moderna,

2005.


NOGUEIRA, HUGO. Flash 8 Com Administração Remota Em Php E Mysql. 1ªed. Ciência

Moderna, 2006.

MEDEIROS, FERNANDO VENTURA; NADIA KEIKO ARAI. Flash Professional 8 - Fundamentos E

Aplicações - Para Windows. 1ªed. Erica, 2005.

MANZI, FABRÍCIO. Flash 8 Professional - Criando Além Da Animação. 1ªed. Érica, 2005.

ALVES, WILLIAM PEREIRA. Crie, Anime E Publique Seu Site Utilizando Fireworks 8, Flash 8 E

Dreamweaver 8. 1ªed. Érica, 2005.

SOARES, WALACE. PHP 5: Conceitos, Programação E Integração Com Banco de Dados. 1ªed.

Érica, 2004.

NIEDERST, JENNIFER. Aprenda Web Design. 1ªed. Ciência Moderna, 2002.

MEMÓRIA, FELIPE. Design para a Internet. 2ªed. Campus, 2006.

REBITTE, LEONARDO; MARCOS VINICIUS BP. Dominando Tableless - Seu Site entre os Primeiros

nos Sites de Busca. 1ªed. Alta Books, 2006.

FREEMAN, ELISABETH; ERIC FREEMAN. Use a Cabeça! (Head First) HTML com CSS & XHTML.

1ªed. Alta Books, 2006.

WOLTON, DOMINIQUE. Internet, e depois? Uma Teoria Crítica das Novas Mídias. 1ªed. Sulina,

2003.


WILLIAMS, ROBIN. Design para quem não é Designer - Noções Básicas de Planejamento Visual.

2ªed. Callis, 2005.

DAMASCENO, ANIELLE. Webdesign Teoria & Prática. 2ªed. Visual Books, 2005.

CASTELLS, MANUEL. A Galáxia da Internet: Reflexões sobre a Internet, os negócios e a

sociedade. JZE, 2003.

http://maujor.com/w3ctuto/roundshadow.html

http://maujor.com/tutorial/box-arred.php

http://www.livrojavascript.com.br/

http://www.livrocss.com.br/

http://www.livroajaxjquery.com.br/

http://www.livrohtml.com.br/

http://infornews.org/2010/06/logotipo-marca-ou-logomarca/

http://www.4shared.com/dir/10538258/ee2d7b9a/Web_Design.html


COREL X5

http://www.corel.com/servlet/Satellite/br/pt/Product/1191272117978

PHOTOSHOP CS4

http://www.adobe.com/products/photoshop/photoshop/

FIREWORKS CS4

http://www.adobe.com/br/products/fireworks/

PHOTOIMPACT X3

http://www.ulead.com/pi/

ILLUSTRATOR CS4

http://www.adobe.com/br/products/illustrator/

COREL PAINTER

http://www.corel.com/servlet/Satellite/us/en/Product/1166553885783#tabview=tab0

BOX SHOT 3D

http://www.boxshot3d.com/


COMIC LIFE

http://plasq.com/comiclife-win

BRYCE 3D

http://www.daz3d.com/i.x/software/bryce

AAA LOGO

http://www.aaa-logo.com/

INSTANT GALLERY MAKER

http://www.neowise.com/instant-gallery-maker/

FLASH BANNER CREATOR

http://www.flash-banner-creator.com/download.html

FREE FLASH BANNER CREATOR

http://www.123-banner.com/

CRIADOR DE BOTÕES DE LUXO

http://www.kristanixsoftware.com/buttonshop/

FLASH MENU LABS

http://flashmenulabs.com/


ICON COOL STUDIO

http://www.iconcool.com/

LIKNO WEB BUTTON MAKER

http://www.likno.com/web-button-maker/

TRENDY FLASH SITE BUILDER

http://www.trendyflash.com/

GIF ANIMATOR

http://www.corel.com/servlet/Satellite?pagename=us-

Ulead/UleadProcessLayout&lc=en&ppg=CorelCorp/Trials/Login&pid=1175263345855&cid=117

9844639534

DECOMPILADORES FLASH

http://www.flash-decompiler.com/decompile-

swf.html?gr=sdlp01&gclid=CJv70MjBi5sCFYVM5QodtBoPqA

http://www.sothink.com/product/flashdecompiler/indexs.htm

SALVAR FLASH

http://www.flash-screen.com/flashsaver/


FERRAMENTAS DE GESTÃO DE CORES

http://www.colorblender.com/

http://www.colorschemer.com/online.html

http://colorsontheweb.com/colorwizard.asp#wizard

http://www.colourlovers.com/


EDITORES WYSIWYG

WYSIWYG é o acrônimo da expressão em inglês "What You See Is What You Get", cuja

tradução remete a algo como "O que você vê é o que você tem" (OQVVEOQVT). Significa a

capacidade de um programa de computador de permitir que um documento, enquanto

manipulado na tela, tenha a mesma aparência de sua utilização, usualmente sendo

considerada final a forma impressa. O uso inicial do termo foi relacionado a editores de texto,

agora porém é aplicado a qualquer tipo de programa.

Dois exemplos clássicos de editores WYSIWYG são o Writer e o Microsoft Word, nos quais o

documento é mostrado na tela da mesma forma que será impresso.

O criador do primeiro editor WYSIWYG, o Bravo, foi Charles Simonyi.

O termo define uma interface com o usuário que permite ao usuário ver algo muito similar ao

resultado final que irá obter enquanto um documento ou imagem (ou outro produto qualquer)

está sendo criado e modificado. Por exemplo, usando um editor de texto WYSIWYG, o usuário

pode editar o texto e vê-lo da forma exata como será impresso.

Para os usuários que entraram em contato com o computador após a invenção das interfaces

gráficas GUI, WYSIWYG parece ser o modo natural de trabalhar, porém todas as gerações


anteriores de usuários eram habituadas a ver a tela de um jeito e o documento de outro. Ou,

ainda, produzir o resultado final por meio de uma linguagem de comandos ou mesmo de uma

linguagem de programação, como é feito com os softwares troff, TeX e LaTeX.

Diferenças entre a tela e a impressão

Muitas vezes existem diferenças, mais ou menos sutis, entre o que se tem na tela e o material

impresso. Por exemplo, é comum ao usar o Microsoft Excel que o usuário tenha o sistema

configurado para mostrar as linhas que separam as células na tela, mas não na impressão.

Existem dificuldades técnicas de produzir uma interface que seja facilmente manipulável e

totalmente igual a saída, incluindo questões que são próprias do momento de impressão,

como o tamanho do papel, borda branca exigida pela impressora sendo usada. E, mesmo

assim, nem sempre o usuário quer ver as o documento como será impresso, mas sim em um

formato mais adequado para a edição (por exemplo, organizado por tópicos). Por causa disso,

ainda são usados modos específicos de edição e visualização na maioria dos programas. Por

exemplo, no Microsoft Word você encontra os modos de visualização:

Normal

Esquema Web

Esquema de Impressão

Esquema de Leitura

Destaques

Além desses, ainda podemos ver o documento no modo de previsão de impressão, onde o

esforço de as características da impressora é maior.

Tudo que você consegue

Diversas variações sobre o acrônimo foram criadas, normalmente como piadas evidenciando

suas falhas. Hoje em dia, devido ao poder e flexibilidade das aplicações WYSIWYG, muitas das


piadas perderam sua força. Nenhum dos acrônimos a seguir é tão reconhecido quanto o

original.

WYSIWIS

What You See Is What I See (usado no contexto de aplicações onde vários usuários veem a

mesma informação, como em CSCW)

WYSIWYAF

What You See Is What You Asked For (uma referência aos programas onde uma linguagem de

comando ou de programação é usada para gerar a saída)

WYSIAYG

What You See Is All You Get (usado por aqueles que acreditam que os editores WYSIWYG não

possuem poder, flexibilidade ou semântica suficiente, como nas linguagens de marcação)

WYSIAWYG

What You See Is Almost What You Get (usado para ironizar as diferenças entre tela e

impressão)

WYSIWYM

What You See Is What You Mean

WYSIMOLWYG

What You See Is More Or Less What You Get (novamente, ironizando as diferenças)

WYGINS

What You Get Is No Surprise - (novamente, ironizando as diferenças)


WYTYSIWYTYG

What You Think You See Is What You Think You Get (para programas que não são realmente

WYSIWYG, apesar de dizerem que são)

WYCIWYG

What You Cache is What You Get ("wyciwyg://" aparece ocasionalmente na barra de

endereços de Web browsers baseados no Gecko, como o Mozilla Firefox. - ou - What You

Create Is What You Get -or- What You Click Is What You Get

WYPIWYF

What You Print is What You Fax, briefly popular in the early days of fax modems, to distinguish

software that presented the fax modem to the OS via a printer driver and thus fax-enabled any

program capable of printing

WYGIWYG

What You Get Is What You Get (uma piada sobre o uso de linguagens de marcação)

WYGIWYGAINUC

What You Get Is What You're Given And It's No Use Complaining

YAFIYGI

You Asked For It, You Got It

WYSYHYG

What You See You Hope You Get (mais uma piada, usada pela Microsoft em um vídeo

promocional, falando sobre editores não WYSIWYG).


Sobre formulários:

http://neosite.ilogic.com.br/dicas/2007/08/melhores-artigos-sobre-validacao-de-

formulario.html

http://neosite.ilogic.com.br/dicas/2007/08/12-geradores-de-formularios-gratis.html

http://neosite.ilogic.com.br/dicas/2008/01/como-criar-formularios-web-profissionais.html

http://maujor.com/tutorial/cssforms.php

http://www.juliobattisti.com.br/tutoriais/juliosabreu/formularioshtml001.asp

http://br.geocities.com/aquiaprende/10.html

Estudos Aprofundados:

http://www.maujor.com/tutorial/seletores_css21_parte1.php

http://imasters.uol.com.br/cssinterativo/ifont.php

http://maujor.com/w3ctuto/xhtmlfaq.html

http://www.webtutoriais.com/open.php?cut=5971



http://www.carloshps.com.br/blog/04-banners-publicitarios-parte-1/





http://www.carloshps.com.br/blog/criando-um-site-passo-a-passo-parte-1/

http://www.webtutoriais.com/

SOBRE CORES

http://umpoucosobrecor.wordpress.com/2007/07/07/algumas-consideracoes-sobre-os-

sistemas-aditivos-e-subtrativos-de-cor/

http://umpoucosobrecor.wordpress.com/category/sintese-subtrativa/

http://wiki.educartis.com/wiki/index.php?title=Teoria_das_cores


http://coreseacores.wordpress.com/

http://www.posgraficos.pt/new_site/artigo-Links_uteis-25

http://www.visualpub.com.br/curiosidades/teoria_cor/cor_design_grafico/index.htm

http://www.mundocor.com.br/cores/ciencia_cor.asp

http://www.ic.uff.br/~aconci/curso/percep~1.htm

http://www.plugmasters.com.br/sys/materias/854/1/Uso-das-cores-em-Publicidade-%28on-

line-e-impressa%29

http://www.webmaster.pt/teoria-das-cores-5194.html

PORTAL GEO BRASIL APOIO

http://www.portalgeobrasil.org/info/htmlpage.htm

http://www.portalgeobrasil.org/info/CSS.htm

http://www.portalgeobrasil.org/info/docsmetod.htm


Ferramentas Extras

Capa de Revistas (Humor)

http://www.semfrescura.net/

Conversor de Moedas

http://pt.loobiz.com/conversion/us-dolar+real

Sobre Certificação Digital

https://www.startssl.com/

Apresentar RSS em formato Flash

http://grazr.com/

Visualizar seu site em outras resoluções

http://viewlike.us/

CRIAR ÍCONES

http://www.favicon.cc/


ORGANOGRAMAS

http://www.flowchart.com/

RIBBONS

http://www.websiteribbon.com/

CONVERSOR GERAL

http://www.zamzar.com/

http://www.youconvertit.com/convertfiles.aspx

PUBLICAÇÃO ON-LINE DE DOCUMENTOS

http://issuu.com/signup

COMIQS ON-LINE

http://comiqs.com/

EFEITO LIGHT BOX PARA GALERIA DE IMAGENS

http://www.huddletogether.com/projects/lightbox2/


LOGO MAKER

http://www.logomaker.com/

ESTUDO DE TIPOGRAFIA

http://www.papress.com/other/thinkingwithtype/index.htm

FONTES

http://www.dafont.com/

http://www.fonts.com/

http://www.acidfonts.com/

http://www.fontesgratis.com.br/

TESTAR SUA PÁGINA EM OUTROS NAVEGADORES/SISTEMAS

http://browsershots.org/

EDITORES CSS / MENUS CSS ON-LINE

http://cssmate.com/csseditor.htm


http://www.opencube.com/qmv_vdesign/launch_quickmenu.html#

http://www.tlbox.com/

http://www.webmaster-toolkit.com/css-menu-generator.shtml

http://www.cssplay.co.uk/menu/

BADGETS ON-LINE

http://www.web20badges.com/?img=badge1.jpg&text=Alex&font=coolveti&fontsize=16&font

color=%23FFFFFF&x=12&y=5&angle=10&bold=0

CONVERSOR DE ÍCONES

http://www.converticon.com/

http://iconverticons.com/

CONVERSOR DE VÍDEOS ON-LINE

http://online.movavi.com/


GADGETS

http://xat.com/web_gear/

http://www.widgetbox.com/

EDITOR RSS FREE

http://home.hetnet.nl/~bsoft/rssbuilder/download.htm

BANCO DE ÍCONES

http://www.iconarchive.com/

MAPA DE SITE ON-LINE

http://writemaps.com/index.php

http://sitemap.xmlecho.org/sitemap/login.echo?msg=not-logged-in

CRIADOR DE NUVENS DE LINKS ON-LINE

http://www.tagcloud-generator.com/


THINKFREE OFFICE ON-LINE

http://member.thinkfree.com/member/goSignin.action

ESTATÍSTICAS PARA SEU SITE

http://whos.amung.us/

BUSCADOR INTERNO

http://www.freefind.com/

GOOGLE ANALYTICS

http://www.google.com/analytics/pt-BR/#utm_source=pt_PT-ha-pt-

bk_analytics&utm_medium=ha&utm_campaign=pt_PT&utm_term=google%20analytics

FERRAMENTAS SEO

http://www.fique-rico.com/2008/11/06/as-15-melhores-ferramentas-de-seo-para-

principiantes/

http://www.submitexpress.com/


FERRAMENTAS GRÁFICAS

http://snipshot.com/

http://www.pikipimp.com/

http://pixenate.com/

http://www.phixr.com/

http://www.faceinhole.com/home.asp

GERAL

http://www.visual-blast.com/category/online-tools/

AGENDA

http://hitask.com/

ANTIVÍRUS ON-LINE


http://www.portalgeobrasil.org/info/material/antivirusonline.txt

TRANSMITIR VÍDEO LIVE FREE

http://pt-br.justin.tv/broadcaster_signup

EDITOR DE PÁGINAS EM FLASH TOTALMENTE ON-LINE (PESADO)

http://www.wix.com

Contribuições de [email protected]

http://cooltext.com/

http://logomarca.gratuita.com.br/

http://www.logoyes.com/logocreator.php


Editores

MICROSOFT EXPRESSION WEB

http://www.microsoft.com/expression/products/overview.aspx?key=web

WEBUILDER

http://www.blumentals.net/webuilder/

DREAMWEAVER CS5

http://www.adobe.com/products/dreamweaver/

NOTEPAD ++

http://www.flos-freeware.ch/notepad2.html

NVU

http://www.net2.com/nvu/

Google Conversion University

http://www.google.com/support/conversionuniversity/?hl=br


Buscadores Internos

https://www.google.com/accounts/ServiceLogin?continue=http://www.google.com/coop/ma

nage/cse/&service=cprose&hl=pt-BR&passive=true

http://www.freefind.com/

Meta Tag Analyzer

http://www.submitexpress.com/analyzer/

Verificar PageRank

http://livroseo.com/pagerank-live/

Google Ferramentas para Webmasters

https://www.google.com/accounts/ServiceLogin?service=sitemaps&passive=true&nui=1&cont

inue=https%3A%2F%2Fwww.google.com%2Fwebmasters%2Ftools%2Fhome%3Fhl%3Dpt-

BR&followup=https%3A%2F%2Fwww.google.com%2Fwebmasters%2Ftools%2Fhome%3Fhl%3

Dpt-BR&hl=pt-BR

Google Analytics

https://www.google.com/analytics/reporting/login?ctu=https%3A%2F%2Fwww.google.com%2

Fanalytics%2Fsettings%2F%3Fet%3Dreset%26hl%3Dbr


Estatísticas

http://whos.amung.us/

MSN no seu site

http://login.live.com/login.srf?wa=wsignin1.0&rpsnv=11&ct=1249089578&rver=5.5.4177.0&w

p=MBI&wreply=http:%2F%2Fsettings.messenger.live.com%2Fapplications%2FWebSettings.asp

x&lc=1033&id=76215

CONVERTA PDF EM DOC:

http://www.freepdftoword.org/pt/online.htm?step=1

COLOQUE SOM DE FUNDO NO SEU SITE:

http://www.supertrafego.com.br/som_fundo_home.asp

O QUE É BRIEFING?

http://pt.wikipedia.org/wiki/Briefing

COMO FAZER UM BOM BRIEFING?

http://usabilidoido.com.br/como_fazer_um_bom_briefing_de_website.html


DÚVIDAS BÁSICAS

http://www.elmefaria.com.br/utilidades/faqs.html

CHECKLIST DE USABILIDADE

http://www3.sympatico.ca/bkeevil/sigdoc98/checklist/WebCheck_Sep13.html

COBRANÇA E CONTRATO

http://www.4shared.com/file/20434329/9204ee6/projetoweb.html

CSS TABLE

http://www.portalgeobrasil.org/info/material/css_cheat_sheet.pdf

HTML TABLE

http://www.4shared.com/account/file/80275448/2797f103/htmlcard.html


ALGUNS PROGRAMAS/EDITORES E SERVIÇOS ON-LINE QUE FACILITAM A CRIAÇÃO:

WEB PAGE MAKER

http://www.webpage-maker.com/

EZGenerator Web builder

http://www.ezgenerator.com/Website/webbuilder.php

CRIATIVE HOST

http://www.creativehost.com.br/construtor-de-sites/site-gratis.htm

WEB NODE

http://www.webnode.com/

SITE.COM.BR

http://www.site.com.br/index2.php


COMUNIDADES.NET

http://no.comunidades.net/

CRIANDO SITE

http://www.criandosite.com.br/

EDICY

http://www.edicy.com/

BLOGS

WORDPRESS

http://br.wordpress.org/

BLOGGER

https://www.blogger.com/start


UNIBLOG

http://www.uniblog.com.br/

CRIARUMBLOG

http://www.criarumblog.com/

*Aos internautas que utilizarem este material, peço que me...

Documents

Transcript of *Aos internautas que utilizarem este material, peço que me...