H1 on responsive pages - Not enough room

[JoaoCJ]

Hi everyone,

I'm running a Real Estate site, and I'm wondering how to deal with H1 for a responsive version for my search results.

My first idea is to have a dynamic H1 that changes according to the filters that are being used, for instance:

140 Apartments on Sale at Miami Beach with 2 bedrooms, so I just used 4 filters

Now the problem arrives if a mobile user comes around, I can't show him the same H1 since I don't have enough room for it. Do you guys think it might be a problem if I just show that H1 just in html and not on the user sight?, or perhaps there is a way to switch the H1 whenever the responsive version is active or not.

Any help would be much appreciated it.

[TimHolmes]

Hey there JoaoCJ, personally I would recommend trying to keep the H1 on both sites, I would imagine it would be better for mobile users and the mobile indexation of the site to have it.

If you are worried it is too big I adapt the H1 css to make it not as big or prominent to ensure it fits the look and feel you want for mobile users.

[Hurf]

The solution to this doesn't need to be complicated. You should keep the H1 in place across all devices. To do so, set H1 size using EM, rather than the more traditional PX. Em is a scalable unit. An em is equal to the current font-size, for instance, if the font-size of the document is 12pt, 1em is equal to 12pt. Ems are scalable in nature, so 2em would equal 24pt, .5em would equal 6pt, etc. Ems are scalable and, therefore, mobile-friendly.

I hope that helps.