Responsive Web Design Demo

Poderá ver esta funcionalidade se alterar a dimensão da janela de visualização.

Blocos Responsivos Fluidos Centrados

BLOCO A1
BLOCO A2
 
BLOCO B1
BLOCO B2
BLOCO B3
 
BLOCO C1
BLOCO C2
BLOCO C3
BLOCO C4

 

Blocos Responsivos Alinhados à Esquerda

London

London is the capital of England.

It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.

Paris

Paris is the capital of France.

The Paris area is one of the largest population centers in Europe, with more than 12 million inhabitants.

Tokyo

Tokyo is the capital of Japan.

It is the center of the Greater Tokyo Area, and the most populous metropolitan area in the world.

New York

The City of New York é uma TRUMPa

New York is an important center for international diplomacy and has been described as the cultural and financial capital of the world.

Responsive Web Design.

Como sabemos, os computadores já não são os únicos dispositivos que podem aceder à Web. Os smartphones e tablets evoluiram e com isso o panorama da Web para dispositivos móveis.

As pessoas esperam poder aceder à Web nos seus smartphones tão facilmente como o fazem nos seus computadores.

Em resposta a esta necessidade, no ínicio dos telemóveis com acesso à internet, começou-se a criar versões móveis dos sites. Cada site passou a ter a versão “normal” (para o pc) e uma versão “móvel”.

Mas atualmente este conceito já não faz sentido.

O espectro de tamanhos de ecrã e resoluções está a aumentar a cada dia, e criar uma versão diferente do site para cada dispositivo é praticamente impossível. Este é um problema que o Responsive Design vem tentar resolver.

O termo Responsive Design, é a forma de, utilizando grelhas fluídas, layouts fluídos e as @media queries conseguir adaptar o site à grande variedade de dispositivos com diferentes tamanhos de ecrã que existem hoje.

 

Responsive web dedign

 

Desta forma um utilizador que esteja a ver o site num smartphone, num tablet, ou num pc de secretária, verá o site adaptar-se automaticamente ao tamanho do ecrã de cada um dos dispositivos.

 

Ver como funciona