Skip to main content
Webmasters

Questions tagged [responsive-webdesign]

Ask Question

Responsive web design (RWD) is a web design approach aimed at crafting sites to provide an optimal viewing experience—easy reading and navigation with a minimum of resizing, panning, and scrolling—across a wide range of devices (from mobile phones to desktop computer monitors).

119 questions
Newest Active Bountied Unanswered
Filter by
Sorted by
Tagged with
0 votes
1 answer
49 views

I've been toying around with firefox responsive design mode against my website and can't seem to figure out the proper settings for img srcset that would work with as many web browsers as possible ...
Mike -- No longer here's user avatar
  • 13.7k
0 votes
0 answers
50 views

I'm learning to place media queries into a website for getting the correct layout changes I need on different mobile devices. I've done this in CSS and Bootstrap before, but my job is asking me to do ...
user avatar
2 votes
1 answer
55 views

Let’s say I want to have responsive page text like the below: <h1 class=“hide-sm”>My Awesome Widgets</h1> <h1 class=“show-sm”>Widgets</h1> Let’s say for argument’s sake my ...
Steven Moseley's user avatar
  • 123
2 votes
1 answer
655 views

Just trying to determine modern best practices for previewing, anticipating, and determining best font sizes to use for web design these days while accounting for the different types of displays the ...
Kenny J's user avatar
  • 21
4 votes
1 answer
812 views

Everywhere I look (e.g. Web.dev), it tells you that you must use <meta name="viewport" content="width=device-width, initial-scale=1"> in the header of your HTML file, so ...
Chris Rogers's user avatar
  • 457
1 vote
1 answer
66 views

I am developing a HTML/CSS template. I am using Fedora Linux platform to write codes and test pages. For test my template on safari (especially mobile version) I have some trouble without any apple ...
AMZ's user avatar
  • 111
1 vote
1 answer
41 views

I have a 20 year old site that I want to upgrade to a responsive layout. Originally it was a desktop-only layout but when a significant portion of my user base went mobile I implemented dynamic ...
Stephen Ostermiller's user avatar
  • 100k
3 votes
1 answer
191 views

In the Google Search Console I keep getting some errors under "Mobile Usability" that pop up every once in a while and then disappear again. To be more exact, it's these two errors mainly, ...
TheKidsWantDjent's user avatar
  • 235
2 votes
0 answers
30 views

I have a client that asked me to develop a website using a dynamic serving technique, basically he uses the vary http header in order to serve different versions of the front-end discerning them based ...
Santiago's user avatar
  • 121
1 vote
0 answers
79 views

I've been trying to use responsive+lazyload images on my website, and I created the following piece of code: <center><picture> <source type="image/webp" media="(max-width:...
Hookstark's user avatar
  • 423
0 votes
1 answer
57 views

I manage a website with 200,000+ products, with 2,400,000 URLs: 600,000 URLs for non-AMP visitors in English (per product: 1 page of features, 1 page with photos, 1 page with opinions) 600,000 URLs ...
Hookstark's user avatar
  • 423
1 vote
1 answer
104 views

I'm trying to cache the pages of my website, which are responsive and show the same contents for Desktop and for Mobile, with the exception of the location of the AdSense units if the visit is from ...
Hookstark's user avatar
  • 423
1 vote
0 answers
28 views

I would like to know the different ways we can create template for a website because many times the pre-made templates available online don't fit to the requirements of everybody. The style I want ...
Pragyan's user avatar
  • 111
1 vote
1 answer
258 views

I have a blog post here which works fine on a larger screen but not so much on a smaller one. As you can see from the screenshot below the paragraph breaks very poorly around the image. Given how ...
Matthew Brown aka Lord Matt's user avatar
  • 175
1 vote
0 answers
58 views

I understand WCAG is technology agnostic, so it doesn't specify which browsers, devices, and operating systems that a website needs to be accessible on. However, our site isn't responsive on certain ...
meicheng's user avatar
  • 11
2 votes
1 answer
175 views

Suppose a webpage has two menus, one for a "desktop" sized screen and another for tablets/phones. It might looks something like this: <body> <div class="hide-me-on-wide-screens"> <...
WillD's user avatar
  • 161
1 vote
1 answer
105 views

My question is about responsive designs (HTML + CSS). Does it matter if I use a different elements for desktop and mobile versions of my site? I mean that my page isn't really responsive, it only ...
Nimer Sulieman's user avatar
  • 11
3 votes
2 answers
176 views

The website GTmetrix is giving me low score on "Optimize images" for the following reason: On my main page I have 4 columns with images. Each column takes 25% of the screen resolution so on my ...
Onyx's user avatar
  • 145
1 vote
0 answers
32 views

I am in the planning stages of my new website. With the rise of 4K monitors I want to make my site appealing to people who use these larger resolutions. My site design is based on the responsive 12 ...
user2924127's user avatar
  • 119
1 vote
0 answers
292 views

AdSense has a help page stating the acceptable modifications of ad code. AdSense Document One of the section speaks about specifying an expandable width and a fixed height. (The example given on the ...
Kannan's user avatar
  • 2,353
0 votes
1 answer
94 views

We have a website math.tutorvista.com. We use dynamic serving web pages. Desktop URL: https://math.tutorvista.com/geometry/analytical-geometry.html Mobile URL: https://math.tutorvista.com/...
Goutham Jabez GJ's user avatar
  • 63
1 vote
0 answers
15 views

I'm trying to develop a online platform which will automatically generates text logos when the text inputs by user. I searched many ways to find some resources to starting my task. but couldn't found ...
gsd gs's user avatar
  • 11
0 votes
2 answers
1k views

I haven't developed a website in quite some time, and am currently working on one for a friend's small company. I put together a simple design, and have been able to get the content itself to be ...
user40393's user avatar
  • 1
-1 votes
1 answer
35 views

my site is 16 years old and still looks great on a desktop monitor but looking at the statistics 60% of visitors enter my mobile devices my question is there a simple zoom script to mimic the finger ...
Terep's user avatar
  • 1
1 vote
0 answers
26 views

I have an old site which has a mobile.example.com, I finally got around to updating the main site to a responsive version that means the old mobile site is no longer needed. However I am not sure if ...
Abu Nooh's user avatar
  • 991
1 vote
1 answer
88 views

I just want to be sure if i use server.transfer method for display mobile version of my website, is it good for SEO and google ? somehow i managed to use this method to display mobile version of my ...
Pedram's user avatar
  • 337
3 votes
1 answer
456 views

Please, explain to me what are the pitfalls to use ZURB Foundation's flex-video instead of responsive-embed (or vice versa). I've made a layout where I don't see any difference between two: <!-- ....
Max Yudin's user avatar
  • 153
3 votes
1 answer
693 views

I would like to know if duplicating some links in the menu for responsive purposes (display:none in some cases) can affect SEO. Simple example: <ul> <li><a href="/one">one</a&...
Grep fs's user avatar
  • 31
2 votes
2 answers
130 views

I was deeply involved in other work and out of the blue, the co-owner of the site informs me that the website isn't 100% right for all people. While he isn't technically inclined compared to me, this ...
Mike -- No longer here's user avatar
  • 13.7k
4 votes
1 answer
3k views

I want to know, how can I avoid loading all images I created for different devices using media query. Currently my mark up look like below : <img src="/media/1062/lg.png" alt="Fresh from ...
Sangeeta's user avatar
  • 173
0 votes
1 answer
108 views

I am building responsive image functionality for a site (written ASP.NET MVC, although that is almost irrelevant here). My question is not technical, but about the most semantic way to serve images at ...
Matthew Dresser's user avatar
  • 263
3 votes
3 answers
164 views

I updated a client's website 3 weeks ago to use Bootstrap. Since then I've run almost every other day Google's Mobile-Friendly test and also Google's PageSpeed, and all results are in the green. ...
Rares Hideg's user avatar
  • 231
2 votes
1 answer
420 views

I am working on a responsive website using a fluid grid system, which means that my content has no "fixed" width, but rather use a proportion of the screen width (e.g 3/12 or 4/12) We would like to ...
Dogoku's user avatar
  • 135
1 vote
0 answers
45 views

I know that forums are in no way as popular as they used to be, but I always wanted to set one up, and still do, so I'm really considering my options. Let me outline what I'm after. I preferably ...
W D's user avatar
  • 11
0 votes
1 answer
254 views

I am working on SEO project for the website aasaanjobs.com. The website has two different entity for desktop users and mobile users. I was thinking deindexing https://m.aasaanjobs.com/ completely and ...
Prashant G's user avatar
  • 9
1 vote
1 answer
1k views

I'm building a website that I hope to feature heavily on embedded youtube videos, but the embed code only allows you to specify one width, which is a problem when it comes to the whole mobile ...
Unhappy Blogger's user avatar
  • 151
1 vote
1 answer
1k views

With structured data and img width and height, Google says "number required". Does it mean that Google only accepts the numbers in pixels? https://developers.google.com/search/docs/data-types/articles ...
Nrc's user avatar
  • 829
0 votes
1 answer
148 views

w3schools.com defines Bootstrap as "... framework for developing responsive, mobile-first web sites". If I am not interested that much in building a mobile-compatible web site (I am but it is not my ...
Error - CPU Not Foud's user avatar
  • 189
0 votes
1 answer
2k views

Is there an adverse effect of capturing screen size with JS and rendering different HTML contents via AJAX based on user's screen size, mainly from SEO perspective? I'm working on an ecommerce app ...
kent-id's user avatar
  • 101
4 votes
2 answers
5k views

The google mobile friendly test conveniently shows resources that could not be loaded...but it says nothing regarding how to go about fixing them. I know this may be a broad question, but I'm just ...
CZorio's user avatar
  • 348
0 votes
1 answer
709 views

I am creating a new layout for my website and I have AdSense ads there. I have read that you can have up to 3 ads on one page. I am creating responsive design now and I want to use 4 ads but 3 will ...
Jakub Kliský's user avatar
  • 457
1 vote
0 answers
60 views

I have to follow a sketch of the main webpage of a website I'm building. The main page is essentially blocks rendered as rows, but one row is divided in 4 blocks that are not of the same height (so I ...
Strannch's user avatar
  • 23
3 votes
1 answer
666 views

This question is not on how to remove AdSense, but if I can remove AdSense from my website using jQuery. I was reading the policies on AdSense and I'm a little confused. On the page regarding the ...
SameOldNick's user avatar
  • 554
4 votes
1 answer
855 views

I've been aware of this issue for sometime but sadly not had the downtime to address, but I want to ensure that its actually a problem before wasting my time. The problem that I have is that Google's ...
Simon Hayter's user avatar
  • 33.1k
3 votes
2 answers
4k views

So I am really at loss which units to adopt when developing responsive layouts. Some say use viewport units. Other people say use rem. Other say use media queries and pixel ratio. So what unit is the "...
The Law's user avatar
  • 253
1 vote
2 answers
97 views

Most sites these days have wide screen images that are responsive and fit most of the screen on home page. Height seems to be at around 600 and width at 1920 However...when responsive it can shrink ...
Bruno Vincent's user avatar
  • 259
1 vote
3 answers
110 views

Normally when I describe RWD to a non-web person (and bear in mind this might be a non-technical manager or a client), I'll say something like: The site will be designed in such a way that it will ...
Rounin's user avatar
  • 2,405
5 votes
2 answers
517 views

The AdSense responsive format sizes the advertising only on load. If the user resizes the window (from large to small), the advertising is not resized (even with media queries) and keeps its initiale ...
Toto's user avatar
  • 345
1 vote
0 answers
47 views

I have a problem. On my mobile pages where each page consist of a large picture, I have it set with CSS so that the image fits the entire available width of the screen. I want to avoid using fixed ...
Mike -- No longer here's user avatar
  • 13.7k
1 vote
1 answer
55 views

We are rewritting our website to a responsive design (and maybe RESS in the future). Analytics figures impose us to support some old browsers (ie7 and ie8). We have 2 CSS: site.css: full css with ...
Toto's user avatar
  • 345

1
2 3