webdesigning em 30 minutos bruno afonso 2 setembro 2005 comunicar ciência 2005

27
Webdesigning em 30 minutos Bruno Afonso Bruno Afonso 2 Setembro 2005 2 Setembro 2005 Comunicar Ciência 2005 Comunicar Ciência 2005

Upload: internet

Post on 16-Apr-2015

107 views

Category:

Documents


1 download

TRANSCRIPT

Page 1: Webdesigning em 30 minutos Bruno Afonso 2 Setembro 2005 Comunicar Ciência 2005

Webdesigning em 30 minutos

Bruno AfonsoBruno Afonso

2 Setembro 20052 Setembro 2005

Comunicar Ciência 2005Comunicar Ciência 2005

Page 2: Webdesigning em 30 minutos Bruno Afonso 2 Setembro 2005 Comunicar Ciência 2005

O que é uma página web?O que é uma página web?

Uma página web não é mais do que um Uma página web não é mais do que um ou mais ficheiros de texto, com ficheiros ou mais ficheiros de texto, com ficheiros adicionais de suporte (eg imagens, etc)adicionais de suporte (eg imagens, etc)

Page 3: Webdesigning em 30 minutos Bruno Afonso 2 Setembro 2005 Comunicar Ciência 2005

Páginas Web - ferramentasPáginas Web - ferramentas

Uma página web não é mais do que um Uma página web não é mais do que um ou mais ficheiros de texto, com ficheiros ou mais ficheiros de texto, com ficheiros adicionais de suporte (ex: imagens, etc)adicionais de suporte (ex: imagens, etc)

Existem ferramentas apropriadas Existem ferramentas apropriadas consoante as necessidades das pessoas: consoante as necessidades das pessoas: Não é necessariamente complicado!Não é necessariamente complicado!

Hoje em dia é muito fácil criar um espaço Hoje em dia é muito fácil criar um espaço na internet (ex: blogs)na internet (ex: blogs)

Page 4: Webdesigning em 30 minutos Bruno Afonso 2 Setembro 2005 Comunicar Ciência 2005

Evolução da webEvolução da web

Inicialmente apenas quem sabia “bater Inicialmente apenas quem sabia “bater código” é que podia ter páginas pessoais código” é que podia ter páginas pessoais sem pagar ou ajuda de outrossem pagar ou ajuda de outrosHTML

HTML

XHTML

XHTMLCSS1CSS1

CSS2CSS2

PHPPHP

ASPASP

Page 5: Webdesigning em 30 minutos Bruno Afonso 2 Setembro 2005 Comunicar Ciência 2005

CMS’ e a mudança de paradigmaCMS’ e a mudança de paradigma

Content Management System apareceram Content Management System apareceram com a mudança de paradigma que o com a mudança de paradigma que o conteúdo e o layout devem ser conteúdo e o layout devem ser independentesindependentes

Possibilita a integração de equipas tendo Possibilita a integração de equipas tendo em vista uma colaboração positiva entre em vista uma colaboração positiva entre creativos, técnicos e gestores de creativos, técnicos e gestores de conteúdosconteúdos

Page 6: Webdesigning em 30 minutos Bruno Afonso 2 Setembro 2005 Comunicar Ciência 2005

CMS’ e a mudança de paradigmaCMS’ e a mudança de paradigma

Exemplo:Exemplo:

Page 7: Webdesigning em 30 minutos Bruno Afonso 2 Setembro 2005 Comunicar Ciência 2005

CMS’ e a mudança de paradigmaCMS’ e a mudança de paradigma

Page 8: Webdesigning em 30 minutos Bruno Afonso 2 Setembro 2005 Comunicar Ciência 2005

Evolução da webEvolução da web

Inicialmente apenas quem sabia “bater Inicialmente apenas quem sabia “bater código” é que podia ter páginas pessoais código” é que podia ter páginas pessoais sem pagar ou ajuda de outrossem pagar ou ajuda de outros

Com o surgimento de CMS – Content Com o surgimento de CMS – Content Managemente System – qualquer leigo Managemente System – qualquer leigo informático pode gerir conteúdosinformático pode gerir conteúdos

O aparecimento de blogs (micro-CMS) O aparecimento de blogs (micro-CMS) permite qualquer pessoa ter o seu espaço permite qualquer pessoa ter o seu espaço pessoal ou colectivopessoal ou colectivo

Page 9: Webdesigning em 30 minutos Bruno Afonso 2 Setembro 2005 Comunicar Ciência 2005

Blogs – web ao alcance de todosBlogs – web ao alcance de todos

Um blog não é mais do que um micro-Um blog não é mais do que um micro-CMS em que apenas é preciso:CMS em que apenas é preciso:

Escrever texto(s), praticamente como se Escrever texto(s), praticamente como se fosse num editor de texto comumfosse num editor de texto comum

Saber editar imagens:Saber editar imagens: Reduzir até um tamanho aceitávelReduzir até um tamanho aceitável Formatos adequados: JPEG, GIF & PNGFormatos adequados: JPEG, GIF & PNG

Fazer upload de imagensFazer upload de imagens

Page 10: Webdesigning em 30 minutos Bruno Afonso 2 Setembro 2005 Comunicar Ciência 2005

Software pré-instalado em servidoresSoftware pré-instalado em servidores Grátis ou comercialGrátis ou comercial Mais simplesMais simples

Software instalado pela pessoa num Software instalado pela pessoa num espaço num servidor (alojamento)espaço num servidor (alojamento) Menos simples mas mais poderosoMenos simples mas mais poderoso Normalmente pago a menos que se tenha Normalmente pago a menos que se tenha

alojamento grátisalojamento grátis Melhor solução a longo prazoMelhor solução a longo prazo

Blogs – Diferentes opçõesBlogs – Diferentes opções

Page 11: Webdesigning em 30 minutos Bruno Afonso 2 Setembro 2005 Comunicar Ciência 2005

Criando um blog - ExemploCriando um blog - Exemplo

Page 12: Webdesigning em 30 minutos Bruno Afonso 2 Setembro 2005 Comunicar Ciência 2005

Criando um blog - ExemploCriando um blog - Exemplo

Page 13: Webdesigning em 30 minutos Bruno Afonso 2 Setembro 2005 Comunicar Ciência 2005

Criando um blog - ExemploCriando um blog - Exemplo

Page 14: Webdesigning em 30 minutos Bruno Afonso 2 Setembro 2005 Comunicar Ciência 2005

Criando um blog - ExemploCriando um blog - Exemplo

Page 15: Webdesigning em 30 minutos Bruno Afonso 2 Setembro 2005 Comunicar Ciência 2005

Criando um blog - ExemploCriando um blog - Exemplo

Page 16: Webdesigning em 30 minutos Bruno Afonso 2 Setembro 2005 Comunicar Ciência 2005

Criando um blog – Inserindo uma Criando um blog – Inserindo uma entradaentrada

Page 17: Webdesigning em 30 minutos Bruno Afonso 2 Setembro 2005 Comunicar Ciência 2005

Criando um blog – Inserindo uma Criando um blog – Inserindo uma entradaentrada

Page 18: Webdesigning em 30 minutos Bruno Afonso 2 Setembro 2005 Comunicar Ciência 2005

Criando um blog – Editando uma Criando um blog – Editando uma imagemimagem

Page 19: Webdesigning em 30 minutos Bruno Afonso 2 Setembro 2005 Comunicar Ciência 2005

Criando um blog – Inserindo uma Criando um blog – Inserindo uma imagemimagem

Page 20: Webdesigning em 30 minutos Bruno Afonso 2 Setembro 2005 Comunicar Ciência 2005

Criando um blog – finalizando a Criando um blog – finalizando a entradaentrada

Page 21: Webdesigning em 30 minutos Bruno Afonso 2 Setembro 2005 Comunicar Ciência 2005

Criando um blog – A primeira Criando um blog – A primeira entrada!entrada!

Page 22: Webdesigning em 30 minutos Bruno Afonso 2 Setembro 2005 Comunicar Ciência 2005

Blogs – A nova página pessoal?Blogs – A nova página pessoal?

Page 23: Webdesigning em 30 minutos Bruno Afonso 2 Setembro 2005 Comunicar Ciência 2005

Blogs – Um início simples para voos Blogs – Um início simples para voos mais altosmais altos

Primeiro passo para familiarização com:Primeiro passo para familiarização com: o conceito de CMSo conceito de CMS Edição de código para alterações simples (ex: alterar Edição de código para alterações simples (ex: alterar

links)links)

Primeiro passo para aprender técnicas para Primeiro passo para aprender técnicas para melhorar ou implementar novas capacidades no melhorar ou implementar novas capacidades no site:site: Layout (ex: CSS)Layout (ex: CSS) Multiplos editoresMultiplos editores ... ...

Page 24: Webdesigning em 30 minutos Bruno Afonso 2 Setembro 2005 Comunicar Ciência 2005

Ajustando o Blog...Ajustando o Blog...

Page 25: Webdesigning em 30 minutos Bruno Afonso 2 Setembro 2005 Comunicar Ciência 2005

Nomes e links úteisNomes e links úteis

Hosted webloggers:Hosted webloggers: Blogger - Blogger - http://http://www.blogger.comwww.blogger.com/ / (grátis)(grátis) Blogsome - Blogsome - http://http://www.blogsome.comwww.blogsome.com// (grátis) (grátis) TypePad - TypePad - http://http://www.typepad.comwww.typepad.com// ($-$$) ($-$$) Weblog - Weblog - http://http://weblog.com.ptweblog.com.pt// (Português, $-$$) (Português, $-$$)

Edição de imagens:Edição de imagens: Paint Shop Pro ($)Paint Shop Pro ($) Adobe Photoshop ($$$)Adobe Photoshop ($$$) Gimp (grátis, opensource)Gimp (grátis, opensource)

Page 26: Webdesigning em 30 minutos Bruno Afonso 2 Setembro 2005 Comunicar Ciência 2005

Aprofundando o tema...Aprofundando o tema...

HTML (linguagem web principal)HTML (linguagem web principal) http://www.w3schools.com/html/http://www.w3schools.com/html/ http://www.davesite.com/webstation/html/http://www.davesite.com/webstation/html/ http://www.w3.org/MarkUp/Guide/http://www.w3.org/MarkUp/Guide/

Cascaded Style Sheets (CSS) – Layout Cascaded Style Sheets (CSS) – Layout das páginasdas páginas http://www.w3schools.com/css/default.asphttp://www.w3schools.com/css/default.asp http://www.echoecho.com/css.htmhttp://www.echoecho.com/css.htm

Page 27: Webdesigning em 30 minutos Bruno Afonso 2 Setembro 2005 Comunicar Ciência 2005

That’s all folks!That’s all folks!

Too much internet can be harmful...Too much internet can be harmful...