Publicado por (8) Comentários
Registro e submeto às críticas e sugestões meu primeiro experimento com a ferramenta AJAX. Atualmente, sou aluno do módulo AJAX I do curso online da Visie Treinamentos Web.
O experimento tem como objetivo demonstrar algumas funcionalidades dessa ferramenta sem a preocupação de um tratamento rigoroso de alguns procedimentos normalmente exigidos em uma aplicação comercial.
Trata das velhas e conhecidas operações de manutenção de uma tabela de dados – incluir, alterar, excluir e consultar -, bem simples, onde utilizo a técnica de passagem de parâmetros através da URL (“?’ e “&”) para um programa PHP que se encarrega de operacionalizar, do lado do servidor, essas tarefas. É claro que poderia ser adotado outros mecanismos para a passagem de parâmetros.
As respostas do programa PHP são retornadas no formato JSON. Por esta razão os caracteres “[", "]“, ‘ e “,” são eliminados dos campos antes da gravação na tabela.
Pela simplicidade da rotina desenvolvida não vale a pena me alongar em explicitar detalhes. Veja funcionando e dê o seu feedback. Fico na esperança de que tenha alguma utilidade.
Publicado por (0) Comentário
Em vista do número de visitas ao VICHE originadas a partir dos dois últimos trabalhos publicados por mim, resolvi disponibilizar aqui seus links de acesso:
Publicado por (0) Comentário
Dois artigos de Mike Stenhouse, muito bons, publicados em seu blog Content White Style.
O primeiro aborda uma forma de se trabalhar com CSS modularmente, agrupando estilos com as mesmas características em folhas separadas, visando ganho de produtividade com o seu uso (reutilização) na construção de site. Estabelece e detalha os seguintes componentes (módulos CSS) básicos: Tipografia, Formulários, Layout Principal, Navegação e Cores. Mostra ainda como criar os links de importação das folhas de estilos e ao final coloca alguns cuidados a serem observados na utilização do método. O artigo completo, em inglês, pode ser visto no blog do autor.
O passo seguinte, detalhado no segundo artigo, foi ampliar os conceitos de CSS modular para convertê-lo em um CSS Framework, permitindo o desenvolvimento rápido de sites com os componentes já desenvolvidos e testados. Propõe uma estrutura ideal das div e mostra o código XHTML da página com base nesta estrutura. Entre outras explicações, apresenta seis layouts construídos usando a modularidade das folhas de estilos e o mesmo código XHTML. Veja os layouts funcionando e faça o download de todos os arquivos fontes utilizados.
Publicado por (0) Comentário
Outro dia estava a navegar pela imensa teia (poético, não) quando me deparei com o post “Isso está na especificação do CSS, é um bug do IE ou é burrice minha mesmo!?! “, do Gustavo Cardoso. Relembrei, então, que quando estava exercitando CSS com o padrão proposto pelo Revolução do CSS, encontrei uma situação que me pareceu bastante estranha. É o seguinte: os links dos menus funcionavam perfeitamente no Firefox, Netscape e IE, mas não funcionavam no Opera – tenho somente estes instalados no meu micro e, portanto, não sei o comportamento em outros browsers.
Encontrei a solução, assim meio que na tentativa e erro e uma boa dose de bom senso, mas não sei até hoje a razão na “ponta do lápis” e gostaria muito de saber. Quem se habilita?
Detalhando o problema:
No exemplo em que os links funcionam no Opera e nos demais browsers acima mencionados acrescentei o float:right e substitui o position: absolute por relative, na classe navegação como indicado abaixo. Veja aqui um exemplo:
/*……. NAVEGAÇÃO……..*/
.navegacao {
position: relative; /* Para o que não funciona -> position: absolute; */
top:205px;
right:25px;
width: 160px;
float:right; /* Para o que não funciona -> este atributo não existe */
}
O exemplo em que os links não funcionam sómente no Ópera (retirada do float e position: absolute) você pode ver aqui . A mesma situação pode ser observada no tema One Ring – muito bom, por sinal -, do Cláudio Dias publicado no Revolução do CSS.
Publicado por (0) Comentário
Em continuidade ao post CSS – Uma Experiência, onde registrei o caminho de minha perigrinação no aprendizado desta técnica, vou apresentar um pequeno histórico dos resultados obtidos por mim. Mais para incentivar os iniciantes e um pouco para chamar a atenção para o projeto Revolução do CSS. Antes que alguém me chame de espilicute, faço a ressalva de que não existe nenhum interesse em me auto promover (sou bem grandinho, tenho 1,87m e uns tantos anos de estrada).
Como já disse no post anterior, onde menciono outros sítios com a mesma finalidade, friso veementemente que se trata de um excelente exercício, pois além do CSS, você se vê às voltas com outras questões: como distribuir as cores para que se obtenha um visual harmonioso, como fazer para criar uma sombra nas margens laterais dos lay-outs, como colocar um degradê de fundo, qual fonte utilizar, e etc, etc, etc. Para um Webdesigner provavelmente tratam-se, em princípio, de questões bastante simples. O que não foi meu caso e não será o de muitos outros que estão iniciando. Mas, você que é webdesigner, deve exercitar seus conhecimentos de CSS em público e colaborar com o Revolução do CSS. Eu fiz isto com a “cara e a coragem” e obtive retornos (o Maurício do Maujor , o Henrique do Revolução , o Diego do Tableless , que o digam) que me ajudaram e incentivaram a continuar.
As questões acima mencionadas me forçaram a pesquisar. Li artigos sobre cores, tutoriais sobre Fireworks e PhotoShop, pesquisei sobre softwares que fornecem esquemas de cores a partir de uma básica (análogas, monocromáticas, complementares, triadic, tetradic), mais sobre CSS, XHTML e por aí a fora. Pelo que já foi dito, percebe-se o porquê da riqueza do uso dos CSS Zen Garden como prática de aprendizagem. É claro que tudo depende de cada um. Os Webdesigners que já possuem o conhecimento das técnicas para a construção de páginas bem elaboradas (no sentido visual, principalmente), eis aqui uma boa oportunidade para aprenderem CSS (para os que não sabem) e exercerem sua criatividade.
Eu, apesar das dificuldades e do tempo gasto (pouco, em função de minhas atividades profissionais) acho que progredi, tanto em conhecimentos como na melhoria da qualidade dos temas desenvolvidos. Claro, não chega a ter nenhuma obra de arte produzida mas dá para perceber o fato (os bons neste negócio façam um esforço e utilizem de uma boa dose de boa vontade) na relação dos temas abaixo indicados, mais ou menos na ordem cronológica de elaboração:
BONITO DE SE VER #0 (Plágio, vocês sabem de onde?)
I. Publicados
II. Não Publicados
Recentemente, em Janeiro de 2006, o Maujor desativou o seu CSS Zen Garden. Uma pena! Muito provavelmente por falta de participação dos iniciantes (dava esta oportunidade) e dos experts. Se meu esforço servir de exemplo, não deixem o mesmo acontecer com o Revolução do CSS cujo projeto se destina primordialmente para os Webdesigners brasileiros, mas não necessariamente só para estes técnicos. Vamos lá, mãos a obra!
Arretei-me. VICHE!
Publicado por (1) Comentário
Para quem está aprendendo recomendo os dois vídeos publicados pelo Diego Eis no tableless:
Após as explicações dadas pode-se verificar que não tem “bicho de sete cabeças”. Mas no início a gente sofre para descobrir estas técnicas. Portanto vejam.
Publicado por (0) Comentário
O Maurício Samy Silva, do Maujor, publicou recentemente dois excelentes artigos:
Dêem uma olhada, vale a pena.
Publicado por (1) Comentário
Deparei-me de forma mais efetiva com o CSS quando resolvi aprender PHP e MySQL. Adquiri alguns livros sobre esses assuntos e danei-me a ler, ler, ler (teoria pura). Era necessário praticar e fixar os conceitos obtidos e, então, parti para o desenvolvimento de um aplicativo Web para a Unimed Brasília (isto tudo em casa e gratuitamente).
Por se tratar de um aplicativo, cheio de formulários (entradas) e dados tabulares (saídas), o uso de folha de estilo, neste momento, se restringiu à utilização de alguns seletores (tags HTML, classes, id´s) e propriedades (font, background-color, text-align, text-transform, padding, …) visando apenas dar uma aparência melhor àqueles elementos.
Já utilizava o conceito de CSS externo “misturado” com o CSS inline. Não havia uma clara separação entre a forma e o conteúdo. Além do mais, utilizava-me do DreamWeaver para construir os formulários dentro de tabelas formatando os lay-outs de entrada e saída do aplicativo (está assim até hoje, quem sabe crio coragem um dia para alterá-lo).
Como todo mundo é sabedor não se consegue construir nada na primeira “tacada”. Tem aquelas famosas idas e vindas. Trocar uma corzinha aqui, um posicionamento ali, e por aí vai. Foi, quando então senti na pele a dificuldade de efetuar estas pequenas alterações. Não pelo CSS mas pela forma como o aplicativo estava sendo construído. E saquei, este negócio de CSS vai me auxiliar bastante, evitando um trabalho imenso para se ajustar pequenos detalhes.
Passei, então, a pesquisar a literatura existente sobre o assunto no Submarino e sites de livrarias. Tristeza total, face a “pobreza” de bons livros sobre o assunto publicados no Brasil. No entanto consegui ter, via Web, acesso a um farto material. Primeiro, no imasters, onde descobri seu articulista Maurício Samy Silva e seu site Maujor que tem excelentes tutoriais sobre CSS. Para não me alongar, a minha andança por esta seara está indicada, em parte, nos links da página inicial. Dêem uma espiadela pode ser útil também para você.
Com o conhecimento adquirido, mantendo o formato em tabelas como já frisado, fiz uma revisão dos estilos (poucos) utilizados e coloquei-os em um folha externa. O ganho na produtividade foi tremenda mesmo com as limitações mencionadas. Trocar uma cor, mudar um estilo de um botão, de um campo do formulário, entre outras coisas, passou a ser uma tarefa simples. Além do que, possibilitou manter um padrão único para todo o aplicativo de forma bem tranquila. É uma maravilha, acreditem.
Não satisfeito, pois o aprendido na prática representava muito pouco para mim, voltei às pesquisas e estudos. Foi aí que me deparei com o CSS Zen Garden do Maujor. Para quem não sabe, trata-se de um ótimo exercício de CSS, onde a partir de um código fixo HTML (intocável) você constroi um novo layout somente utilizando a folha de estilo. Para um aprendiz é uma ótima maneira de apanhar, …, aprender, …, apanhar, e aprender.
Recomendo fortemente o seu uso, mesmo que você não seja Web Designer (como eu), pois permitem fixar conceitos, observar o comportamento das propriedades dentro de um dado seletor e das páginas nos diversos browser’s existentes no mercado (aqui é dureza tratar as diferenças – principalmente os famosos hacks), entre outras coisitas mais. Brinque a vontade com os posicionamentos dos blocos de conteúdo e todas as demais propriedades pois, com toda certeza você estará se aprimorando, independente de ser publicado ou não. É grátis e não machuca ninguém. Portanto use e abuse.
Outros sites do tipo inspirados no criador da idéia, o CSS Zen Garden de Dave Shea: Revolução do CSS de Henrique Costa Pereira e o Gigastyle de Mark Creeten. Visite-os e veja os temas publicados. Mesmo que você não os utilize para seus exercícios você encontra uma gama muito grande de estilos prontos para você analisá-los e estudá-los, e consequentemente aprender e/ou aprimorar seus conhecimentos de CSS.
Fico por aqui na esperança de que o texto escrito sirva para pelo menos um “cristão” tirar proveito. Em sendo assim dou-me por completamente satisfeito.
VICHE!
Comentários