seo Question posted in
Some basic information to get you started with this can be found here.

How to make website responsive for feature phones (having very small screens) – SEO

I’m developing a web app for feature phones in Africa (non- smartphones whose screen size is usually 128 x 160 px (1.80″)).

I need to learn how to make the website responsive, or display properly for a screen size so small. I’m aware that regular CSS queries dont work well for feature phones, so any other suggestions?

This:

https://developers.google.com/webmasters/mobile-sites/mobile-seo/other-devices/feature-phones?hl=en

is something I read on the topic, but it’s vague for me to understand what changes to make in my CSS file (which is using bootstrap at the moment) Will really appreciate your help!

Tags:

2

Answers


  1. 0

    You can either try things like foundation which you can use pre-made tables, and sections with pre-defined css properties:
    http://www.foundation.zurb.com/

    Or you can use percentages, width: 15%. So it will get the designated percentage of your device and calculate the correct size based on that.

    Also what your listed site is saying(google), it creates different css files based on your device. So when you use <link> to set your CSS file you can make it so certain devices use certain files:
    (Taken from Google):

    <link rel="alternate" media="only screen and (max-width: 640px)" href="http://m.example.com/page-1" />
    Login or Signup to reply.
  2. 0

    To make a website responsive we have to use CSS3 @media queries. Write @media queries for different screen sizes. But @media queries doesn’t support for older version browsers. In your case (non-smartphone) @media doesn’t work. I suggest create a sub domain for mobile phones like http://m.website.com and use javascript to redirect to mobile version site if user opens http://website.com .

    @media only screen 
  and (min-device-width: 128px) 
  and (max-device-width: 160px) 
 {

/* Put your CSS Code for small screen */
}

    Some useful articals about @media .

    http://code.tutsplus.com/tutorials/quick-tip-a-crash-course-in-css-media-queries–net-14531

    http://www.htmlgoodies.com/html5/tutorials/an-introduction-to-css3-media-queries.html

    https://css-tricks.com/logic-in-media-queries/

    http://www.smashingmagazine.com/2010/07/19/how-to-use-css3-media-queries-to-create-a-mobile-version-of-your-website/

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search