O Aprender WebDesign tem nova casa!!!

É verdade, o Aprender WebDesign mudou-se de sítio e neste momento encontra-se em http://www.aprenderwebdesign.com/
Decidi mudar de plataforma neste caso para o Wordpress, para quem não sabe o que é o WordPress leiam o Post que coloquei sobre este tema.
Optei por manter o layout visto que neste momento não quis mudar muito o visual do Blog pois penso que este visual é algo de diferente dos Blogs que existem. Em breve colocarei um Post sobre as conclusões deste Blog enquanto viveu no Blogspot...
Visitem o Blog e digam o que acham.

Pedro Santos

Alojamento Gratis!

O Alojagratis.org disponibiliza um serviço de alojamento gratuito para todos os utilizadores que não têm condições para obter um Alojamento/Servidor.
Para obteres uma conta gratis basta apenas fazer 5 Posts úteis ao fórum, se quiseres saber mais segue este link.
Gostaria de dar os parabéns ao Alojagratis pois é de louvar este tipo de iniciativas na net, principalmente quando esta faz hoje 2 anos!
Para quem gosta de participar em concursos e quiser apoiar esta iniciativa passem pelo site pois existe lá um pequeno prémio para quem ganhar...
PARABÉNS Alojagratis.org !!!

Pedro Santos

O que é o Joomla?

Após uma procura sobre a melhor maneira de desenvolver um site de raiz encontrei uma solução muito interessante que passo a explicar.

Como já tinha referido anteriormente, um CMS (Content Managment System) é um sistema bastante simplificado que permite contruir e gerir sites e portais.

Este tipo de sistema é usado para organizar, gerir e facilitar a criação colaborativa de documentos, portais e outros conteúdos.Assim, temos vários tipos de modelos contruídos a partir deste conceito sendo um deles o mais conhecido, o JOOMLA.

No fundo, o Joomla é um sistema de código aberto, sem qualquer custo para uma grande comunidade de utilizadores espalhados pelo mundo.

Este sistema possui uma grande vantagem que é a sua facilidade de incluir novas funcionalidades num website ou portal. Para isso existem milhares de colaboradores/desenvolvedores em todo o mundo que criam módulos e componentes que são adicionados a uma aplicação Joomla.

Para quem pretende saber um pouco mais acerca do Joomla clique neste artigo de Helio Wakasugui.

Algumas das principais características do Joomla são:

• Código aberto (Licença GPL);

• Sistema simples de fluxo de aprovação;

• Arquivamento para conteúdo não utilizados (Lixeira);

• Gerenciamento de banners;

• Sistema de publicação para o conteúdo;

• Sumário de conteúdo no formato RSS;

• Busca otimizada (qualquer palavra registrada);

• Frontend já traduzido em várias línguas;

• Fácil instalação para novos templates, módulos e componentes;

• Hierarquia para grupos de usuários;

• Estatísticas básicas de visitantes (existem módulos mais complexos que podem ser adicionados);

• Editor de conteúdo WYSIWYG;

• Sistema de enquete simples (com acompanhamento de resultado em tempo real);

• Sistemas de índices de avaliação;

• Extensões livres em diversos sites (Módulos, Componentes, Templates, Traduções).

E vocês perguntam que Módulos é que podem-se adicionar ao Joomla?

Pois bem aqui vão alguns exemplos:

• Geradores dinâmicos de formulários

• Fluxos de trabalho de empresas e negócios

• Gestão de documentos

• Galerias de Imagem e Multimédia

• Sistemas de Comércio Electrónico

• Fórums e Chats

• Calendários

• Blogs

• Serviços de Directório

• Newsletters

• Gestão de Dados e Relatórios

• Controlo de Banners

Se quiserem mais exemplos cliquem neste link onde podem ser encontradas mais extensões do Joomla.

Existem muitos sites que abordam este tema mas um dos melhores é mesmo esta página.
Ao nível nacional existe um portal dedicado ao Joomla, é o Joomlapt.

Nesse site pode encontrar tudo o que necessita para trabalhar com este CMS. O grupo que mantêm o site é responsável pela tradução do Joomla em língua Portuguesa pelo que disponibiliza um fórum onde os utilizadores podem colocar as suas dúvidas bem como pela partilha de alguns manuais e informações.

Para quem pretende assistir a alguns tutoriais vídeo aqui ficam alguns links bastante úteis para quem gosta de visualizar este tipo de ajuda:

• Instalação do Joomla em um servidor local Video-tutorial

• Administrar Itens de menu no Joomla - video-aula - 1ª Parte
• Administrar Itens de menu no Joomla - video-aula - 2ª Parte

• Gerenciar Modulos no Joomla em vídeo-tutorial
• Instalação de Plugins e tradutor Pt_BR JCE Editor
• Instalando JCE Editor em vídeo-aula

• Criar Seções, Categorias e artigos no Joomla

Bom espero que estas dicas tenham sido bastante úteis para quem pretende JOOMLAR!

Bons Sites!
Pedro Santos

O que é o WordPress?

Após algumas pesquisas descobri um gestor de conteúdos muito interessante (CMS - Content Management System) para a criação de Blogs. Acho este sistema muito interessante pelo que estou interessado em aplica-lo num próximo Blog. Muitos de vocês perguntam o que é o WordPress?
Pois bem, WordPress é um sistema de gerência de conteúdos na web, escrito em PHP e corrido em MySQL, especialmente para a criação de blogs. WordPress foi criado a partir do já desaparecido b2/cafelog e é hoje, junto com o Movable Type, o mais popular na criação de Weblogs. As causas do seu rápido crescimento são, entre outras, seu tipo de licença (de código aberto), sua facilidade de uso e suas características como gerenciador de conteúdos. Criado por Ryan Boren e Matthew Mullenweg, é distribuído sob a GNU General Public License sendo gratuito.

Características:

• Gera XML, XHTML, e CSS em conformidade com os padrões W3C

• Gerenciamento de ligações integrado

• Estrutura de permalink amigável aos mecanismos de busca

• Suporte extensivo a plug-ins

• Categorias aninhadas e múltiplas categorias para artigos

• TrackBack e Pingback

• Filtros tipográficos para formatação e estilização de texto corretas

• Páginas estáticas

• Múltiplos autores

Aqui ficam alguns links de destaque:

• Manual Ilustrado de Instalação do WordPress
• Guia de Instalação WordPress
  
• Comunidade Portuguesa WordPress (Blog)
• Blog WordPress (Português)
• 100 Excelentes Temas WordPress

Espero que estas dicas tenham sido úteis na criação dos Próximos Blogs.
Bons Blogs!

Pedro Santos

Dez dicas para um bom Web Design...

Após algum estudo sobre os tópicos mais importantes para a concepção de um bom Website, apresento uma compilação das 10 melhores dicas para um bom Web Design:

1. Colocar o nome e o logotipo em todas as páginas e fazer no logo um link para a página inicial (excepto na própria página inicial onde o logotipo não deve jamais ter um link para a própria página).
2. Disponibilizar uma opção de pesquisa se o site tiver mais de 100 páginas.
3. Escrever cabeçalhos e títulos simples e directos que expliquem claramente qual o conteúdo da página e que faça sentido quando é lido fora do contexto desta, através de uma busca.E
4. Estruturar a página para facilitar o scanning e ajudar os utilizadores a ignorar blocos maçadores da página num simples piscar de olhos: por exemplo através da utilização de agrupamentos e subtítulos a partir de uma longa lista poder-se-á chegar rapidamente a uma lista mais pequena e perceptivel.
5. Em vez de colocar tudo sobre um produto ou um assunto numa única e infinita página, deve-se utilizar hipertexto para estruturar o espaço disponível na página inicial que disponibiliza uma visualização e várias páginas secundárias que focalizam-se no seu tema específico. O objectivo é permitir aos utilizadores evitar desperdiçar tempo nos sub-temas que não lhes interessam.
6. Usar fotografias de produtos, mas evitar páginas cheias dessas mesmas fotografias com toda a família de produtos possíveis. Deve-se então ter uma pequena fotografia de cada produto numa página individual e fazer um link dessa fotografia para uma ou mais fotografias de maior dimensão que mostre mais detalhes adequados às necessidades dos utilizadores. Esta situação varia de acordo com o tipo de produto. Alguns produtos poderão ainda necessitar de fotografias com zoom ou rotativas. devendo estas opções ser remetidas para páginas secundárias. A primeira página que contém o produto deve ser rápida e limitada a um plano da fotografia reduzido.
7. Utilizar uma imagem reduzida e relevante quando se preparam pequenas fotografias e imagens: em vez de simplesmente redimensionar a imagem original para uma pequena e ilegível fotografia, deve-se fazer um zoom dos detalhes mais relevantes e utilizar uma solução combinada de corte e redimensionamento.
8. Utilizar link's com títulos para permitir ao utilizador, visualizar antecipadamente para onde se encaminhará cada link antes de clicar.
9. Assegurar que todas as páginas importantes estão acessíveis aos utilizadores com deficiências, especialmente aos invisuais.
10. Fazer o mesmo que os outros fazem: se a maioria dos grandes websites fizer algo de certa forma, devemos segui-los desde que os utilizadores esperem que o site funcione da mesma forma. Deve-se ter em conta que os utilizadores gastam a maioria do seu tempo noutros sites, e é ai que criam expectativas acerca do funcionamento da web.
    

Para finalizar, espero que estas dicas possam servir de referência num futuro Website.

Bons Sites!

Pedro Santos

Tecnologia, Informática e Dinheiro

Esta noite dediquei-me à pesquisa de blogs em português relacionados com a Tecnologia, Internet, Blogs. Encontrei um bastante inetressante chamado Tecno Blog criado por Sérgio Alex. Achei o seu conteúdo bastante interessante e tem como objectivo o de proporcionar informações credíveis aos seus leitores.Entre outros assuntos aquele que me cativou foi um post sobre ganhar dinheiro. Aconselho a todos os que pretendem obter estas informações no Blog do Sérgio Alex e que se subscrevam o RSS do site.
Pedro Santos

Melhorar o tempo de carregamento de uma página!

Uma das grandes preocupações no acesso de uma página é o tempo de acesso.

Quanto mais "pesada" é a página, mais lenta ela se torna. As causas poderão ser várias, um template mal estruturado, um código CCS não optimizado, muitos widgets na sidebar (botões gráficos na barra lateral), imagens não optimizadas em tamanho ou em definição, javascript, flash...Uma coisa é certa, ou a página é relativamente rápida ou então corre-se o risco de perder utilizadores dessa mesma página.Assim, existem muitas ferramentas para testar o carregamento de páginas, uma dessas ferramentas encontra-se no site SpeedTester.

A sua utilização é bastante simples, basta digitar o endereço do seu site/blog (URL), o código de confirmação e clicar em CHECK! Este site irá criar um relatório para o tempo de abertura da página analizada. O ideal é que a página abra em menos de 6 seg. para uma ligação telefónica (56k).
Para melhorar o tempo de acesso de um determinado podemos verificar o seguinte:

1-Optimizar as METATAGS
Utilize apenas as METATAGS importantes para a indexação do seu Site/Blog. As METATAGS mais importantes são as Metatag Title (nome do site), Description (descrição do site, conteúdo para as buscas) e Keywords (palavras-chave).Outras metatags importantes são a verificação de motores de busca (ex. Google e Yahoo!) e a metatag robots.

2-Eliminar os espaços em branco no código do template
É verdade! os espaços em branco do template ocupam espaço no ficheiro!

3-Optimizar o código CSS (style) do template
Nos sites CleanCSS e/ou CSSTweaks é possível optimizar o código CSS online. Há opções para optimização simples (somente abreviatura dos parâmetros), optimização normal (deixa cada classe numa única linha) e optimização profunda (deixa tudo numa única linha).

4-Deixar os códigos em javascript em arquivos externos (fora do template)
Em vez de adicionar os códigos javascript na secção HEAD do template, adicione páginas externas. Isto contribui para que o Site/Blog carregue mais rápidamente.Exemplo disso faça o seguinte: pegue no código javascript e coloque no bloco de notas. Salve o ficheiro com o nome de javascript.js e coloque esse arquivo na directoria do site. Por fim adicione o seguinte código na secção HEAD:
script language=”JavaScript” src=”http://seu-site-grátis.com/seu-javascript.js” type=”text/javascript”

5-Deixar o arquivo CSS em arquivo Externo
Faz-se igualmente como no tópico anterior e coloca-se o código CSS no bloco de notas. De seguida grava-se o ficheiro "seu_estilo.css" e coloca-se na directoria do seu site. Por fim coloque na secção HEAD o seguinte código:
link rel=”stylesheet” type=”text/css” href=”http://seu-site-grátis.com/seu-estilo.css” /

6-TABLELESS
Tabeless significa sem tabelas num template. As Tags TABLE, TR, TD não serã mais utilizadas pois geram um enorme espaço branco no HTML e provocam o carregamento de um site mais lento. Utiliza sempre de preferência o trabalho com CSS

7-Diminuir os comentários do código do template
O template que possui vários comentários do tipo :/****início do cabeçalho***/, /***início do código***/, ???Se sabe o que cada código do template faz, não serão necessários esses comentários. Apague-os deixando o código mais leve.

8-Usar a barra "/" no fim dos directórios em endereços URL
Esta dica parece simples mas faz muita diferença! Abrir um Site/Blog com http://teublog.blogspot.com/ abre de forma mais rápida que http://teublog.blogspot.com/

9-Definir sempre a altura e largura das Imagens
Inserir uma imagem no Site/Blog sem os atributos de WIDTH e HEIGHT (largura e altura) obriga a quem navega "calcular" essas medidas, deixando o carregamento de páginas mais lento. Defina sempre esses parâmetros dentro da tag IMG SRV e veja o seu Site/Blog carregar de forma mais rápida!

10-Usar miniaturas nas imagens
Utilizar imagens em miniaturas deixa o Site/Blog com um look mais profissional e permite que a abertura das páginas se faça de um modo mais rápido. Se o leitor quiser visualizar a imagem no seu tamanho real, basta clicar sobre a miniatura. Tanto o Blogger como o WordPress têm suporte para o uso de miniaturas. Se pretende mostrar a imagem com o seu tamanho real utiliza a função "Resize" num editor de imagens do tipo Photoshop, GIMP, PSP...

11-Não usar Flash
Um efeito flash é muito engraçado mas será mesmo necesário? Lembre-se que a utilização deste tipo de animações "Consomem" espaço tornando o site mais "pesado"


Existem outras dicas para optimizar um Site/Blog, entretanto estas 11 são suficientes para melhorar o seu desempenho.
Boas Optimizações!
Pedro Santos

Criar a primeira Página na Internet...

O que é necessário para fazer páginas na internet? Há uns meses atrás fiz esta pergunta, precisava de fazer um site e nunca tinha trabalhado a sério nesta área. Assim, após algum tempo de pesquisas apresento um resumo para quem está interessado em conceber um site e tem ainda muitas dúvidas.

Em primeiro lugar gostaria de apresentar algumas fontes de pesquisa bastante úteis. Um dos sites mais interessantes no ponto de vista de Informação em Português é o http://www.apostilando.com/ , este site aborda através de Tutoriais/Sebentas (apostilas denominação Brasileira) os diversos temas para quem pretende fazer um site. Estes Tutoriais encontram-se bastante bem descritos e aplicam-se a todos aqueles que se iniciam bem como para os utilizadores mais avançados. Outra maneira de aceder a informação de um modo diferente (e-learning) é através de aulas virtuais ou video aulas (designação Brasileira). Estas encontram-se espalhadas pela net entre eles no youtube.com , exemplo disso é esta aula: http://www.download-de-videos.com/ver.php?video=d76PlbaeRZM

Agora passo a descrever quais as ferramentas necessárias para construir um site:
1.Editor WEB
Dreamweaver(Pago) Frontpage(Pago) KOMPOZER(Gratuito)
2.Editor de imagens
Photoshop(Pago) ou GIMP(Gratuito)
3.Cliente de FTP
FILEZILLA(Gratuito)
4.WebServer (Apache+PHP+MySQL)
XAMMP(Gratuito)

Os requisitos para fazer uma página são:
1.Saber um pouco da linguagem HTML
2.Edição de imagem utilizando programas tipo Photoshop
3.Saber utilizar um cliente de FTP (File Transfer Protocol)

Começando com o HTML
Para começar é necessário editar um ficheiro em html (texto), esse ficheiro irá conter todo um conjunto de instruções que farão que o conteúdo de uma página apareça no seu Browser. Para mais informações acerca desta linguagem consulte este ficheiro: Primeiro arquivo HTML
É claro que se possuir o Dreamweaver ou o Frontpage esta tarefa poderá ser muito simplificada pois poderemos editar este ficheiro em modo Gráfico e construiremos uma página como se estivessemos editar um documento tipo no MS Word. Neste exemplo seguite é mostrado como se constroi um site em Dreamweaver em modo gráfico. TUTORIAL DE DREAMWEAVER

Edição de Imagem
Para utilizar um editor de imagem é preciso praticar umas quantas vezes até conseguirmos estar a vontade com este software. Existem muitos tutoriais na net sobre este tipo de software por isso não será difícil ficar à vontade para utilizar este programa. Aqui vai um link de um vídeo a exemplificar a utilização do GIMP e do PHOTOSHOP. GIMP TUTORIAL
PHOTOSHOP TUTORIAL

Publicação do Site
Um site para estar visível necessita de estar instalado num servidor. Assim, podemos publicar o nosso site em dois tipos de servidores, servidores locais ou servidores remotos. Um servidor local é por exemplo o nosso computador com uma aplicação tipo APACHE em que permite transmformar o nosso computador num servidor de HTML. Para isso devemos instalar essa aplicação e instalar a nossa página numa directoria dentro da aplicação Apache. Ao executar o Apache temos a nossa aplicação disponível no nosso servidor.
Se quiseremos ter a nossa página disponível para toda a WEB temos que alugar um espaço num servidor remoto. Existem montes de empresas a disponibilizarem os seus serviços de modo a permitirem que os utilizadores possam disponibilizar as suas páginas na net. Neste blog ALOJAMENTO-WEB temos referência de várias empresas de alojamento de sites que permitem efectuar esse serviço. Na minha opinião tenho trabalhado com a WEBHS e tenho tido boa impressão do seu serviço. Ter em atenção que estas empresas oferecem vários pacotes consoante o tipo de utilização do cliente, estes diferem entre si do tráfego, capacidade, serviços prestados etc...
Para colocar o nosso site num servidor remoto precisamos de um cliente de FTP (File Transfer Protocol), no meu caso utilizo o Filezilla, para mim é o melhor software gratuito de FTP disponível na net.
Nestes seguintes links estarão alguns tutoriais de ajuda para a utilização do Filezilla:
Como enviar arquivos para o servidor via FTP
Video Tutorial FTP (FileZilla)
Vários Videos Tutoriais do Filezilla

Espero que este Post tenha ajudado quem esteja iniciar-se nesta àrea, claro que tudo aqui que foi escrito foi tratado de uma forma muito superficial pelo que estou aberto a dúvidas e questões que possam ser tratadas ao meu nível.
Bons Sites!

Pedro Santos

Primeiros Sites...

Neste momento tenho realizados 2 sites:

O primeiro é o http://www.impressaotua.com.pt/

Este site surgiu através de um pedido de um grupo de amigos que tinha um projecto e que necessitava de divulgação na WEB. Como esta esta banda é de excelente qualidade (penso que foi um bom ponto de partida a divulgação desta bem como do serviço prestado visto que o seu produto é bastante credível e de boa qualidade) os resultados neste momento são muito positivos revelando que a web é um excelente meio de divulgação

quando bem explorado.

O segundo site é o http://www.w3d.webhs.pt/

Este site surgiu no seguimento do anterior, isso nota-se pelo seu layout (aparência). Decidi criar este visto que o primeiro tinha sido bastante bem recebido e fiquei motivado de modo a representar-me na web. Neste momento posso dizer que o tempo médio utilizado na concepção de cada um dos sites foi cerca de uma semana.

Estes sites foram concebidos e publicados no princípio de Novembro de 2007.

Quanto aos passos da concepção e publicação destes sites irão ser publicados num próximo post.

Até breve!

Pedro Santos

Hello World !!!

Decidi criar este Blog de modo a dar um contributo a todos os iniciantes nesta área. Comecei a interessar-me na concepção de páginas WEB há relativamente pouco tempo e a minha intenção é partilhar todos os meus conhecimentos adquiridos com outros webdesigners/programadores aprendendendo novas técncias desde as mais básicas às mais avançadas. Neste momento considero-me um iniciante na àrea pelo que certas técnicas aqui expressas serão das mais básicas. De qualquer modo admito que poderemos evoluir neste blog para técnicas mais avançadas. Espero que haja a contribuição de todos aqueles que visualizem este blog de modo a criar neste sítio um espaço de lazer e aprendizagem.

Fico à espera dos vossos comentários!

Pedro Santos