|
Perfil
kevin
Meu Perfil
Palavras-Chave
links
Favoritos
Não há favoritos.
adicionar aos meus favoritos
Colaboradores do Blog
almeida
Comunidades
Mude a cara de seu blog
Posts Anteriores
Na Ativa
Como editar a borda de uma tabela em HTML
Usando Tabela ou div
Criando uma página em html
O Básico do HTML
Iniciando em PHP - Parte II
Iniciando em PHP - Parte I
Ganhe apenas CLICANDO em anúncios
COMPILADORES HTML e PHP
EDITORES HTML GRATUITOS
Arquivos
2009, 01 junho
2008, 01 novembro
2008, 01 outubro
2008, 01 julho
2008, 01 junho
2008, 01 abril
2008, 01 março
2008, 01 fevereiro
2008, 01 janeiro
2007, 01 dezembro
2007, 01 março
2007, 01 fevereiro
6247 acessos
|
|
|
quarta, 24 junho, 2009
|
Na Ativa
Após bastante tempo sem nenhum post, aqui estou eu novamente. Não que tenha esquecido de CLIQUE DIGITAL, mas é que meus projetos cresceram, e o espaço aqui tornou-se limitado. Agora com blogs com domínio próprio, que tenho dado maior importância sobrou pouco tempo para este que foi meu primeiro blog. Acesse também meus outros blogs http://www.tribbo.net e http://superblog.tribbo.net . Artigos mais atuais sobre como criar um blog, administrar e ganhar dinheiro com ele. Dicas importantes de como escrever os artigos, como divulgar gratuitamente, etc... No segundo, trata de manutenção da saúde enfocando temas como "ganho de massa", emagracimento, cuidados com a aparência... Visitem, explorem e comentem...
|
|
|
|
domingo, 09 novembro, 2008
|
Como editar a borda de uma tabela em HTML
Geralmente quando criamos uma tabela ela irá ser interpretada pelo browser com suas bordas formando as "grades". Essas bordas podem ser editadas ou escondidas para que o browser não as interprete. Tabela simples: (copie e cole no bloco de notas e salve como tab01.html) <table><tr><td>uma célula com borda</td></tr></table> Tabela sem borda: (copie e cole no bloco de notas e salve como tab02.html) <table border="0"><tr><td>uma célula sem borda</td></tr></table> Tabela com borda editada: <table border="1" bordercolor="black" cellspacing="0"> <tr> <td> Agora a célula com a borda na cor preta (black em inglês)</td> </tr></table> Por equanto é isso. Próximo post outros atributos para tabela.
|
|
|
|
|
Usando Tabela ou div
Ao iniciante em formatação HTML tem duas opções possíveis para criar o "esqueleto" de sua página. A primeira forma é usando tabelas, a segunda e usando div. A sintaxe é bastante simples. Entre as tags <body></body> deve-se desenvolver os códigos: Para tabelas: <table><tr><td></td></tr></table> Explicando o código: Cada página pode conter quantas tabelas se desejar. Ela se inicia com a tag <table> e se encerra com </table>, sempre. A tag <tr> cria uma linha e a tag <td> cria uma coluna. Uma mesma linha pode ter inúmeras colunas. E uma tabela pode ter inúmeras linhas. OBS. Já foi escrito um post anteriormente sobre tabela. Div é bastante usado quando o programador conhece CSS. O div pode ser posicionado em qualquer ponto da página, inclusive sobrepondo-se sobre outro div. Os atributos são determinados com o CSS. Também é possível incluir inúmeros divs em uma mesma página. A sintaxe é: <div> ... </div> Recomendo para o iniciante trabalhar primeiramente com tabelas e só quando dominá-la passar a usar também o div.
|
|
|
|
sábado, 18 outubro, 2008
|
Criando uma página em html
Taí o código de sua primeira página com comentários. Você precisará saber antes: Tag é uma expressão html (palavra reservada da linguagem) escrita entre os sinais matemáticos de MENOR QUE e MAIOR QUE. Ou seja: < tag > e sempre vem aos pares: Uma de abertura <tag> e outra de fechamento < / tag >. Note que a tag de fechamento tem uma barra antes da palavra. Tags básicas e importantes (sem elas a página não é interpretada corretamente): HTML - Todo documento deve ser iniciado com a tag <html> e findado com < /html>; sendo portanto a primeira e a última tag do documento, respectivamente; HEAD - Traduzindo significa cabeça. Vem logo após a tag de abertura <html>; TITLE - Título. fica entre as tags de cabeçalho. Será o título da página; BODY - Corpo. Será o corpo da página. É onde se escreve o conteúdo. Para se comentar o código em HTML usamos: < ! -- o comentário aqui -->. O que estiver escrito no comentário não aparecerá na tela. O CÓDIGO BÁSICO: <html>
<head> <title>MINHA PRIMEIRA PÁGINA </title></head>
<body>
<!-- este comentário não aparece. uso para eu lembrentesimportantes sobre o código --->
Esta frase aparece, muito simples mas funciona.
</body>
</html> Estude este código. Para provar a funcionalidade, copie e cole no bloco de notas. Salve ele como: Pagina.html. Qualquer dúvida e/ou sugestão é so postar no comentário. ATÉ O PRÓXIMO (usando cores e fontes de tamanho variado)
|
|
|
|
|
O Básico do HTML
Mais uma vez volto ao velho HTML...
Linguagem dominante na construção de páginas web, juntamente com CSS e PHP, o programador pode criar desde um simples blog até um superportal. Cada qual com sua finalidade: HTML pode-se dizer que é o esqueleto da página; o CSS deixa o visual com caráter profissional e o PHP dar interatividade ao site. Por exemplo: e-mail, post e comentários, chats, e sites seguros podem e na maioria são em PHP.
Obviamente outras linguagens podem ser usadas, mas são bem mais dificeis de se aprender, outras necessitam de licença comercial de uso (exemplo: ASP).
Recomendo que o aspirante a webdesign, estude primeiramente HTML e só depois passar para outras linguagens. Ainda é bom que, mesmo sendo muito trabalhoso, aprenda trabalhando direto no código fonte. É verdade que existem programas que fazem praticamente tudo para você (mas para quem quer aprender????) e quando surge algum bug inesperado o que fazer?
Estou voltando ao ponto inicial deste blog. Ou seja HTML desde o básico.
No próximo post publicarei o código para que você desenvolva sua primeira página.
|
|
|
|
sábado, 12 julho, 2008
|
Iniciando em PHP - Parte II
O exemplo dado é o mais básico possível. O echo ' alguma coisa'; serve para que a frase apareça no navegador. Porém, PHP é muito mais que isso. Quando você visita uma página onde deve efetuar login possivelmente você está fazendo uso de PHP. Neste caso mais específico da função POST. O uso de PHP/MySQL (banco de dados) é muito comum e também deve ser estudado. Bom, peço desculpa por ter tratado de forma tão superficial, estou elaborando um aquinaum em PHP, simples e funcional, comentado e o mais brevemente possivel eu postarei. Dica para estudo: Baixe um sistema PHP (geralmente zipado), estude os códigos, teste. existem vários sites que disponibilizam esses codigos gratuitamente. P.S. Pena que alguns estão escrito em PHP3 e não rodam direito. Estamos na versão PHP6, mas PHP5 é muito usado ainda. Mas com calma se acha bom material.
|
|
|
|
|
Iniciando em PHP - Parte I
Para quem tem acompanhado os artigos de Clique digital desde o começo, deve ter adquirido ao menos um conhecimento básico de HTML, suficiente para iniciar em PHP. Não tratarei aqui da teoria sobre esta linguagem, tratarei apenas de questões práticas. E nada melhor que aprender com exemplos, principalmente para quem aprende em casa. Antes de tudo trato de algumas implicações técnicas. Os códigos de PHP não são rodados no browser, mas no servidor (na máquina onde o site fica hospedado, digamos assim). É possivel codar (escrever o código) no bloco de notas, mas recomendo o PHP Editor pois além de ser muito bom é grátis e já vem com um interpretador. Além de ter muito material de referência na internet, grandes portais podem ser escritos nessa linguagem. Códigos PHP não constrõem a página, apenas dão função para as ações. Então o HTML é ainda necessário, os elementos gráficos são escritos em conjunto. Deixamos de teorias e vamos ao código mais simples. Assim como HTML, PHP também tem tags, que são <php? e ?>. Tudo que for escrito entre essas tags será considerado como códigos PHP. Exemplo 01: <html><head><title>Ola Mundo</title></head> <body> <?php echo 'Olá mundo, este é meu primeiro código' ?> </body> </html> Agora é salvar como ola mundo.html e ver o resultado! Continua...
|
|
|
|
terça, 17 junho, 2008
|
Ganhe apenas CLICANDO em anúncios
Quer ganhar dinheiro apenas efetuando alguns cliques sobre propagandas? Cadastre-se no site da cashpage e receba dinheiro por cada clique. Convide seus conhecidos para aderirem a sua rede e receba pelos cliques que eles efetuam. NÃO PERCA MAIS TEMPO! GANHE FAZENDO O QUE VOCÊ NORMALMENTE JÁ FAZ NA INTERNET 
TEMPO É DINHEIRO. ACESSE JÁ!
|
|
|
|
terça, 03 junho, 2008
|
COMPILADORES HTML e PHP
Mesmo sendo pouco provável de ser usado como tal, existem programas executáveis compilados a partir de HTML e/ou PHP. Isso mesmo! É perfeitamente possível compilar arquivos HTML para se tornar programas executavéis para windows. Já existem vários compiladores disponiveis, inclusive alguns são gratuitos. Para PHP são raros ainda os compiladores, mas também é possivel compilar. Resolvi postar sobre este assunto porque percebi que quando leigos fazem essa pergunta em fóruns da internet quase sempre são ridicularizados. E o pior é que é pessoas que se dizem entendidas do assunto. Não querendo fazer propaganda (apenas para provar que existe) procure por Natata e-book compiler (para compilar HTML) e miniPHP Studio (para compilar PHP) em sites de download e faça o teste. É bem verdade que estas não são as linguagens mais apropriadas para se desenvolver programas, mas que é possivel compilá-las pode ter certeza que é.
|
|
|
|
|
EDITORES HTML GRATUITOS
Parece ser do conhecimento de poucos que a criação de páginas web não necessariamente deve ser feita em programas caros e específicos. Para quem domina a codificação, o bloco de notas é mais que suficiente. Programas como word, photoshop e publisher também podem ser usados na confecção de páginas. Exceto o bloco de nota (editor de texto puro) os arquivos ficam demasiadamente grande e isso prejudica o carregamento da página, além de possíveis incompatibilidades de browsers. Para quem ainda não domina a codificação recomendo um programa chamado DFM2HTML (pode ser baixado pelo superdownload ou baixaki gratuitamente). Além de muito leve é um programa com recursos fantásticos, considerando seu tamanho. O inconveniente é que é todo em inglês, mas para quem pretender ser webdesign deve saber inglês e uma hora terá que aprender. Este programa tem modelos bases prontos (templates) que podem ser modificados ao gosto do cliente. Os recursos de CSS são fortemente utilizados. Há ainda a possibilidade para usuários mais avançados, uma interação com PHP. Quem programa em PHP, uma ferramenta leve e o melhor em idioma português é o PHP Editor. Trabalha com diferentes linguagens de programação e tem interpretador próprio para testar as páginas desenvolvidas. Este tem caráter mais profissional. Com este pode-se criar páginas HTML tradicionais, ficheiros CSS, arquivos PHP e ainda outras linguagens de propósitos geral (C++, VB e Pascal). A escolha entre um ou outro depende apenas de gosto. O DFM2HTML tem apelo visual maior, em contrapartida se você pretende desenvolver um portal ou site dinâmico, o PHP editor é o mais recomendado.
|
|
|
|
domingo, 13 abril, 2008
|
VIDEOS + YOU TUBE
Inserir um vídeo em um site pessoal, como já foi postado é algo realmente fácil. Mas se quisessemos inserir mais de um? É possivel também, basta repetir o mesmo procedimento agora com o endereço do outro vídeo. Uma observação que não deve ser desconsiderada é com respeito a lentidão (sabemos que nem todo brasileiro possui conexão banda larga). Mais de um vídeo pode demorar muito o carregamento prejudicando o desempenho do site. Então antes de inserir vários vídeos pense se é mesmo necessário e viável. Você pode com boas intenções acabar prejudicando seu trabalho. Pense nisso! Até breve.
|
|
|
|
sábado, 05 abril, 2008
|
Sobre linguagens web PHP, CSS e HTML
É uma pergunta bastante comum entre os interessados em desenvolver páginas web sobre qual linguagem escolher, diante desta situação procuro esclarecer essas questões e quem sabe ajudar aqueles que iniciam nesta área. Primeiramente indico aqueles que estiverem iniciando seus estudos à aprenderem HTML, uma linguagem de formatação de texto, que apresenta relativa facilidade de aprendizado. As páginas web simples são desenvolvidas nessa linguagem (a mais fácil), no entanto, as home pages são estáticas, ou seja não ocorre interação com o usuário (não se tem senhas de proteção, chats, e-mail, etc. ou qualquer forma de envio ou recebimento de dados seguramente). Sua vantagem, além da facilidade de aprendizado e codificação é a fácil estruturação dos elementos da página. O segundo passo é aprender CSS (folhas de estilo) que é uma excelente complementação do HTML, tem como objetivo embelezar a página mais facilmente (por meio de ID ou CLASS). Muito fácil de aprender, torna-se ótimo recurso para sites com muitas páginas, uma vez que alterando os atributos num único ficheiro, como resultado altera-se em todas as páginas de uma só vez, promovendo grande economia de tempo e trabalho. No terceiro momento é aprender PHP que é uma linguagem de programação web. Pode-se com ela desenvolver verdadeiros aplicativos. Como roda no servidor (onde a página fica hospedada), é possivel criar senhas seguras, sistemas de compras virtuais, cadastros, conexão com banco de dados, etc... PHP é a mais difícil, porém a mais segura e promove dinamismo ao site. O aspirante à desenvolvedor web não deve optar por uma delas, mas por todas, pois cada uma tem seu ponto forte e usada em conjunto (o que ocorre quase sempre) deixa o trabalho ainda melhor, mais bonito e seguro. E o melhor é que para se trabalhar com estas linguagens existem várias e excelentes ferramentas gratuitas, é só baixar e mão a obra! Se você é blogueiro apenas, HTML e CSS é suficiente uma vez que PHP não é aceito na edição de blogs. Se sua intenção for tornar-se um webmaster profissional, neste caso PHP é indispensável. Até o próximo post!
|
|
|
|
quarta, 26 março, 2008
|
Efeito de saída de página
Quer colocar um efeito legal na saída de seu site? É muito fácil basta copiar o codigo abaixo e colar depois da tag <head> na área editável disponível na seção MODELO. O código é: <META http-equiv=Page-Exit content=revealTrans(Duraction=5.0,Transition=12)/>. Alguns browser pode eventualmente não interpretar e o efeito pode não ser visualizado. Espero que gostem. Até a próxima!!!
|
|
|
|
domingo, 23 março, 2008
|
Como inserir videos do you tube na sua página
Inserir vídeos do you tube em uma página pessoal é possível e também muito fácil para que possui conhecimento básico de HTML. Segue o código: <object type="application/x-shockwave-flash" data="link do vídeo" width="425" height="350"><param name="movie" value="link do vídeo"></object> Você ainda pode alterar os valores de largura e altura (width e height). Um modo mais fácil é quando o vídeo já estiver escolhido na página do you tube, procure um bloco ao lado do tv e onde estiver escrito embed de um clique com o botão direito e selecione o código. Veja a figura acima: Se tratar de um blog não cole no editor de post, mas sim no código fonte disponível em modelo (não cole simplesmente em qualquer lugar) faça um estudo onde o display (tv) se apresentará melhor e só assim cole o código copiado. Gostaria de receber comentários com respeito deste pequeno tutorial. Dúvidas, possíveis erros, sugestões de tutoriais e críticas. Espero ter ajudado!
|
|
|
|
|
Sobre ferramentas wysing
Não posso negar que existem uma boa quantidade de ferramentas gratuitas disponiveis para baixar na internet. Algumas delas com interface muito facil de ser manuseada, outras nem tanto, mas concordo que no final todas ajudam enormemente a desenvolver um trabalho rápido, porém não muito "limpo". Para um desenvolvedor iniciante é empolgante ver sua página enquanto codifica. Mas, estes programas (principalmente os WYSING, o que você ve é o que você tem) geram uma quantidade de ´linhas de código desnecessários que irão prejudicar o carregamento da página quando hospedada (daí o termo código sujo, ou seja, não otimizado). Esse é o cuidado que se deve ter, pode parecer vantajoso mas você não aprenderá codificar e qualquer probleminha, já era... Recomendo, principalmente para quem está iniciando usar um editor de texto puro tipo "bloco de notas". Pode acreditar, no ínicio será tedioso, mas se quer realmente conseguir conhecimento para ser um bom webmaster deve aprender o código fonte, e para isto basta o simples editor de texto. O conhecimento do código é fundamental se você pretende se manter na área, além de que você pode deixar seu site exatamente da forma que quiser, com todos os efeitos e recursos que a linguagem pode lhe oferecer. Inicie seu estudos com HTMl básico, e por etapas aprofunde seus conhecimentos. Com médio domínio de HTML passe também a estudar CSS e só depois PHP. PHP, atualmente é uma linguagem segura utilizada em quase todos os sites dinâmicos. Procure tutoriais na web, siga seus exemplos e depois tente modifica-los. Vale a pena o esforço, dedique-se e seja um excelente webmaster.
|
|
|
|
domingo, 09 março, 2008
|
Usando frames
Olá pessoal! Como demorei para postar, hoje irei compensar postando em dose dupla: Considerando que o leitor já disponha de conhecimento básico em HTML, tratarei aqui sobre os frames. Os frames são divisões da tela do PC, e possibilitam a visualização de duas páginas ao mesmo tempo. Teste o seguinte exemplo: Crie uma página simples e salve como pagina1.html; <html> <head><title>pagina1</title></head> <body> texto da pagina 01</body></html> Crie uma segunda página e salve como pagina2.html; <html> <head><title>pagina2</title></head> <body> texto da pagina 02</body></html> Agora iremos criar uma página principal que será salva como index.html. Esta será dividida em 02 frames, onde poderão ser visto ambas as páginas ao mesmo tempo. Eis o código: <html> <head> <title> PRINCIPAL </title> </head> <frameset rows = "50%","50%"> <frame src="pagina1.html"> <frame src="pagina2.html"> </frameset> </html> Cada página ocupará metade do espaço e pode-se alterar modificando os valores de percentagem. O atributo rows dispõe uma página acima da outra. Usa-se cols ao invés de rows quando queremos uma página na direita e outra na esquerda. Altere o código e veja os resultados.
|
|
|
|
sábado, 16 fevereiro, 2008
|
CSS - Cascading Style Sheets
CSS ou folhas de estilo em cascata é uma linguagem de formatação de páginas web. Não é a linguagem principal, mas aplica-se em conjunto ao HTML, conferindo uma aparência profissional para qualquer site. O código CSS pode ser chamado de um ficheiro externo (pouco útil para blogs) ou definido no cabeçalho da página (excelente para blogs). É definido entre as tags <head> <style> códigos aqui </style> </head> e permite que o "blogeiro" modifique os atributos que ele queira. Na prática o código é escrito conforme a sintaxe abaixo: elemento da página { atributo 01: valor; atributo 02: valor; etc } Observe que após cada atributo usa-se "dois pontos" e após o valor usa-se "ponto e vírgula" (o esquecimento de um destes o browser não interpretará corretamente). Vejamos um exemplo: body { background-color: #000000; <!--- define a cor do plano de fundo----> color:#FFFFFF; } <!--- define a cor do texto -----> Uma vez que grande parte das hosts que oferecem modelos prontos de blogs, apenas mudando as definições do CSS é possivel ter uma aparência legal e totalmente diferente.
|
|
|
|
|
ATRIBUINDO CORES
A definição de cores em desenvolvimento de páginas web é bastante fácil.
Pode-se escrever o nome das cores (em inglês) ou colocar seu código hexadecimal.
A lista abaixo mostra alguns exemplos de definição de cores: Preto = black ou #000000
Azul = blue ou #0000FF
Amarelo = yellow ou #FFFF00
Verde = green ou #008000
Lima = lime ou #00ff00
Marron = maroon ou #800000
Oliva = olive ou #808000
Azul-claro Celeste =aqua ou #00ffff
Lilás = fuchsia ou #ff00ff
Cinza = gray ou #808080
Amarelo-ouro = gold ou #FFD700
Branco = white ou #FFFFFF
Azul escuro = navy ou #000080
Roxo = purple ou #800080
Verde escuro = teal ou #008080
Cinza claro = silver ou #c0c0c0
Vermelho = red ou #FF0000 Note que há diferenças entre maiúsculas e minúsculas. É claro que ninguem irá decorar o código hexadecimal para todas as cores, mas sempre que possivel podem ser acessadas na internet.
Usar o nome das cores é realmente muito fácil, no entanto é limitado, não sendo possivel nomear corretamente as nuances de cada cor. Já a utilização dos códigos permitem a utilização de qualquer cor que lhe venha em mente. Observações importantes:
Em HTML puro usamos as cores da seguinte maneira:
Bgcolor="nome da cor ou código" --- Atribui a cor do plano de fundo;
font color="nome da cor ou código" --- Atribui cor da fonte;
Em CSS usamos da seguinte forma:
background-color:nome da cor ou código;--- Atribui a cor do plano de fundo;
color:nome da cor ou código; --- Atribui cor da fonte;
|
|
|
|
sábado, 02 fevereiro, 2008
|
Criando tabela
TABELAS As tabelas ainda são elementos de grande utilização na construção de páginas web simples com HTML puro, pois proporcionam o posicionamento de elementos mais facilmente, quando não se está utilizando recursos de CSS. A tabela é delimitada pela tag TABLE: <table> < / table> As linhas são delimitadas pelas tags <tr> < / tr> e as colunas por <td> </td>. Assim para se escrever uma tabela com 02 linhas e 05 colunas teremos: <html><head><title>Minha primeira tabela </title> </head> <body><table border=”1”> <tr> <td> linha 1 coluna 1</td> <td> linha 1 coluna 2</td> <td> linha 1 coluna 3</td> <td> linha 1 coluna 4</td> <td> linha 1 coluna 5</td> </tr> <tr> <td> linha 2 coluna 1</td> <td> linha 2 coluna 2</td> <td> linha 2 coluna 3</td> <td> linha 2 coluna 4</td> <td> linha 2 coluna 5</td> </tr> </table></body></html>
Caso se queira que as bordas da tabela não visíveis basta apenas apagar <table border=1> em substituir por <table> apenas. Obs: Copie para o bloco de notas e salve com o nome: tabela.html. confira você terá uma tabela bem simples.
Usando um pouco de CSS. Depois da tag < / title> escreva:
<style> body { background-color:gray;} .tab { background-color:yellow; color:blue; font-size:20px; top:100px; left: 250px;} </style>
Salve as alterações e confira. Não mudou nada na tabela apenas o plano e fundo ficou “gray” cinza em português. É preciso fazer uma chamada de classe para a tabela. Modifique <table border=”1”> para <table border=”1” class=”tab”>. Salve novamente e agora veja a tabela com um novo visual.
|
|
|
|
quinta, 31 janeiro, 2008
|
DEIXE SEU UNIBLOG COM A MESMA APARÊNCIA DO CLIQUE DIGITAL
Olá pessoal! Se alguém tiver interesse em deixar o visual de seu UNIBLOG igual ao visual do CLIQUE DIGITAL é só o e-mail no comentário para esse post e dizer que cor deve ser utilizada. Eu postarei o código CSS de acordo com as cores preferidas pelo pessoal. É muito fácil, basta apenas copiar e colar o código da página e substituir o código que está em modelo. Ah! o código só irá funcionar corretamente em blogs do uniblog. Para outras hosts não foram testados ainda.
|
|
|
|
|
|
