Blog da VS Lab

Dos nossos bastidores para você!

O responsável pelo design na web: CSS

Hoje falaremos um pouco sobre o responsável pela estilização das páginas e de sistemas web: o CSS. Apenas com o HTML, as páginas web seriam apenas textos em fundos brancos, embora o HTML5 permita que alguns estilos sejam adicionados, é um recurso muito limitado. Já com o CSS abre-se um mundo de possibilidades para deixar as páginas mais bonitas, fluidas e com um design mais amigável e intuitivo para melhor navegabilidade do usuário.

Afinal de contas… O que é esse tal de CSS?

Para que serve?

CSS é a sigla para o termo em inglês Cascading Style Sheets que, traduzido para o português, significa Folha de Estilo em Cascatas. O CSS possui uma curva de aprendizagem fácil e é comumente utilizado com as linguagens de marcação HTML ou XHTML.

Com o CSS, temos muitas possibilidades de formatação, que nos permite mexer, editar, remover, alinhar ou trabalhar no espaçamento dos elementos de uma página de forma prática e fácil. Isso garante maior flexibilidade e agilidade não apenas para os elementos textuais e gráficos que constituem esta mesma página, mas também para profissionais que trabalham com esta linguagem de estilos.

É possível mudar cor, estilo e tamanho de uma fonte e até desenvolver coisas mais elaboradas como animações, transições e gradientes de maneira fácil, criando um visual altamente profissional para suas páginas e sistemas.

Utilização do CSS

Como já dito anteriormente, o CSS é utilizado em conjunto com o HTML e JavaScript. A união destas 3 linguagens possibilita criar páginas incríveis e extremamente profissionais. Hoje, toda a web é desenvolvida em cima destas 3 linguagens, cada uma com sua responsabilidade dentro da página. O HTML trabalha com a estrutura de uma página, o CSS com o estilo e o JavaScript com a lógica.

Abaixo temos um exemplo de uma página HTML simples e sem o uso de nenhum estilo em CSS:

Agora, iremos aplicar um estilo mudando a tipografia e sua cor. Vamos adicionar a tag <style> como no exemplo abaixo:

<style>

h1 {

color: red;

font-family: monospace;

}

</style>

Logo obteremos o seguinte resultado:

Alteramos a cor e o tipo de fonte de forma rápida e simples, logicamente este é um exemplo bem básico e apenas uma dentre o mundo de possibilidades que o CSS nos fornece. Existem também vários frameworks que agilizam o desenvolvimento: Bootstrap, Materialize, e AntDesign são os exemplos mais populares. Falarei sobre cada um deles nas próximas postagens.

O CCS está em sua versão 3. Dentre todas as evoluções, ele possibilita construir animações tanto em 2 como e 3 dimensões, também possui novos mecanismos para um maior controle sobre o estilo com o qual se mostram as características das páginas.

Em breve, conversaremos sobre os frameworks e suas funções dentro da web.

Continue nos acompanhando.

Até a próxima Dev!

Gostou? Compartilhe com seus amigos!

Share on facebook
Facebook
Share on twitter
Twitter
Share on linkedin
LinkedIn

Últimas novidades do blog

Tech
Adriano Aluizi

Por trás das páginas web

Acessar sites faz parte de nossa rotina diária e fazemos isso quase de forma inconsciente. É uma das principais fontes de informação: qualquer dúvida, a

Continue lendo
Bastidores
Lucas Meneghin

Ser especialista ou generalista?

Com todo o avanço dos recursos das mídias sociais e a preferência do público por conteúdos efêmeros (devemos agradecer ao Snapchat ou ao Instagram Stories?),

Continue lendo

Copyright © 2021
VS Lab – Comunicação e Marketing
Todos os direitos reservados