Confira neste curso online tudo sobre a nova ferramenta da CodeGear para desenvolvimento em PHP. O Delphi for PHP chegou para ficar e neste curso nos desvendamos todos os segredos desta poderosa ferramenta. Esse cursos mostra as principais nuances da linguagem como: declaração de variáveis, estruturas de decisão, estruturas de repetição e arrays. Como se trata de uma nova linguagem no meio da comunidade Delphi, o curso mostra e enfatiza as diferenças entre as duas linguagem (Delphi e PHP) com o autor sempre fazendo analogias com a linguagem Delphi. O curso foca também no uso das Super Globais do PHP, $_SESSION, $_SERVER, $_GET, $_POST, $_ENV, $_FILES, $_COOKIE, passando por acesso a banco de dados, controles DataWare e integração com templates em HTML, vale a pena conferir
terça-feira, 20 de março de 2012
Curso Desvendando o DELPHI for PHP-ParteI
Confira neste curso online tudo sobre a nova ferramenta da CodeGear para desenvolvimento em PHP. O Delphi for PHP chegou para ficar e neste curso nos desvendamos todos os segredos desta poderosa ferramenta. Esse cursos mostra as principais nuances da linguagem como: declaração de variáveis, estruturas de decisão, estruturas de repetição e arrays. Como se trata de uma nova linguagem no meio da comunidade Delphi, o curso mostra e enfatiza as diferenças entre as duas linguagem (Delphi e PHP) com o autor sempre fazendo analogias com a linguagem Delphi. O curso foca também no uso das Super Globais do PHP, $_SESSION, $_SERVER, $_GET, $_POST, $_ENV, $_FILES, $_COOKIE, passando por acesso a banco de dados, controles DataWare e integração com templates em HTML, vale a pena conferir
Marcadores:
curso,
delphi,
php,
video aula
segunda-feira, 5 de março de 2012
Desvendando o Delphi for PHP – Curso
O Delphi for PHP chegou para ficar e neste curso nos desvendamos todos os segredos desta poderosa ferramenta. Esse cursos mostra as principais nuances da linguagem como: declaração de variáveis, estruturas de decisão, estruturas de repetição e arrays.
Como se trata de uma nova linguagem no meio da comunida de Delphi, o curso mostra e enfatiza as diferenças entre as duas linguagem (Delphi e PHP) com o autor sempre fazendo analogias com a linguagem Delphi.
Marcadores:
delphi,
download,
php,
programação
quarta-feira, 29 de fevereiro de 2012
XML
XML é uma tecnologia na verdade muito simples que tem ao seu redor outras tecnologias que
a complementam e a fazem muito maior e com possibilidades muito mais amplas. Vamos ver
ao longo de vários capítulos uma introdução ao mundo XML, ou seja, à linguagem assim como
às tecnologias que trabalham com ela, seus usos, vantagens e modos de realizar as tarefas.
XML, com todas as tecnologias relacionadas, representa uma maneira distinta de fazer as
coisas, mais avançada, cuja principal novidade consiste em permitir compartir os dados com os
quais se trabalha a todos os níveis, por todas as aplicações e suportes. Sendo assim, o XML
tem um papel importantíssimo neste mundo atual, que tende à globalização e à
compatibilidade entre os sistemas, já que é a tecnologia que permitirá compartir a informação
de una maneira segura, confiável e fácil. Ademais, XML permite ao programador e aos
suportes dedicar seus esforços às tarefas importantes quando trabalha com os dados, já que
algumas tarefas trabalhosas como a validação destes ou o percorrido das estruturas corre a
cargo da linguagem e está especificado pelo padrão, de modo que o programador não tem que
se preocupar por isso.
Vemos que XML não está só, e sim com um mundo de tecnologias ao redor dele, de
possibilidades, maneiras mais fáceis e interessantes de trabalhar com os dados e,
definitivamente, um avance na hora de tratar a informação, que é na verdade o objetivo da
informática em geral. XML, ou melhor dizendo, o mundo XML não é uma linguagem, e sim
várias linguagens, não é uma sintaxe, e sim várias e não é uma maneira totalmente nova de
trabalhar, e sim uma maneira mais refinada que permitirá que todas as anteriores se possam
comunicar entre si sem problemas, já que os dados cobram sentido.
XML é interessante no mundo da Internet e do e-bussiness, já que existem muitos sistemas
distintos que têm que se comunicar entre si, porém, como se pode imaginar, interessa
igualmente a todos os ramos da informática e o tratamento de dados, já que permite muitos
avances na hora de trabalhar com eles.
Marcadores:
xml
O que é JSP
JSP é a abreviação de Java Server Pages, que em português seria algo como Páginas de
Servidor Java. É então, uma tecnologia orientada a criar páginas web com programação em
Java. Com JSP podemos criar aplicações web que se executam em vários servidores web, de
múltiplas plataformas, já que Java é em essência uma linguagem multiplataforma. As páginas
JSP estão compostas de código HTML/XML misturado com etiquetas especiais para programar
scripts de servidor em sintaxe Java. Portanto, poderemos escrever as JSP com nosso editor
HTML/XML habitual.
Motor JSP
O motor das páginas JSP está baseado nos servlets de Java -programas em Java destinados a
se executar no servidor-, embora o número de desenvolvedores que podem afrontar a
programação de JSP é muito maior, dado que é muito mais simples de aprender que os
servlets.
Em JSP criamos páginas de maneira parecida a como se criam em ASP ou PHP -outras duas
tecnologias de servidor. Geramos arquivos com extensão .jsp que incluem, dentro da estrutura
de etiquetas HTML, as sentenças Java a executar no servidor. Antes que os arquivos sejam
funcionais, o motor JSP realiza uma fase de tradução dessa página em um servlet,
implementado em um arquivo class (Byte codes de Java). Esta fase de tradução se realiza
habitualmente quando se recebe a primeira solicitação da página .jsp, embora exista a opção
de pré-compilar em código para evitar esse tempo de espera na primeira vez que um cliente
solicita a página.Pré-requisitos
Para aprender JSP, a parte de conhecer HTML, será necessário compreender e ter algo de
experiência na programação em Java, que é uma Linguagem de Programação Orientada a
Objetos por completo. Uma vez conhecida a programação em Java pode-se estudar por alto o
sistema de Servlets, o que nos dará uma melhor idéia do funcionamento interno do motor JSP.
Ademais, necessitaremos baixar e instalar Tomcat, o contêiner de servlets usado na referência
oficial de implementação de JSP. Podemos acessar a um exercício para aprender a realizar esta
instalação, disponível também na referência de aprendizagem da página de Java.
Marcadores:
programação,
web designer
O que é PHP
PHP é o acrônimo de Hipertext Preprocesor. É uma linguagem de programação do lado do
servidor gratuito e independente de plataforma, rápido, com uma grande livraria de
funções e muita documentação.
Uma linguagem do lado do servidor é aquela que se executa no servidor web, justo antes
da página ser enviada através da Internet ao cliente. As páginas que se executam no servidor
podem realizar acessos a bases de dados, conexões em rede, e outras tarefas para criar a
página final que será vista pelo cliente. O cliente somente recebe uma página com o código
HTML resultante da execução da PHP. Como a página resultante contém unicamente código
HTML, é compatível com todos os navegadores.
Uma vez que já conhecemos o conceito de linguagem de programação de scripts do lado do
servidor podemos falar de PHP. PHP se escreve dentro do código HTML, o que o faz
realmente fácil de utilizar, assim como ocorre com o popular ASP de Microsoft, porém com
algumas vantagens como sua gratuidade, independência de plataforma, rapidez e segurança.
Qualquer pessoa pode baixar através da página principal de PHP www.php.net e de forma
gratuita, um módulo que faz com que nosso servidor web compreenda os scripts realizados
nesta linguagem. É independente de plataforma, visto que existe um módulo de PHP para
quase qualquer servidor web. Isto faz com que qualquer sistema possa ser compatível com a
linguagem e significa uma vantagem importante, já que permite levar o site desenvolvido em
PHP de um sistema a outro sem praticamente nenhum trabalho.
PHP, no caso de estar montado sobre um servidor Linux ou Unix, é mais rápido que ASP, dado que se executa em um único espaço de memória e isto evita as comunicações entre
componentes COM que se realizam entre todas as tecnologias implicadas em uma página ASP.
Por último assinalamos a segurança, neste ponto também é importante o fato de que em
muitas ocasiões PHP se encontra instalado sobre servidores Unix ou Linux, que são bastante
conhecidos como mais velozes e seguros que o sistema operativo onde se executa as ASP,
Windows NT ou 2000. Ademais, PHP permite configurar o servidor de modo que se permita ou
rejeita diferentes usos, o que pode fazer da linguagem mais ou menos segura dependendo das
necessidades de cada um.
Foi criado originalmente em 1994 por Rasmus Lerdorf, mas como PHP está desenvolvido em
política de código aberto, ao longo de sua história teve muitas contribuições de outros
desenvolvedores. Atualmente PHP se encontra em sua versão 4, que utiliza o motor Zend,
desenvolvido com maior meditação para cobrir as necessidades das aplicações web atuais.
Esta linguagem de programação está preparada para realizar muitos tipos de aplicações web
graças à extensa livraria de funções com a qual está dotada. A livraria de funções cobre desde
cálculos matemáticos complexos até tratamento de conexões de rede, podemos dar dois
exemplos.
Algumas das mais importantes capacidades de PHP são: compatibilidade com as bases de
dados mais comuns, como MySQL, mSQL, Oracle, Informix, e ODBC, por exemplo. Inclui
funções para o envio de correio eletrônico, upload de arquivos, criar dinamicamente no
servidor imagens no formato GIF, inclusive animadas e uma lista interminável de utilidades
adicionais.
Pode-se obter muito mais informações de PHP nos manuais de PHP que temos publicado em
criarweb. Manuais que atendem aos diversos níveis de cada programador:
• Programação em PHP : Aprenda PHP desde o princípio com este manual que abrange as
partes mais imprescindíveis.
• Workshop de PHP : outros artigos práticos mais avançados com a linguagem.
Marcadores:
php,
programação,
web designer
O que é ASP
ASP (Active Server Pages) é a tecnologia desenvolvida por Microsoft para a criação
de páginas dinâmicas do servidor. ASP se escreve na mesma página web, utilizando a
linguagem Visual Basic Script ou Jscript (Javascript de Microsoft).
Uma linguagem do lado do servidor é aquela que se executa no servidor web, justo antes
da página ser enviada através da Internet ao cliente. As páginas que se executam no servidor
podem realizar acessos à bases de dados, conexões em rede, e outras tarefas para criar a
página final que o cliente verá. O cliente somente recebe uma página com o código HTML
resultante da execução da página ASP. Como a página resultante contém unicamente código
HTML, é compatível com todos os navegadores. Podemos saber algo mais sobre a
programação do servidor e do cliente no artigo o que é DHTML.
Os tipos de servidores que empregam esta linguagem são, evidentemente, todos aqueles que
funcionam com sistema Windows NT, apesar de que também podemos utilizar em um PC com
windows 98 se instalamos um servidor denominado Personal Web Server. Inclusive sistemas
Linux podemos utilizar as ASP se instalamos um componente denominado Chilisoft, apesar de
que parece claro que será melhor trabalhar sobre o servidor web para o que está pensado:
Internet Information Server.
Com as ASP podemos realizar muitos tipos de aplicações distintas. Permite-nos acesso à base
de dados, ao sistema de arquivos do servidor e em geral, a todos os recursos que tenha o
próprio servidor. Também temos a possibilidade de comprar componentes ActiveX fabricados
por distintas empresas de desenvolvimento de software que servem para realizar múltiplos
usos, como o envio de correio, gerar gráficos dinamicamente, e etc.
Atualmente, já foi apresentada a segunda versão de ASP, o ASP.NET, que compreende algumas
melhoras em relação às possibilidades da linguagem e rapidez com a que funciona. ASP.NET
tem algumas diferenças em relação à sintaxe com o ASP, de modo que há de ser tratado de
formas distinta um do outro.
Marcadores:
ASP
O que é Perl
É uma linguagem de programação muito utilizada para construir aplicações CGI para o web.
Perl é a abreviação de Practical Extracting and Reporting Languaje, que indica que trata-se de
uma linguagem de programação muito prática para extrair informação de arquivos de texto e
gerar informes a partir do conteúdo dos arquivos.
É uma linguagem de livre uso, isso quer dizer que é gratuita. Antes, estava bastante associada
à plataforma Uníx, mas atualmente está disponível em outros sistemas operativos como
Windows.
Perl é uma linguagem de programação interpretada, assim como muitas outras linguagens da
Internet como Javascript ou ASP. Isto quer dizer que o código dos scripts em Perl não se
compila e sim, que cada vez que se quer executar, se lê o código e se coloca em
funcionamento o que há escrito. Ademais é extensível a partir de outras linguagens, já que
desde Perl poderemos fazer chamadas a subprogramas escritos em outras linguagens.
Também desde outras linguagens podemos executar o código Perl.
Perl está inspirado a partir de linguagens como C, sh, awk e sed (alguns provenientes dos
sistemas Uníx), mas está enfocado a ser mais prático e fácil que estes últimos. É por isso que um programador, que tenha trabalhado com a linguagem C e outras, terá menos problemas
para entendê-la e utilizá-la rapidamente. Uma diferença fundamental de Perl em relação às
outras linguagens é que não limita o tamanho dos dados com os quais trabalha, o limite o
coloca a memória que nesse momento se encontra disponível.
Se quisermos trabalhar com Perl será necessário ter instalado o intérprete da linguagem. A
partir desse momento podemos executar CGIs em nossos servidores web. O processo para
conseguir pode variar de uns servidores a outros, mas costuma-se colocar em um diretório
especial do servidor chamado cgi-bin onde colocamos as correspondentes permissões CGI.
Ademais, os arquivos com o código também deverão ter permissão de execução.
Marcadores:
designer,
programação
O que é CGI
É o sistema mais antigo que existe para a programação das páginas dinâmicas de servidor.
Atualmente se encontra um pouco defasado por diversas razões entre as quais se destaca a
dificuldade com a que se desenvolvem os programas e a pesada carga que supõem para o
servidor que os executa.
Os CGI se escrevem habitualmente na linguagem Perl, entretanto, outras linguagens como C,
C++ ou Visual Basic podem também ser empregados para construí-los.
O funcionamento básico de um programa CGI é parecido ao apontado para o conjunto das
páginas dinâmicas do servidor, com algumas particularidades.
1. Realiza-se uma petição http, a qual podem acompanhar dados que chegam ou por um
formulário, ou também através da URL.
2. O servidor executa os programas CGI aos que se acessa e trabalha com os recursos
necessários para realizar as ações, como por exemplo, as bases de dados.
3. O programa CGI vai escrevendo na saída padrão, o resultado da execução do CGI, que
inclui etiquetas HTML, já que o que se escreve é uma página web.
Algumas desvantagens da programação em CGI são as seguintes:
• Os resultados se escrevem diretamente com o CGI, portanto o código do programa se
mistura com o do HTML tornando difícil sua compreensão e manutenção.
• Cada programa CGI que se coloca em funcionamento se faz em um espaço de memória
próprio. Sendo assim, se três usuários colocam em funcionamento um CGI ao mesmo
tempo, se multiplicará por três a quantidade de recursos que ocupa esse CGI. Isto
significa uma grave ineficiência.
Marcadores:
designer,
programação
Demonstração do Jquery.
Demo 1 de jQuery
Para começar veremos este exemplo, onde temos dois botões e um texto. Ao clicar um botão,
mudaremos o texto e ao clicar o outro colocaremos outro texto distinto.
Podemos ver o exemplo em funcionamento em uma página à parte.
Neste exemplo, temos uma camada que tem este código:
<div id="camada" style="padding: 10px; background-color: #ff8800">Clique em um botão</div>
Logo, temos dois botões com estes códigos:
<input type="button" value="Botão A" onclick="$('#camada').html('Clicou no botão <b>A</b>')">
<input type="button" value="Botão B" onclick="$('#camada').html('Recebido um clique no botão <b>B</b>')">
Como se pode ver, nos botões há definido um par de eventos onclick (um em cada um) que
executam uma instrução Javascript quando se clica sobre eles. A instrução está em Javascript,
porém faz uso de algumas ferramentas disponíveis em jQuery para trabalho com os elementos
da página. Neste caso, explicando rapidamente, se faz uma seleção do elemento DIV da
camada e logo se executa um método sobre ele para mudar o conteúdo HTML do elemento.
Demo 2 de jQuery
Neste outro exemplo, veremos algo um pouquinho mais complexo. Bom, realmente não tem
maior complexidade, porém estamos utilizando jQuery de uma maneira um pouco distinta, que
requer algo mais de código por nossa parte. Agora vamos ter duas camadas em nossa página.
Uma camada estará sempre visível e a outra camada aparecerá inicialmente oculta e vamos
mostrá-la ou ocultá-la dependendo de se o usuário coloca o mouse em cima da camada que
está sempre visível.
Para se ter uma idéia exata de nosso exemplo se pode ver em uma janela à parte.
Neste segundo exemplo, temos este código HTML, com as duas camadas.
<div id="camada" style="padding: 10px; background-color: #ff8800;">Coloque o mouse em cima desta
camada</div>
<br>
<div id="mensagem" style="display: none;">Colocou o mouse em cima!! <br>(Agora tire-o da camada)</div>
Agora vamos ter um código Javascript com jQuery que defina os eventos do usuário, para
quando situa o mouse dentro ou fora da primeira camada.
$("#camada").mouseenter(function(evento){
$("#mensagem").css("display", "block");
});
$("#capa").mouseleave(function(evento){
$("#mensagem").css("display", "none");
});
Desta simples maneira, criamos dois eventos no DIV com id="camada". Ademais, definimos o
código dos eventos por meio de funções, que se encarregarão de mostrar ou ocultar a segunda
camada com id="mensagem".
$("#mensagem").css("display", "block");
Isto nos seleciona a camada com id "mensagem" e com o método css() indicamos que
queremos mudar o atributo "display" ao valor "block" desse elemento.
$("#mensagem").css("display", "none");
Esta outra linha muito similar, simplesmente muda o "display" a "none" para ocultar o
elemento.
Esperamos que estes dois exemplos sirva para ver rapidamente algumas coisas que se podem
fazer com jQuery com muito pouco esforço e que funcionam em todos os navegadores.
Marcadores:
jquery
Vantagens de jQuery com respeito a outras alternativas
É importante comentar que jQuery não é o único framework que existe no mercado. Existem
várias soluções similares que também funcionam muito bem, que basicamente nos servem
para fazer o mesmo. Como é normal, cada um dos frameworks tem suas vantagens e
desvantagens, porém jQuery é um produto com uma aceitação por parte dos programadores
muito boa e um grau de penetração no mercado muito amplo, o que faz supor que é uma das
melhores opções. Ademais, é um produto sério, estável, bem documentado e com uma grande
equipe de desenvolvedores encarregados da melhora e atualização do framework. Outra coisa
muito interessante é a dilatada comunidade de criadores de plugins ou componentes, o que
torna fácil encontrar soluções já criadas em jQuery para implementar assuntos como interfaces
de usuário, galerias, votações, efeitos diversos, etc.
Um dos competidores de jQuery, do qual já publicamos em CriarWeb.com um amplo manual
para programadores, é Mootools, que também possui vantagens similares. Este é o link ao
Manual de Mootools, que também pode ser interessante, porque certamente temos explicado
com mais detalhes que jQuery.
jQuery, é para mim?
Se estiver interessado em enriquecer sua página web com componentes da chamada Web 2.0,
como efeitos dinâmicos, Ajax, interação, interfaces de usuário avançadas, etc., jQuery é uma
ferramenta imprescindível para desenvolver todas estas coisas sem ter que se complicar com
os níveis mais baixos do desenvolvimento, já que muitas funcionalidades já estão
implementadas, ou ainda as bibliotecas do framework lhe permitirão realizar a programação
muito mais rápida e livre de erros.
Agora também, todas estas melhorias da web 2.0, que à princípio pode ser muito atrativas,
também tem têm um custo em tempo de desenvolvimento dos projetos. Sem um framework
como jQuery, o tempo de criação e depuração de todos esses componentes dinâmicos seria
muito maior, porém ainda assim ninguém diz que seja somente instalar o sistema e iniciar.
Entretanto, o mais complicado de jQuery é aprender a usá-lo, igual ao que ocorre com
qualquer outro framework Javascript. Requererá do desenvolvedor habilidades avançadas de
programação, assim como o conhecimento, ao menos básico, da programação orientada a
objetos. Uma vez aprendido as vantagens de utilizá-lo compensarão mais que de sobra o
esforço. Esperamos que com este Manual de jQuery, que estamos publicando em
CriarWeb.com possa aprender o necessário para desenvolver seus próprios componentes
dinâmicos em Javascript com os que enriquecer suas aplicações.
Podemos conhecer jQuery acessando à página de início do framework Javascript:
http://jquery.com/
Marcadores:
jquery
O que é jQuery
Para simplificar, poderíamos dizer que jQuery é um framework Javascript, porém talvez muitos
dos leitores se perguntarão o que é um framework. Pois é um produto que serve como base
para a programação avançada de aplicações, que oferece uma série de funções ou códigos
para realizar tarefas habituais. Em outras palavras, framework são umas bibliotecas de código
que contém processos ou rotinas já prontas para usar. Os programadores utilizam os
frameworks para que eles mesmos não tenham que desenvolver as tarefas mais básicas, visto
que no próprio framework já há implementações que estão provadas, funcionam e não se
necessitam voltar a programar. Por exemplo, no caso que nos ocupa, jQuery é um framework para a linguagem Javascript,
logo será um produto que nos simplificará a vida para programar nesta linguagem. Como
provavelmente saberemos, quando um desenvolvedor tem que utilizar Javascript, geralmente
tem que se preocupar por fazer scripts compatíveis com vários navegadores e para isso tem
que incorporar muito código que o único que faz é detectar o browser do usuário, para fazer
uma coisa ou outra dependendo de se é Internet Explorer, Firefox, Opera, etc. jQuery é onde
mais nos pode ajudar, visto que implementa uma série de classes (de programação orientada a
objetos) que nos permitem programar sem nos preocuparmos do navegador com o qual nos
está visitando o usuário, já que funcionam de exata forma em todas as plataformas mais
habituais.
Sendo assim, este framework Javascript, nos oferece uma infra-estrutura com a qual teremos
muito maior facilidade para a criação de aplicações complexas do lado do cliente. Por exemplo,
com jQuery obteremos ajuda na criação de interfaces de usuário, efeitos dinâmicos, aplicações
que fazem uso de Ajax, etc. Quando programemos Javascript com jQuery teremos a nossa
disposição uma interface para programação que nos permitirá fazer coisas com o navegador
que estamos certos de que funcionarão para todos nossos visitantes. Simplesmente devemos
conhecer as bibliotecas do framework e programar utilizando as classes, suas propriedades e
métodos para a execução de nossos objetivos.
Ademais, todas estas vantagens que sem dúvida são muito de agradecer, com jQuery as
obtemos de maneira gratuita, já que o framework tem licença para uso em qualquer tipo de
plataforma, pessoal ou comercial. Para isso, simplesmente teremos que incluir em nossas
páginas um script Javascript que contém o código de jQuery, que podemos baixar da própria
página web do produto e começar a utilizar o framework.
O arquivo do framework ocupa uns 56 KB, o que é bastante razoável e não atrasará o
download de nossa página (se nosso servidor envia os dados comprimidos, o que é bastante
normal, o peso de jQuery será de uns 19 KB). Além disso, nosso servidor o enviará ao cliente a
primeira vez que visite uma página do site. Nas seguintes páginas o cliente já terá o arquivo
do framework, por isso não necessitará transferi-lo e o tomará do cache. Côo o qual o
carregamento da página só se verá afetada pelo peso deste framework uma vez por usuário.
As vantagens na hora de desenvolvimento das aplicações, assim como as portas que nos abre
jQuery compensam extraordinariamente o peso do pacote.
Marcadores:
jquery,
web designer
Definir estilos em um arquivo externo CSS
Veremos agora outra maneira de importar uma declaração externa de estilos CSS: @import url
("arquivo_a_importar.css"), que se utiliza para importar umas declarações de estilos salvadas
na rota que se indica entre parênteses. (as aspas são opcionais, mas os parêntesis são
obrigatórios, pelo menos, em Explorer).
Deve-se incluir na declaração de estilos global a uma página, ou seja, entre as etiquetas
<style type="text/css"> e </style>, que se colocam no cabeçalho do documento.
É importante assinalar que a sentença de importação do arquivo CSS deve ser escrita na
primeira linha da declaração de estilos, algo parecido ao código seguinte.
<style type="text/css">
@import url ("estilo.css");
body{
background-color:#ffffcc;
}
</style>
O funcionamento é o mesmo que se escrevêssemos todo o arquivo a importar dentro das
etiquetas dos estilos, com a garantia de que, se redefinimos dentro do código HTML (entre as
etiquetas </style>) estilos que haviam ficado definidos no arquivo externo, os que se aplicarão
serão os que tivermos redefinido.
Assim, no exemplo anterior, mesmo que tivéssemos definido em estilo.css uma cor de fundo
para a página, a cor que prevaleceria seria o definido em seguida da importação: #ffffcc
A diferença entre este tipo de importação do tipo e a que vimos anteriormente:
<link rel="stylesheel" type="text/css" href="folha.css">
É que @import url ("estilo.css") costuma ser utilizado quando existe umas pautas básicas no
trabalho com os estilos (que se definem em um arquivo a importar) e uns estilos específicos
para cada página, que se definem a seguir, dentro do código HTML entre as etiquetas
</style>, como é o caso do exemplo visto anteriormente
Marcadores:
css,
web designer
Uso das CSS II
Estilo definido para toda uma página
Podemos definir no cabeçalho do documento, estilos para que sejam aplicados a toda página. É
uma maneira muito cômoda de dar forma ao documento e muito potente, já que estes estilos
continuarão em toda a página e com isso, economizaremos muitas etiquetas HTML que dão forma ao documento. Além disso, se desejamos mudar os estilos da página simplesmente
faremos de uma vez só.
Este exemplo é mais complicado visto que utiliza a sintaxe CSS de forma mais avançada. Mas
não se preocupe, pois com os exemplos você irá aprendendo seu uso e mais tarde
comentaremos a sintaxe com mais profundidade.
No exemplo vemos que se utiliza a etiqueta <STYLE> colocada no cabeçalho da página para
definir os diferentes estilos do documento.
Simplificando, entre as etiquetas <STYLE> e </STYLE>, se coloca o nome da etiqueta que
queremos definir os estilos e entre chaves -{ }- colocamos em sintaxe CSS as características
de estilos.
<html>
<head>
<title>Exemplo de estilos para toda uma página</title>
<STYLE type="text/css">
<!--
H1 {text-decoration: underline; text-align:center}
P {font-Family:arial,verdana; color: white; background-color: black}
BODY {color:black;background-color: #cccccc; text-indent:1cm}
// -->
</STYLE>
</head>
<body>
<h1>Página com estilos</h1>
Bem-vindos...
<p>Desculpe ser tão breve, mas isto é um exemplo sem importância</p>
</body>
</html>
Como se pode apreciar no código, definimos que a etiqueta <H1> se apresentará:
• Sublinhada
• Centralizada
Também, por exemplo, definimos que no corpo do texto inteiro da página (etiqueta <BODY>
serão aplicados os seguintes estilos:
• Cor do texto negro
• Cor do fundo acinzentado
• Margem lateral de 1 centímetro
Cabe destacar que se aplicamos estilos à etiqueta <BODY>, estes serão herdados pelo resto
das etiquetas do documento. Isto será sempre assim, e no caso de que não volte a definir
estes estilos nas seguintes etiquetas, dominará a etiqueta mais concreta. Este detalhe pode
ser visto na etiqueta <P>, que tem definidos estilos que já foram definidos para <BODY>. Os
estilos que são aplicados são os da etiqueta <P> que é mais concreta.
Por último, é válido apreciar os comentários HTML que englobam toda a declaração de estilos:
<!--Declaração de estilos-->. Estes comentários são utilizados para que os navegadores
antigos que não compreendem a sintaxe CSS, não incluam esse texto no corpo da página.
Caso contrário, os navegadores antigos (por exemplo Netscape 3) escreveriam esse "feio
código" na página.
Estilo definido para todo o site web
Uma das características mais potentes da programação com folhas de estilo, consiste em que
podemos definir os estilos de todo um site web de uma só vez. Isto se consegue criando um
arquivo onde somente colocamos as declarações de estilos de página e linkando todas as
páginas do site com esse arquivo. Dessa forma, todas as páginas compartem uma mesma
declaração de estilos e, portanto, se a mudamos, mudarão todas as páginas. Todas as
vantagens acrescentadas de que se economiza em linhas de código HTML (o que reduz o peso
do documento) e se evita a moléstia de definir uma e outra vez os estilos com o HTML, tal
como foi comentado anteriormente.
Veremos agora como o processo para incluir estilos com o arquivo externo.
1 - Criamos o arquivo com a declaração de estilos
É um arquivo de texto normal, que pode ter qualquer extensão, apesar de podermos atribuir a
extensão .css para lembrarmos que tipo de arquivo é. O texto que devemos incluir deve ser
escrito exclusivamente em sintaxe CSS, ou seja, seria errado incluir o código HTML nas
etiquetas e etc. Podemos ver um exemplo a seguir:
P {
font-size : 12pt;
font-family : arial,helvetica;
font-weight : normal;
}
H1 {
font-size : 36pt;
font-family : verdana,arial;
text-decoration : underline;
text-align : center;
background-color : Teal;
}
TD {
font-size : 10pt;
font-family : verdana,arial;
text-align : center;
background-color : 666666;
}
BODY {
background-color : #006600;
font-family : arial;
color : White;
}
2 - Linkamos a página com a folha de estilos
Para isso, vamos colocar a etiqueta <LINK> com os atributos:
Marcadores:
css,
web designer
Uso das CSS I
Vamos agora descrever os diferentes usos das CSS introduzidos no
capítulo anterior. Vamos por ordem descrevendo os pontos segundo
sua dificuldade e importância.
Dividimos este capítulo em duas partes por sua extensão e por haver várias formas distintas
de aplicar estilos. Aqui veremos as mais simples e no capítulo seguinte outras mais
complicadas, mas mais potentes.
Pequenas partes da página
Para definir estilos em seções reduzidas de uma página se utiliza a etiqueta <SPAN>. Com
seu atributo style indicamos em sintaxe CSS as características de estilos. Vemos com um
exemplo, colocaremos um parágrafo onde vamos visualizar determinadas palavras na cor verde.<p>
Isto é um parágrafo com várias palavras <SPAN style="color:green">de cor verde</SPAN>. é muito fácil.</p>
Que tem como resultado:
Isto é um parágrafo com várias palavras de cor verde. É muito fácil.
Estilo definido para uma etiqueta
Deste modo podemos fazer com que toda uma etiqueta mostre um estilo determinado. Por
exemplo, podemos definir um parágrafo inteiro de cor vermelha e outro de cor azul. Para isso,
utilizamos o atributo style, que é admitido por todas as etiquetas do HTML (sempre e quando
dispormos de um navegador compatível com CSS).
<p style="color:#990000">
Isto é um parágrafo de cor vermelha.
</p>
<p style="color:#000099">
Isto é um parágrafo de cor azul.
</p>
Que tem como resultado:
Isto é um parágrafo de cor vermelha.
Isto é um parágrafo de cor azul.
Estilo definido em uma parte da página
Com a etiqueta <DIV> podemos definir seções de uma página e aplicar estilos com o atributo
style, ou seja, podemos definir estilos de uma só vez a todo um bloco da página.
<div style="color:#000099; font-weight:bold">
<h3>Estas etiquetas vão em <i>azul e negrito</i></h3>
<p>
Continuamos dentro do DIV, por isso permanecem os
estilos.
</p>
</div>
Que tem como resultado:
Estas etiquetas vão em azul e negrito
Continuamos dentro do DIV, por isso permanecem os estilos.
Marcadores:
css,
web designer
Características e vantagens das CSS
A forma de funcionamento das CSS consiste em definir, mediante uma sintaxe especial, a
forma de apresentação que lhe aplicaremos a:
• Um web inteiro, de modo que se pode definir a forma de todo o web de uma vez só.
• Um documento HTML ou página, que se pode definir a forma, em um pequeno pedaço
da página.
• Uma porção do documento, aplicando estilos visíveis em um pedaço da página.
• Uma etiqueta em concreto, chegando inclusive a poder definir vários estilos diferentes
para uma só etiqueta. Isto é muito importante já que oferece potência em nossa
programação. Podemos definir, por exemplo, vários tipos de parágrafos: em vermelho,
em azul, com margens, sem margens...
A potência da tecnologia é óbvia. Mas não fica só por aqui, já que ademais esta sintaxe CSS
permite aplicar o documento formato de forma muito mais exata. Se antes o HTML ficava curto
para planejarmos as páginas e teríamos que utilizar truques pra conseguir nossos efeitos, agora temos muitas mais ferramentas que nos permite definir esta forma.
• Podemos definir a distância entre as linhas do documento.
• Pode-se aplicar recuo às primeiras linhas do parágrafo.
• Podemos colocar elementos na página com maior precisão, e sem lugar para erros.
• E muito mais, como definir a visibilidade dos elementos, margens, sublinhados,
riscados...
E continuamos mostrando vantagens, já que com o HTML somente podíamos definir atributos
nas páginas com pixels e porcentagens, agora podemos definir utilizando muito mais unidades
como:
• Pixels (px) e porcentagem (%), como antes.
• Polegadas (in)
• Pontos (pt)
• Centímetros (cm)
Navegadores que o suportam
Esta tecnologia é bastante nova, porém nem todos os navegadores a suportam. De fato,
somente os navegadores de Netscape versões da 4 em diante e de Microsoft a partir da versão
3 são capazes de compreender os estilos em sintaxe CSS. Ademais, cabe destacar que nem
todos os navegadores implementam as mesmas funções de folhas de estilos, por exemplo,
Microsoft Internet Explorer 3 não suporta nada em relação a camadas.
Isto quer dizer que devemos usar esta tecnologia com cuidado, já que muitos usuários não
poderão ver os formatos que apliquemos às páginas com CSS. Sendo assim, utilizem as folhas
de estilos quando estas não forem a supor causar um problema.
Marcadores:
css,
web designer
Introdução às CSS
A linguagem HTML está limitada na hora de aplicar forma a um documento. Isto é assim
porque foi concebido para outros usos (sobretudo científicos), diferente dos atuais, que são
muito mais amplos.
Para solucionar estes problemas, os web designers utilizaram técnicas tais como a utilização de
tabelas imagens transparentes para ajustá-las, a utilização de etiquetas que não são padrões
do HTML e outras. Estas "trapaças" causaram muitas vezes problemas nas páginas na hora de
sua visualização em distintas plataformas.
Ademais, os desenhadores se viram frustrados pela dificuldade com a qual, mesmo utilizando
estes truques, encontravam-se planejando páginas sobre o papel, onde o controle sobre a
forma do documento é absoluto.
Finalmente, outro antecedente que fez necessário o desenvolvimento desta tecnologia consiste
em que as páginas web têm misturado em seu código HTML o conteúdo do documento com as
etiquetas necessárias para lhe dar forma. Isto tem seus inconvenientes já que a leitura do
código HTML se faz pesada e difícil na hora de buscar erros ou depurar as páginas. Mesmo que
do ponto de vista da riqueza da informação e a utilidade das páginas na hora de armazenar
seu conteúdo, é um grande problema que estes textos estejam misturados com etiquetas
incrustadas para dar forma a estes: degrada-se sua utilidade.
Nestas páginas de CSS pretendemos tornar conhecida a tecnologia com um enfoque prático
para que em poucos capítulos você possa usar as CSS de forma depurada, refletindo toda
nossa experiência em seu uso. Não pretendemos explorar todos os aspectos da tecnologia já
para realizar isto necessitaríamos uma extensão do livro inteiro.
Marcadores:
css,
web designer
O arquivo httpd.conf do Apache.
O arquivo httpd.conf é o arquivo principal de configuração do Apache, se encontra dentro do
diretório Conf, no diretório de instalação do Apache.
Em primeiro lugar, há que destacar que o arquivo está dividido em três seções, que são:
1º Parâmetros globais
2º Diretivas de Funcionamento
3º Host Virtuais
No arquivo se encontram todos os parâmetros de funcionamento do Apache. Alguns
parâmetros são gerais para a instalação e funcionamento do Apache. Muitos dos outros
parâmetros se podem configurar independentes para um conjunto de diretórios e/ou arquivos.
Nestes casos, os parâmetros se encontram localizados dentro de seções onde se indica o
âmbito de aplicação do parâmetro.
As seções mais importantes são:
<Directory> : Os parâmetros que se encontram dentro desta seção, só se aplicarão ao
diretório especificado e a seus subdiretórios.
<DirectoryMatch>: Igual ao Directory, porém aceita no nome do diretório expressões
regulares.
<Files>: Os parâmetros de configuração proporcionam controle de acesso dos arquivos pelo
seu nome.
<FilesMatch>: Igual ao Files, porém aceita expressões regulares no nome do arquivo.
<Location>: Proporciona um controle de acesso dos arquivos por meio da URL
<LocationMatch>: Igual ao Location, porém aceita expressões regulares no nomes do
arquivo.
Algumas vezes as diretivas de funcionamento das seções anteriores se podem cruzar em cujo
caso tenha a seguinte ordem de preferência:
1. <Directory> e .htaccess (.htaccess prevalece frente a <Directory>)
2. <DirectoryMatch> e <Directory>
3. <Files> e <FilesMatch>
4. <Location> e <LocationMatch>
Também há que destacar, que o arquivo contém vários comentários para sua correta utilização,
as linhas comentadas aparecem com o símbolo #.
Marcadores:
apache,
programação
Estrutura da instalação de Apache
Uma vez instalado o Apache, no diretório raiz da instalação, se encontrarão os seguintes
diretórios:
bin: arquivos executáveis do Apache.
conf: arquivos de configuração do servidor.
error: arquivos com as mensagens de erro do servidor, em várias linguagens.
htdocs: diretório raiz padrão do servidor (Salvam-se as páginas Web).
icons: diretório onde se encontram os ícones que o servidor utiliza (entre outras cosas para
mostrar estruturas de diretórios).
logs: diretório onde se armazenam os registros de acesso e erros do servidor.
manual: diretório onde se encontra o manual do Apache.
proxy: Diretório com os arquivos do cache do servidor.
Basicamente, as configurações do servidor residem dentro de dois arquivos, o de configuração
principal que se encontra dentro da pasta conf, com o nome httpd.conf, ou dentro de um
arquivo com o nome .htaccess que se pode encontrar dentro de qualquer diretório que se
encontre mapeado dentro do servidor. Dentro de cada um destes arquivos se localizam as
diretrizes de configuração. Muitas destas diretrizes de configuração se podem encontrar tanto
dentro do arquivo de configuração principal como dentro de um arquivo .htaccess. Os valores
das diretrizes que se encontram dentro de um arquivo .htaccess, prevalecem frente aos
valores de configuração especificados dentro do arquivo httpd.conf.
Marcadores:
apache,
programação
Instalação de Apache em Windows
O processo para instalar Apache em Windows é muito simples. Mais adiante, é possível que a
configuração do servidor possa se complicar um pouco, entretanto, se desejarmos utilizá-lo
com as funções habituais, não teremos maiores problemas em nenhum momento.
Download de Apache
O servidor web Apache pode ser baixado na página da Fundação Apache, em apache.org. Na
URL http://httpd.apache.org/ têm uma seção em particular para o servidor HTTP (Protocolo de
transmissão utilizado na web), na que teremos que buscar o link para download.
Uma vez na página de download devemos buscar a última versão estável ou a versão
recomendada. O servidor está disponível para sistemas Unix ou Windows, portanto nos
oferecerão diversas opções de download, inclusive para obter o código fonte do programa. Se
desejarmos instalá-lo em um sistema Windows, necessitaremos obter o arquivo Win-32 Binary,
que é um instalador Windows.
Instalação
Uma vez baixado, devemos instalá-lo em nosso sistema, executando o arquivo obtido.
Daremos passo a um assistente que nos guiará no processo de instalação do servidor. Durante
o processo nos perguntará o nome do domínio e do servidor, que podemos preencher com
"localhost". Pedirá também um endereço de e-mail, que podemos preencher com qualquer um
que desejarmos. Também nos pergunta se desejamos que o servidor responda no porto 80
para todos os usuários ou se desejamos que só se ative para o usuário atual no porto 8080,
quando se inicie manualmente. O normal é que o ativemos para todos os usuários.
Com estes dados o Apache fica inicialmente configurado. Em qualquer momento podemos
editá-los ao nosso gosto ou necessidades. Para isso, deveremos editar o arquivo httpd.conf,
que se encontra no diretório de instalação de Apache, que indicamos durante o processo de
instalação, mais concretamente, no subdiretório conf. Mais adiante neste manual poderemos
aprender as configurações mais habituais.
Nota: Devemos ir com cuidado de não ter outro servidor configurado para trabalhar no porto 80 (por
exemplo, o servidor IIS que vem as versões profissionais ou servidor de Windows). No caso de ter em
funcionamento outro servidor web durante a instalação, pode falhar e nos mostrar uma mensagem de
erro que indique isto precisamente, ou seja, que não podemos ter dois servidores ao mesmo tempo no
porto 80.
Para solucionar o problema basta com que paremos o IIS ou o outro servidor que estiver funcionando. O
IIS pode ser parado acessando ao Painel de controle - Ferramentas administrativas - Serviços de Internet
Information Server. A tela que sai é o console de administração do sistema. Aqui devemos desdobrar o
select da esquerda, clicando sobre o signo "+", até que encontremos o "website pré-determinado".
Colocamos em cima dele e apertamos o botão de STOP que está situado na barra de ferramentas do
console de administração. Também podemos encontrar uma opção para deter o serviço clicando com o
botão direito no "website pré-determinado".
Uma vez instalado, o Apache entra em funcionamento. Para controlar o Apache podemos
encontrar no botão de início, em programas, um novo grupo chamado "Apache HTTP Server",
com ícones para deter o servidor, colocá-los em funcionamento, editar o arquivo de
configuração httpd.conf ou para ver os logs de acesso. Também podemos ver na barra de
tarefas um novo ícone que indica que o Apache está funcionando e que oferece opções para
controlá-lo se clicarmos sobre ele.
Ver se está funcionando
Para comprovar que o servidor está ativo e funciona corretamente podemos abrir um
explorador e provar acessar à URL http://localhost, que é nosso próprio servidor. Se tudo tiver
ido bem observaremos a mensagem de boas vindas do servidor com algo como "Funciono! O
servidor Apache foi instalado nesta máquina!".
Marcadores:
apache,
programação
Assinar:
Postagens (Atom)
TecCodigos Copyright © 2011 | Template created by O Pregador | Powered by Blogger