Skip to main content
4 votes

Foundation: flex-video vs responsive-embed

Reading the documentation of .flex-video and .responsive-embed classes does not help to distinguish the difference between them. And testing them is not helpful either as we get, obviously, the same ...
Billal Begueradj's user avatar
4 votes
Accepted

Responsive Websites <meta name="viewport" content="width=device-width, initial-scale=1">

The best answer for this is in a Stack Overflow post: https://stackoverflow.com/questions/61238548/side-effects-of-removing-width-device-width-from-viewport-meta-tag-when-initi Relevant quote (...
Henry Visotski's user avatar
3 votes

SEO for links duplicated and hidden for responsive design

I'd suggest minimizing the amount of duplicate links. If this is not possible, then consider using different labeling for each link. For example, have the business logo at the top of your site as a ...
Mike -- No longer here's user avatar
3 votes

Google mobile friendly test is reporting "resources not loading"

When the Google mobile friendly test says that a resource could not be loaded, it usually means that it is blocked by robots.txt. Check your robots.txt file and ensure that you don't disallow ...
Stephen Ostermiller's user avatar
3 votes
Accepted

AdSense ad display in media queries

You should refer to google documentation on how to modify responsive ad code If you want to only show ads for certain screen sizes you can use CSS to accomplish this. The following example shows you ...
Aakash's user avatar
  • 1,316
3 votes
Accepted

Google Search Console errors occuring and disappearing all the time

This is fairly common, however, the frequency that you are experiencing it is not. I manage SEO for a lot of websites, and only see this come up every once in a while. I hit "validate fix" ...
Mike Ciffone's user avatar
  • 6,435
2 votes

Rendering different HTML contents based on screen size - good idea from SEO perspective?

is it a good practice to render different HTML contents from server-side based on screen size?...Also, we prefer not to separate the website into two versions... No for a couple of reasons. As ...
Mike -- No longer here's user avatar
2 votes

Google mobile friendly test is reporting "resources not loading"

If the Status says "Other error", there seems to be no clear reason for it but appears to happen for heavy sites loading a lot of resources. I had the same issue and after a lot of searching,...
Anupam's user avatar
  • 121
2 votes

Should I split a large CSS media queries file into separate files for each screen size?

As @dalore mentioned in a comment, you might want to split the css by media query to reduce the amount of render blocking resource While it's not a download saver it is in a way. A browser will ...
Rafael Lebre's user avatar
2 votes

m.example.com vs. responsive website

If I am keeping both the website live, I feel google will find duplicate content which will impact directly on the search engine ranking. Google knows the difference and will not see it as duplicate ...
norcal johnny's user avatar
2 votes

Auto Re-Size YouTube Embedded Video

You can try this: Remove the height and width from the embed code and put it between a div class and add a class to the iframe just like this: <div class="youtube"> <iframe src="//www....
franfernandz's user avatar
2 votes
Accepted

Structured data. Img. Width

Schema.org’s height/width properties are not for stating in which dimension the image should be displayed, but which dimension the image file has. Knowing the image’s height/width, consumers (like ...
unor's user avatar
  • 21.8k
2 votes
Accepted

How to avoid request of all images used for different devices using media query?

You wouldn't want to use CSS based media queries in any case because browsers will download all those images regardless if they are being shown or hidden. You can achieve what you want using either ...
Simon Hayter's user avatar
2 votes
Accepted

GTmetrix complains of un-optimized images in responsive design

The best way to optimize page performance yet serve high-res images to high-dpi clients is to use the img srcset HTML attribute, like this: <img srcset=" /img/image4x.jpg 4x, /img/image3x.jpg ...
Maximillian Laumeister's user avatar
2 votes

What are the most frequent viewport sizes to use in responsive design?

According to Statcounter those are currently (10.2022) the most used monitor sizes: 1920x1080 - 8.87% 1366x768 - 6.63% 360x800 - 5.91% 1536x864 - 4.09% 414x896 - 3.65% 390x844 - 3.6% Percents are an ...
Evgeniy's user avatar
  • 10.1k
2 votes

My site is very old and is intended for desktops but 60% visitors are mobile

Actually, responsive web design is really easy to implement in this day and age. Gone are the days when you needed to design two different sites, or compromise on your overall layout to make everyone ...
Keith's user avatar
  • 203
2 votes
Accepted

Is there a CSS or JS solution to stop bad word wrapping arround images on mobile?

Definitely a css thing. One solution is to use a css @media (min-width: XXXpx) query to disable wrapping if the screen width is small (e.g. set float: none on your figure element containing the image)...
Maximillian Laumeister's user avatar
2 votes

How to manage page caching to serve different AdSense units for Mobile and Desktop

If you want to display ad units based on mobile vs desktop - you can try using CSS media query that sets display: none on the ad unit to hide it. So you always have 2 ad units, but for desktop (wide ...
Mikita Belahlazau's user avatar
2 votes

How to check template on safari desktop and mobile without mac?

You have three options: Buy some Apple devices just for testing. Install Safari on Linux using Wine and trust that mobile devices work enough like it. Subscribe to a cloud-based browser testing ...
Stephen Ostermiller's user avatar
1 vote

Two menus one for desktop one for mobile, screen reader issues?

According to https://webaim.org/techniques/css/invisiblecontent/ screen readers ignore content that is set to display:none;. When you hide one or the other menu, modern screen readers should be ...
Stephen Ostermiller's user avatar
1 vote

Does it matter if I use a different design elements for desktop and mobile versions of my site?

yes, and no If I understand your question correctly, your site is not actually responsive, in that you/your viewers are not able to adjust the width of the desktop browser and have the site ...
elbrant's user avatar
  • 890
1 vote
Accepted

Server.Transfer method for mobile version

As far as I understand Server.Transfer method is better than the old Response.Redirect method because its improve server request performance by reducing the number of requests. To me that is good ...
Raul Reyes's user avatar
  • 2,476
1 vote

Dynamic Serving with different url

You can use for mobile SEO different options as long as the web implementation is correct: Responsive design Dynamic serving Separate URLs In the case of dynamic serving, you should use the same URL ...
Emirodgar's user avatar
  • 3,817
1 vote

Responsive web design causes social media buttons to overlap the logo on smaller screens

It looks to me that you are using a 'float: left' or 'float: right' to format that header. Consider, instead, the following: #logoid, #social-buttons { display: inline-block; } #...
kegepet's user avatar
  • 11
1 vote

Responsive web design causes social media buttons to overlap the logo on smaller screens

Use @media in your CSS. It allows for you to have one design for desktop screen sizes and one design for mobile screen sizes. You have to use the meta viewport tag as well which it appears you are ...
Michael d's user avatar
  • 4,803
1 vote

Delivering the optimal image experience to all from website regardless of device

Getting images to display well on different devices requires responsive images. That is preferred to having multiple "sites" for different types of devices. It doesn't require big bandwidth changes. ...
Lena Weber's user avatar
1 vote

Delivering the optimal image experience to all from website regardless of device

Bootstrap class="image-responsive", will that work? https://www.w3schools.com/bootstrap/bootstrap_ref_css_images.asp
JustJohn's user avatar
  • 181
1 vote

How long will Google Search take to recognize that a website is now mobile-friendly?

I changed 3 of my websites to support mobile on November 5, more than 2 months ago. I've also used search console to push crawl of mobile version but still see: Your page is not mobile-friendly. ...
Женя Тест's user avatar
1 vote

How long will Google Search take to recognize that a website is now mobile-friendly?

It generally takes Google 2 to 4 weeks to make changes in the search results when Googlebot first has to crawl your site to notice the changes. Since it has been three weeks already, I would expect ...
Stephen Ostermiller's user avatar
1 vote
Accepted

Do certain ads need to have fixed dimensions even for a responsive website

It's depend on what kind of ad network you're using. If you're using Google Adsense, then it is good choice to go with responsive ad unit. Your marketing team said, 300*250 pays more than responsive ...
Goyllo's user avatar
  • 5,507

Only top scored, non community-wiki answers of a minimum length are eligible