{"id":1050,"date":"2015-08-10T19:00:48","date_gmt":"2015-08-10T19:00:48","guid":{"rendered":"http:\/\/preview.artisanthemes.io\/modules\/?p=1050"},"modified":"2015-09-29T20:13:34","modified_gmt":"2015-09-29T20:13:34","slug":"responsive-web-design-basics","status":"publish","type":"post","link":"https:\/\/preview.artisanthemes.io\/modules\/2015\/08\/10\/responsive-web-design-basics\/","title":{"rendered":"Responsive web design basics"},"content":{"rendered":"<p>Responsive web design (RWD) is an approach to web design aimed at crafting sites to provide an optimal viewing and interaction experience\u2014easy reading and navigation with a minimum of resizing, panning, and scrolling\u2014across a wide range of devices (from desktop computer monitors to mobile phones).<\/p>\n<p><iframe loading=\"lazy\" src=\"https:\/\/player.vimeo.com\/video\/85914334?api=1\" width=\"740\" height=\"416\" frameborder=\"0\" title=\"Responsive Website Promo (After Effects Template)\" webkitallowfullscreen mozallowfullscreen allowfullscreen><\/iframe><\/p>\n<p>A site designed with RWD adapts the layout to the viewing environment by using fluid, proportion-based grids, flexible images, and CSS3 media queries, an extension of the @media rule, in the following ways:<\/p>\n<p><!--more--><\/p>\n<p>The fluid grid concept calls for page element sizing to be in relative units like percentages, rather than absolute units like pixels or points.<br \/>\nFlexible images are also sized in relative units, so as to prevent them from displaying outside their containing element.<br \/>\nMedia queries allow the page to use different CSS style rules based on characteristics of the device the site is being displayed on, most commonly the width of the browser.<br \/>\nResponsive web design is becoming more important as the amount of mobile traffic now accounts for more than half of total internet traffic. This trend is so prevalent that Google has begun to boost the ratings of sites that are mobile friendly if the search was made from a mobile device. [14] This has the net effect of penalizing sites that are not mobile friendly.<\/p>\n<p><small>Source: https:\/\/en.wikipedia.org\/wiki\/Responsive_web_design<\/small><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Responsive web design (RWD) is an approach to web design aimed at crafting sites to provide an optimal viewing and interaction experience\u2014easy reading and navigation with a minimum of resizing, panning, and scrolling\u2014across a wide range of devices (from desktop computer monitors to mobile phones). A site designed with RWD adapts the layout to the [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":1105,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"video","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[18,47],"tags":[50,48,49],"class_list":["post-1050","post","type-post","status-publish","format-video","has-post-thumbnail","hentry","category-videos","category-web","tag-design","tag-responsive","tag-themes","post_format-post-format-video"],"jetpack_featured_media_url":"https:\/\/preview.artisanthemes.io\/modules\/files\/2015\/08\/responsive-post-image.jpg","jetpack-related-posts":[{"id":158,"url":"https:\/\/preview.artisanthemes.io\/modules\/2015\/08\/12\/television-has-played-a-pivotal-role-in-the-socialization-of-the-20th-and-21st-centuries\/","url_meta":{"origin":1050,"position":0},"title":"Television has played a pivotal role in the socialization of the 20th and 21st centuries","author":"Artisan Themes","date":"August 12, 2015","format":false,"excerpt":"A television, commonly referred to as TV, telly or the tube, is a telecommunication medium used for transmitting sound with moving images in monochrome (black-and-white), colour, or in three dimensions. It can refer to a television set, a television program, or the medium of television transmission. Television is a mass\u2026","rel":"","context":"In &quot;Articles&quot;","block_context":{"text":"Articles","link":"https:\/\/preview.artisanthemes.io\/modules\/category\/articles\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/preview.artisanthemes.io\/modules\/files\/2015\/08\/photo-1415902051846-2ad925a71020.jpg?resize=700%2C507&ssl=1","width":700,"height":507,"srcset":"https:\/\/i0.wp.com\/preview.artisanthemes.io\/modules\/files\/2015\/08\/photo-1415902051846-2ad925a71020.jpg?resize=700%2C507&ssl=1 1x, https:\/\/i0.wp.com\/preview.artisanthemes.io\/modules\/files\/2015\/08\/photo-1415902051846-2ad925a71020.jpg?resize=1050%2C760&ssl=1 1.5x, https:\/\/i0.wp.com\/preview.artisanthemes.io\/modules\/files\/2015\/08\/photo-1415902051846-2ad925a71020.jpg?resize=1400%2C1014&ssl=1 2x"},"classes":[]},{"id":6,"url":"https:\/\/preview.artisanthemes.io\/modules\/2015\/08\/11\/organizing-the-worlds-information-and-making-it-universally-accessible-and-useful\/","url_meta":{"origin":1050,"position":1},"title":"Google: Organizing the world&#8217;s information and making it universally accessible.","author":"Barbara Millikan","date":"August 11, 2015","format":false,"excerpt":"Google is an American multinational technology company specializing in Internet-related services and products. These include online advertising technologies, search, cloud computing, and software. Most of its profits are derived from AdWords, an online advertising service that places advertising near the list of search results. Google was founded by Larry Page\u2026","rel":"","context":"In &quot;Articles&quot;","block_context":{"text":"Articles","link":"https:\/\/preview.artisanthemes.io\/modules\/category\/articles\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/preview.artisanthemes.io\/modules\/files\/2015\/08\/photo-1423784346385-c1d4dac9893a.jpg?resize=700%2C507&ssl=1","width":700,"height":507,"srcset":"https:\/\/i0.wp.com\/preview.artisanthemes.io\/modules\/files\/2015\/08\/photo-1423784346385-c1d4dac9893a.jpg?resize=700%2C507&ssl=1 1x, https:\/\/i0.wp.com\/preview.artisanthemes.io\/modules\/files\/2015\/08\/photo-1423784346385-c1d4dac9893a.jpg?resize=1050%2C760&ssl=1 1.5x, https:\/\/i0.wp.com\/preview.artisanthemes.io\/modules\/files\/2015\/08\/photo-1423784346385-c1d4dac9893a.jpg?resize=1400%2C1014&ssl=1 2x"},"classes":[]},{"id":1047,"url":"https:\/\/preview.artisanthemes.io\/modules\/2015\/08\/10\/time-is-a-measure-in-which-events-can-be-ordered-from-the-past-through-the-present-into-the-future-and-also-the-measure-of-durations-of-events-and-the-intervals-between-them-1234567-tim\/","url_meta":{"origin":1050,"position":2},"title":"Do you believe in time? What is it anyway?","author":"Artisan Themes","date":"August 10, 2015","format":false,"excerpt":"Time is a measure in which events can be ordered from the past through the present into the future, and also the measure of durations of events and the intervals between them. Time is often referred to as the fourth dimension, along with the three spatial dimensions. Time has long\u2026","rel":"","context":"In &quot;Articles&quot;","block_context":{"text":"Articles","link":"https:\/\/preview.artisanthemes.io\/modules\/category\/articles\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/preview.artisanthemes.io\/modules\/files\/2015\/09\/Dollarphotoclub_66865387.jpg?resize=700%2C507&ssl=1","width":700,"height":507,"srcset":"https:\/\/i0.wp.com\/preview.artisanthemes.io\/modules\/files\/2015\/09\/Dollarphotoclub_66865387.jpg?resize=700%2C507&ssl=1 1x, https:\/\/i0.wp.com\/preview.artisanthemes.io\/modules\/files\/2015\/09\/Dollarphotoclub_66865387.jpg?resize=1050%2C760&ssl=1 1.5x, https:\/\/i0.wp.com\/preview.artisanthemes.io\/modules\/files\/2015\/09\/Dollarphotoclub_66865387.jpg?resize=1400%2C1014&ssl=1 2x"},"classes":[]},{"id":23,"url":"https:\/\/preview.artisanthemes.io\/modules\/2015\/08\/11\/because-life-needs-music\/","url_meta":{"origin":1050,"position":3},"title":"Because life needs music","author":"John Doe","date":"August 11, 2015","format":"audio","excerpt":"A musician (or instrumentalist) is a person who plays a musical instrument or is musically talented, or one who composes, conducts, or performs music. Musicians can specialize in any musical style, and some musicians play in a variety of different styles. Examples of a musician's possible skills include performing, conducting,\u2026","rel":"","context":"In &quot;Articles&quot;","block_context":{"text":"Articles","link":"https:\/\/preview.artisanthemes.io\/modules\/category\/articles\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/preview.artisanthemes.io\/modules\/files\/2015\/08\/photo-1431069826965-10c61a19b835.jpg?resize=700%2C507&ssl=1","width":700,"height":507,"srcset":"https:\/\/i0.wp.com\/preview.artisanthemes.io\/modules\/files\/2015\/08\/photo-1431069826965-10c61a19b835.jpg?resize=700%2C507&ssl=1 1x, https:\/\/i0.wp.com\/preview.artisanthemes.io\/modules\/files\/2015\/08\/photo-1431069826965-10c61a19b835.jpg?resize=1050%2C760&ssl=1 1.5x, https:\/\/i0.wp.com\/preview.artisanthemes.io\/modules\/files\/2015\/08\/photo-1431069826965-10c61a19b835.jpg?resize=1400%2C1014&ssl=1 2x"},"classes":[]}],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/preview.artisanthemes.io\/modules\/wp-json\/wp\/v2\/posts\/1050","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/preview.artisanthemes.io\/modules\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/preview.artisanthemes.io\/modules\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/preview.artisanthemes.io\/modules\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/preview.artisanthemes.io\/modules\/wp-json\/wp\/v2\/comments?post=1050"}],"version-history":[{"count":0,"href":"https:\/\/preview.artisanthemes.io\/modules\/wp-json\/wp\/v2\/posts\/1050\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/preview.artisanthemes.io\/modules\/wp-json\/wp\/v2\/media\/1105"}],"wp:attachment":[{"href":"https:\/\/preview.artisanthemes.io\/modules\/wp-json\/wp\/v2\/media?parent=1050"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/preview.artisanthemes.io\/modules\/wp-json\/wp\/v2\/categories?post=1050"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/preview.artisanthemes.io\/modules\/wp-json\/wp\/v2\/tags?post=1050"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}