Pular para o conteúdo principal

Design Responsivo - Introdução

Na publicação anterior falamos sobre a historia do HTML CSS e JavaScript, com ela vimos a evolução a varios acontecimentos para chegarmos neste post RWD.

Se não viu, da uma olhada no post anterior


Um pouco mais de história, bem breve!

Maio de 2010, Ethan Marcotte faz uma publicação que iria mudar a forma filosófica de pensar Web e do desenvolvimento de Layouts.

Ele começa sua publicação com a seguinte frase:


"O controle que os designers tem no meio de impressão e muitas vezes desejam no meio da web é simplesmente uma função da limitação da página impressa. Devemos adotar o fato de que a web não possui as mesmas limitações  e devemos aceitar o refluxo e o fluxo das coisas"

John Allsopp, "A Dao of Web Design"





Uma coisa que devemos mudar em nossos conceitos antes de continuarmos é que Responsivo não quer dizer apenas que devemos adaptar um layout, "Faz caber ai!", vai mais longe do que isso. Ele deve deixar de fácil uso toda a área visual do site, ser renderizado de forma que acomode o conteúdo em resposta a todas as características do dispositivo onde ele esta sendo acessado.

Quando falamos Responsive Web Design falamos de:
Viewport, Grid View, Media Queries, Images e Vídeos Flexíveis

Como base para o desenvolvimento vamos utilizar:
HTML5, CSS3 e JavaScript

Nosso alvo: 

Todas os dispositivos, Temos hoje dois conceitos que que não pretendo discutir afundo mas vou apenas trazer um breve resumo, com o meu ponto de vista.


Internet das Coisas (IoT) e Web das Coisas (WoT)



Em poucas palavras, IoT nada mais é que uma extensão da Internet atual, que proporciona aos objetos do dia-a-dia (quaisquer que sejam), mas com capacidade computacional e de comunicação, se conectarem à Internet.




WoT é um termo usado para descrever abordagens, estilos de arquitetura de software e padrões de programação que permitem que objetos do mundo real façam parte da World Wide Web. A WoT fornece uma camada de aplicação que simplifica a criação de aplicativos para a IoT.


IoT é proporcionar uma conexão a internet para todas as coisas e WoT é proporcionar uma aplicação para todas as coisas.
Andre L.P.

Tudo isso torna a vida do Designer (me permita sempre que eu usar a palavra designer, compreender todos aqueles que atuam na criação da aplicação, sejam eles programadores, gestores, designers...) muito mais difícil, não "só um site" ou "só um app", temos que fazer ele estar presente em tudo, e quando digo tudo, é tudo mesmo, tudo que se conecte a internet.

Computadores, Tablets, Celulares, SmartTV, Relógios, Geladeiras, Rádios, Óculos, enfim, uma infinidade de Coisas.

Agora já temos uma base mesmo que simples para entender o que é RWD.

Em meu post inicial coloquei algumas bibliografias, em sua maioria com um conteúdo bem teórico do assunto, pretendo a partir da próxima postagem ser mais prático e dar muitos exemplos de código no decorrer do nosso aprendizado, em caso de duvidas ou sugestões deixe seu comentário.

Até a próxima!

Comentários

Postagens mais visitadas deste blog

Temperamento - Decubra seu Perfil Profissional

Pergunta Sim Não 1: Gosta de conversar? 2: Gosta de atividade, ação? 3: Emociona-se com facilidade? 4: “Explode” facilmente? 5: Está sempre atualizado nos mais diversos assuntos(cultura geral)? 6: É imaginativo? 7: Tem inclinação para a crítica e para ironia? 8: Tem tendência a mudar de opinião se apresentarem argumentos válidos? 9: Quando lhe pedem desculpas,reconcilia-se com facilidade? 10: Tem dificuldade em perdoar/esquecer? 11: Gosta de fazer o bem sempre que pode? 12: Aflige-se facilmente com os males do próximo? 13: É mais optimista do que pessimista? 14: Ri com facilidade quando há motivo? 15: É uma pessoa inconstante,pouco perseverante? 16: Prefere que sejam outros a resolver os problemas? 17: Aceita facilmente novas ordens que lhe são dadas? 18: Gosta de novidades? 19: Gosta de andar elegante, bem vestido? 20: Gosta de ser admirado/elogiado pelos outros? Pergunta Sim Não

Downloads no iTunes U chegam a 300 milhões

A Apple anunciou nessa terça que nada menos que 300 milhões de downloads de conteúdos educacionais foram feitos por meio do ITunes. A iniciativa permite que estudantes do mundo inteiro baixem programas de áudio e de vídeo produzidos por mais de 800 universidades, entre elas Harvard , Cambridge , Oxford e o MIT .
PDF Converter Precisa converter algum arquivo em PDF, mas não tem algum programa que faça isso? O site PDF Converter faz o serviço em poucos cliques. Vá ao botão Browse, escolha o documento que quer converter, digite o e-mail de destino e clique em Convert Your File Google Tradutor Se você tem dificuldades em ler textos em outras línguas, o Google Tradutor é uma boa opção. Para utilizá-lo, escolha o idioma, digite o texto e, depois, selecione para qual idioma quer traduzir. Colar um endereço de página (URL) na caixa de texto e clicar em Traduzir também funciona HearNames O HearNames mostra como se pronuncia corretamente um nome. Para usar o serviço, digite o nome na caixa de texto e clique em Search. Após isso, clique no ícone de alto-falante que aparecerá para ouvir como se fala SuperLame Útil para quem não sabe mexer em programas de edição, o SuperLame executa uma função simples: inserir balões de diálogo em imagens. O procedimento é simples: faça o upload de uma imagem