Blogarticle

Responsive & Google Mobile Only Index

SEO Responsive Bootstrap Breakpoints

Google's "Mobile Only Index" 

Originally announced in September 2020, by delayed due to the COVID pandemic, Google took the next step in its mobile-first optimization in March 2021: Mobile Only!

The reasons for responsive websites are manifold and originally started with search engine optimization. Meanwhile, a mobile-optimized website is an absolute standard and can be created easily and with a reasonable amount of programming effort. Frameworks like Bootstrap, Materialize, Uikit provide the necessary support here. 

Already since 2019, more than 70% of users access the internet from mobile devices. So, if we look at it the other way round, this means: Without mobile optimization, 70% of the users are shut out!

What exactly does "responsive" mean?

The most appropriate description is "reacting" – in other words, the layout of the website reacts dynamically to the different screen resolutions.

So, if the screen is larger or smaller than a certain size, different formatting rules apply to the website - so-called breakpoints mark these boundaries. 

 

Professional website - only this way!

So, for example, when searching for a website on Google or Bing from a mobile device, the websites that have been optimized for mobile phones or tablets are listed first. Thus, the requirement for any website programming is: mobile-optimized programming is a MUST!!

Our favorite: Bootstrap

In every website project, we too are faced with the challenge of implementing our customers' wishes and ideas while at the same time providing the website in a mobile-optomized version. In doing so, we have repeatedly made the experience that the bolide Bootstrap works best for us when it comes to efficiently programming a customized and at the same time mobile-optimized website. When creating websites with WordPress, we currently rely on the use of Elementor, which comes with its own CSS framework for responsive optimization.

Alternative to responsive design: a mobile website

Here, we distinguish between responsive web design - i.e. a website what adaps dynamically - and a mobile website. A mobile website in this case means a separate development specifically designed to meet the requirements of mobile usage.

An example: Let's take a car dealership: The users of the regular website are informed extensively about the current offers, here you can find everything about new cars, used cars, service, financing etc.

Users of the mobile website, on the other hand, only see a "slimmed-down" version of the website (e.g. mobil.autohaus-xyz.de), which only offers the following options:

  • Booking appointments (service / consultation)
  • Requesting a call back
  • New cars / Used cars
  • Test drive
  • Customer account

This means that on the mobile phone, the interested user can see specifically what he or she is looking for - for example, the company's services that customers need when they are on the road.

Experiences

One key experience in this regard is that mobile user numbers in particular can vary greatly from industry to industry. The key question here, as always, is:

What do the users need and how do they work?

So, it is the question of the maximum customer benefit - which brings us directly to the topic of "Use cases". Depending on the size of the project, it is essential to analyze and get to know your visitors - better yet: to understand them! And to combine this knowledge with optimum usability.

Similiar Articles

Das Barrierefreiheitsgesetz

Stichtag 28. Juni 2025 - Pflicht zur Barrierefreiheit für Unternehmen.

New website presence for a good cause.

With the help of the online marketplace created by us, the volunteer agency Schaffenslust can now easily facilitate volunteer placements.

Univortrag "Webentwicklung Hands-on"

Ein kurzer Einblick in die Hauptaufgaben eines Browsers, Grundlagen in HTML, CSS, Kommunikation zwischen Browser & Server und JavaScript Basics.