WhatsApp SAC (31) 98799-0134 WhatsApp Vendas (31) 99294-0024 Ligamos para Você Ligue Agora (31) 3899-7000
0

Seu carrinho está vazio

Clique aqui para ver mais cursos.

Saiba como desenvolver sites

A formatação dos sites é fundamental para que o seu propósito comunicativo seja alcançado

A div geral com o id = “geral” engloba toda a estrutura HTML

Logo quando o HTML foi criado, no início da década de 90, as técnicas de formatação de sites ainda eram muito simples, sem qualquer tipo de sofisticação que os diferenciasse uns dos outros. Todos eles apresentavam estruturas padronizadas, ou seja, a página tinha a mesma estrutura independentemente da intenção comunicativa do site. Não havia, portanto, uma preocupação em diferenciar os elementos ali presentes, como a variedade de cores e fontes, e em relação à própria localização de imagens e palavras.

Apresentação de páginas virtuais

No entanto, com o tempo, houve uma necessidade de personalizar essas páginas para deixá-las com um visual mais atraente. Essa estratégia visava um aumento significativo de visitação aos sites e, consequentemente, uma divulgação mais ampla de ideias, bem como um maior número de vendas de produtos, dependendo da finalidade do site. Nos últimos anos, o HTML tem atingido grandes inovações e proporcionado visualizações bem diferenciadas, sendo um artifício importantíssimo na representação virtual de qualquer tipo de empresa.

Renderização no navegador do elemento div formatado com a propriedade background-image

Para o professor Sérgio Antônio dos Santos, bacharel em sistemas de informação e desenvolvedor web há mais de 10 anos, a formatação do site é tão importante quanto a sua estética. Cientes disso, os programadores perceberam uma necessidade de combinar conjuntos de textos e imagens, ou seja, hoje em dia, há uma grande preocupação em relação aos processos de estilização e formatação de conteúdos virtuais. Cascading Style Sheet (CSS), ou Folha de Estilo em Cascata, dá estilo aos sites, além de mantê-los organizados, separando o formato do conteúdo de cada página da web.

Cascading Style Sheet – CSS

O CSS é uma linguagem de estilo que pode ser divida em três tipos:
     – Estilo inline: Quando os estilos CSS são aplicados diretamente dentro da tag de abertura de um elemento HTML. No entanto, este tipo de uso das CSS não é recomendado e encontra-se em desuso entre os profissionais que estruturam as páginas da web;
     – Estilo incorporado: Não é o mais recomendado, pois seus estilos escritos ficam restritos a um único documento, impossibilitando a reutilização dos mesmos em outras páginas do projeto web. Neste método, você declara a folha de estilo diretamente dentro da seção head do documento HTML, utilizando o elemento style;
     – Estilo externo: Este é o mais indicado, pois os códigos CSS se concentram em um documento externo ao documento HTML, separando assim as camadas de estrutura e apresentação do projeto web. Elas podem ser linkadas ou importadas. Esse estilo de CSS se difere daquele por ser feito através da diretiva @import dentro do elemento style, na seção head do documento HTML.

Propriedades da caixa

Elementos HTML hierarquicamente distribuídos, com o elemento div com uma estilização específica

As propriedades de caixa sofrem algumas alterações pelo CSS. O elemento DIV faz parte do HTML, representa três caixas identificadas com a classe conteúdo-principal: <div> caixa 1 </div>; <div> caixa 2 </div> e <div> caixa 3 </div>. Quando os três elementos DIVs estão utilizando a mesma classe conteúdo-principal, as caixas aparecem formatadas de maneira idêntica. Em CSS toda a formatação que for atribuída ao seletor conteúdo-principal servirá para as três caixas simultaneamente e se aplicará ao código HTML.

Propriedades do CSS

No CSS, há diferentes propriedades responsáveis por determinadas funções, como height, width, margin, padding e border. Segue abaixo uma breve explanação das características de cada um:

Height – Define a altura da caixa;
Width – Define a largura da caixa;
Margin – Define uma margem externa à caixa;
Padding – Define uma margem dentro da caixa;
Border – Define uma borda para a caixa.

Como desenvolver sites de qualidade

Renderização no navegador dos estilos de bordas

O CPT – Centro de Produções Técnicas elaborou o curso Desenvolvimento de Sites - Parte 2 - CSS, no qual o professor Sérgio Antônio dos Santos explica passo a passo o funcionamento do CSS, desde a sua criação até as ferramentas disponíveis atualmente para estilizar os sites. Santos ensina como fazer a estilização de uma página com o CSS de forma profissional para que a equipe de estilização possa trabalhar totalmente independente do desenvolvimento HTML. Por meio desse curso você vai aprender a construir páginas limpas, rápidas e de fácil manutenção e atualização.

Por Camila Guimarães Ribeiro

 

Deixe seu comentário

Avise-me, por e-mail, a respeito de novos comentários sobre esta matéria.

O CPT garante a você 100% de segurança e
confidencialidade em seus dados pessoais e e-mail.
Seu comentário foi enviado com sucesso!

Informamos que a resposta será publicada o mais breve possível, assim que passar pela moderação.

Obrigado pela sua participação.

Últimos Artigos

Artigos Mais Lidos

Fique por dentro das novidades!