Bootstrap - o que é isso? Twitter Bootstrap - design e desenvolvimento de sites

Índice:

Bootstrap - o que é isso? Twitter Bootstrap - design e desenvolvimento de sites
Bootstrap - o que é isso? Twitter Bootstrap - design e desenvolvimento de sites
Anonim

Quem trabalha pelo menos um pouco com a área de web design e está familiarizado com o processo de criação e design de sites, sabe até onde chegaram as possibilidades de visualização de seu conteúdo ultimamente. Graças às tecnologias CSS, JavaScript e Flash, combinadas, qualquer site pode se tornar uma verdadeira obra-prima, uma espécie de obra de arte moderna. E, claro, muitos designers estão fazendo isso, e um grande número de empresas comissiona generosamente o desenvolvimento de portais com gráficos incríveis. Além disso, o "efeito uau" da página pode ser alcançado não apenas por meio de um conjunto de efeitos diferentes, mas também com a ajuda de transições simples, mas bonitas, infográficos, links e muito mais.

bootstrap o que é
bootstrap o que é

É verdade, todo designer e designer de layout sabe que, para economizar tempo ao desenvolver qualquer recurso, você precisa ter uma certa base, um modelo, com base no qual você pode criar a "obra-prima" final. É para isso que o Bootstrap foi criado: hoje ele ajuda a economizar tempo e facilitar as coisas para milhares de web designers.

Bootstrap - o que é isso?

Assim, a descrição do produto deve começar pelas suas características gerais. Portanto, notamos que o Bootstrap é uma plataforma expressa em um conjuntomodelos originais para o site. Cada um inclui gráficos, CSS e, claro, HTML.

inicialização do twitter
inicialização do twitter

Todo o conjunto vem em um arquivo, que pode ser baixado gratuitamente na página oficial da plataforma. Assim, quem quiser desenvolver seu site pode usar esse conjunto, e não precisará escrever cada página do zero, fazendo ações básicas: marcando o site, dividindo-o em blocos, selecionando gráficos para ícones básicos e assim por diante. Ao mesmo tempo, cada conjunto de Twitter Bootstrap é bastante individual. Ao contrário dos templates aos quais estamos acostumados, não há nada supérfluo nele que precise ser removido ou substituído. O designer poderá criar sua ideia diretamente com base no Bootstrap.

Como começar a construir um site?

Então, já conhecemos a plataforma em si, agora vamos passar para como começar a desenvolver seu site exclusivo. Para começar, é claro, você precisa baixar o arquivo com o modelo Twitter Bootstrap. Ele ocupa muito pouco espaço e você pode obtê-lo na página GetBootstrap. Lá você também pode escolher a colocação dos blocos que você precisa para o site. Por exemplo, existem páginas na forma de uma página de destino com uma imagem, com um controle deslizante, com vários títulos, com efeitos predefinidos e assim por diante. Você só precisa fazer uma escolha e baixar o arquivo adequado ao seu site criado com base no Bootstrap. O que é este conjunto, você verá imediatamente após o download.

menu de inicialização
menu de inicialização

Personalização do tema

Cada tópico representa a si mesmo, como qualquer site,um conjunto de arquivos HTML, CSS e gráficos. Os desenvolvedores da plataforma se esforçaram para trazer as normas de design para os mesmos padrões, dando a máxima oportunidade de personalizar seu tema. Portanto, para tornar seu site único, você precisará entender a estrutura da plataforma, a arquitetura do site nela e como o código de cada modelo é escrito. Você precisa fazer isso uma vez, após o que será mais fácil criar seus projetos usando o Bootstrap. CSS e gráficos são os mesmos em todos os temas. Esta é a vantagem desta abordagem.

Tudo o que nos interessa é o arquivo CSS com o nome do tema (ele é colocado na pasta "css", além dele você encontrará mais dois arquivos das configurações básicas da plataforma, você pode deixá-los sozinhos); bem como "index.html", que é a marcação da página principal. Você deve começar com isso e outras adições específicas na forma de controles deslizantes, alguns efeitos de Javascript já serão determinados pela sua tarefa de criar um site específico. Por exemplo, no modelo padrão do Bootstrap, o menu pode ser projetado em uma cor cinza opaca. Para o seu site, é claro, você irá alterá-lo para que seja feito na cor certa e com todos os efeitos desejados. Essa é a própria customização, mas como existe Bootstrap, não há necessidade de criar um menu do zero, o que economiza tempo.

bootstrap css
bootstrap css

Oportunidades para designers

Na verdade, agora sobre as possibilidades que a plataforma Bootstrap oferece. Quais são essas perspectivas - para trabalhar com esses arquivos? Parece, por que eles são tão notáveis?

Pona verdade, não há nada parecido na plataforma do desenvolvedor do Twitter. A ideia é extremamente simples, assim como sua implementação. Mas agora um designer não precisa criar uma página do site do zero e, em seguida, dar a aparência desejada. Não, agora um especialista pode começar diretamente do shell, do design do site, sem se distrair com coisas básicas como a marcação principal. Este não é um exemplo de uso eficaz e eficiente do tempo?

Além disso, outra vantagem do Bootstrap não foi notada - que é uma maneira de ajudar pessoas que não possuem habilidades de marcação CSS de alto nível a criar seu próprio design profissional, pois todas as ferramentas que um designer de layout necessidade já estão nos templates em questão. Uma pessoa que sabe sobre a construção de sites é capaz de muito mais. E isso já é uma vantagem realmente significativa em favor do Bootstrap.

Agora o projeto está em desenvolvimento, apesar de ter sido lançado em 2011 e desde então milhares de pessoas começaram a trabalhar nele. Esperamos que os desenvolvedores continuem a facilitar o design da web e ajudem as pessoas a criar algo novo, pessoal e útil para o mundo.

Recomendado: