The aim of the thesis is to create a comprehensive material that covers the basic knowledge of theory and practices necessary to understand the whole complexity of the Responsive Web Design (RWD). This thesis first focuses on the RWD origin and its two approaches. Furthermore, the work deals with technical solutions of the RWD and technologies that enabled its creation or were found useful for it. This part also mentions tools which simplify the work with given technologies. The next part is devoted to Responsive CSS Frameworks as being the base for creating responsive websites and shows layout examples where two different approaches and frameworks were used. At last an issue of testing responsive websites is discussed.

Submitted by Milena Rubi ( ri.bso@ufscar.br) on 2017-10-17T13:29:06Z No. of bitstreams: 1 BUENO_Danilo_2017.pdf: 12404601 bytes, checksum: b788f4b11bbb3fb391f608449597ae16 (MD5) / Approved for entry into archive by Milena Rubi ( ri.bso@ufscar.br) on 2017-10-17T13:29:18Z (GMT) No. of bitstreams: 1 BUENO_Danilo_2017.pdf: 12404601 bytes, checksum: b788f4b11bbb3fb391f608449597ae16 (MD5) / Approved for entry into archive by Milena Rubi ( ri.bso@ufscar.br) on 2017-10-17T13:29:26Z (GMT) No. of bitstreams: 1 BUENO_Danilo_2017.pdf: 12404601 bytes, checksum: b788f4b11bbb3fb391f608449597ae16 (MD5) / Made available in DSpace on 2017-10-17T13:29:35Z (GMT). No. of bitstreams: 1 BUENO_Danilo_2017.pdf: 12404601 bytes, checksum: b788f4b11bbb3fb391f608449597ae16 (MD5) Previous issue date: 2017-06-30 / Não recebi financiamento / The use of mobile devices to browse the Web has become increasingly popular as a consequence of easy access to the Internet. However, moving from the desktop development to the mobile platform features, requests from developers an important focus on interaction elements which fit into the interaction demands. There by, several approaches have emerged for adaptation of Web applications. One of the most adopted solution by Web developers are front-end frameworks . Nevertheless, this technique has shortcomings that directly impact in the interaction elements and user satisfaction. In this scenario, the objective of this work is to propose a hybrid adaptation approach of context-sensitive Web interfaces with multimodality support, called HyMobWeb, which aims to help developers to create solutions closer to the device’s characteristics, to the contexts of use and the needs of end-users. The approach is composed of stages of static and dynamic adaptation. Static adaptation subsidizes developers in marking elements to be adapted through a grammar that can reduce the coding effort of solutions that address aspects related to multimodality and context sensitivity. Dynamic adaptation is responsible for analyzing changes in the context of the user and performing the marked adaptations in static adaptation. The approach was outlined from a review of the literature on mobile Web interface adaptation and three exploratory studies. The first and second study dealt with end users’ difficulties regarding the use of non-mobile Web applications. The third is about gaps in traditional adaptations - made through frameworks front-end - in relation to the users needs. Aiming to evaluate the approach, two evaluations were carried out, one from the perspective of the developer and another from the end user. The first one focused on verifying the acceptance of the proposal by software developers in the use of the grammar and resources proposed from it. The second sought to identify if the adaptation, previously implemented by the developers, brought satisfaction to the end-users during its use. The findings suggested that HyMobWeb brought significant contributions to the work of the developers and that the resources explored by the approach provided positive reactions to the satisfaction of end-users. / O uso de dispositivos móveis para navegar na Web tornou-se cada vez mais popular devido à proliferação dos aparelhos e sua facilidade de acesso. No entanto, a transição da plataforma desktop para mobile inseriu um novo desafio aos desenvolvedores sobre o uso de elementos de interação e de suas funcionalidades. Com isso, surgiram diversas abordagens para adaptação das aplicações Web. Entre elas, uma das mais comuns entre Desenvolvedores Web é a utilização de frameworks front-end . Contudo, estes frameworks possuem limitantes nas funcionalidades de adaptação das interfaces com deficiências que impactam diretamente nos elementos de interação e na satisfação do usuário. Diante deste cenário, este trabalho tem como objetivo propor a HyMobWeb, uma abordagem híbrida de adaptação de interfaces Web móveis sensíveis ao contexto e com suporte a multimodalidade, que visa a auxiliar os desenvolvedores na criação de soluções mais próximas às características do dispositivo, aos contextos de utilização, e as necessidades dos usuários finais. A abordagem é composta das etapas de adaptação estática e dinâmica. A adaptação estática subsidia os desenvolvedores na marcação de elementos a serem adaptados através de uma gramática que pode reduzir o esforço de codificação de soluções que abordam aspectos relacionados à multimodalidade e à sensibilidade ao contexto. A adaptação dinâmica é a responsável por analisar as mudanças no contexto do usuário e realizar as adaptações marcadas na adaptação estática. A abordagem foi delineada a partir de uma revisão da literatura acerca da adaptação de interface Web em dispositivos móveis e três estudos exploratórios. O primeiro estudo tratou sobre as dificuldades dos usuários finais em relação à utilização de aplicações Web não adaptadas aos dispositivos móveis. O segundo sobre os impactos da adição da multimodalidade em tais ambientes. Enquanto o terceiro, sobre as lacunas existentes nas adaptações tradicionais - realizadas através de frameworks front-end - em relação às necessidades dos usuários finais. Visando avaliar a abordagem, duas avaliações foram realizadas: uma na perspectiva do desenvolvedor e outra do usuário final. A primeira focou em verificar aceitação da proposta por parte dos desenvolvedores de software no uso da gramática e recursos propostos a partir dela. A segunda buscou identificar se a adaptação, previamente implementada pelos desenvolvedores, trazia satisfação para os usuários finais durante seu uso. Os resultados encontrados sugeriram que a HyMobWeb trouxe contribuições significativas para o trabalho dos desenvolvedores e que os recursos explorados pela abordagem propiciaram reações positivas na satisfação dos usuários finais