How can I customize an HTML page for mobile users?

Is there an easy way to make an HTML page automatically set up for mobile phone users? My page: http://www.xiexianhui.com/baxjoomla15/index0.html does not seem to fit into my sony xperia ray phone.

+6
source share
3 answers

You should first look at Responsive Web Design concepts. There are too many, and this question is too general to answer everything. But in a nutshell, it requires 3 components:

  • Media queries to deliver different CSS styles for different screen sizes.
  • The fluid grid is css, so the site layout automatically adapts to the screen size.
  • Flexible images, so all images are reduced so that they do not overlap the content container.

If you just want your site to be fully displayed on the phone screen, you will need to use the meta tag

and your page will fit the screen perfectly. But now you will notice that everything is exceptionally small and unsuitable. Crucial web design is the solution for this.

+13
source

To cope with what has already been said: WURFL, http://wurfl.sourceforge.net/ , Fi Universal Universal Resource FiLe is a device description repository (DDR), that is, a software component that maps HTTP request headers to an HTTP client profile ( Desktop, Mobile Device, Tablet, etc.) that issued the request.

One shortcut. Prepare 3 different layouts that will cover basic old phones, new color phones, and high-end phones and PDAs. This is a fairly simple task and at the same time gives excellent results. I would also look at this link. http://mobiforge.com/developing/story/introduction-wurfl

0
source

Try Bootstrap. Do I need to talk more?

http://getbootstrap.com/getting-started/

-1
source

Source: https://habr.com/ru/post/918598/


All Articles