Jump to content

Designing for mobile phones


Lucy
 Share

Recommended Posts

I think I'm having a bit of a dense moment :P

 

I want to design a separate stylesheet for mobile phone screens because they're so small - but I'm keeping sizes to percentages/ems. So... when testing, what browser size do I use? The 300px or so that a mobile phone will be, or full sized?

Link to comment
Share on other sites

With opera browser you can add a addon which give you emulations of several mobiles, tablet of different sizes.

 

Found it - it's very good, thanks for the suggestion. Weirdly, some of the phones listed completely ignore my stylesheets... they're within the size range. Is this just something that happens, or is there likely to be something up with my code? If so, I can link you to the website, it should be live tommorow (I just got hosting for it, but the FTP won't work yet).

 

EDIT - Never mind, got it working.

 

 

Jonathanks - Thanks for the advice. I'm using @media screen though, just to be sure anything I wouldn't think of will be covered. Like people who want tiny browsers or something. And, er, I'm certainly not a 'master' of anything, lol :P I can make rather delicious chocolate brownies though...

Edited by Lucy
Link to comment
Share on other sites

Found it - it's very good, thanks for the suggestion. Weirdly, some of the phones listed completely ignore my stylesheets... they're within the size range. Is this just something that happens, or is there likely to be something up with my code? If so, I can link you to the website, it should be live tommorow (I just got hosting for it, but the FTP won't work yet). EDIT - Never mind, got it working. Jonathanks - Thanks for the advice. I'm using @media screen though, just to be sure anything I wouldn't think of will be covered. Like people who want tiny browsers or something. And, er, I'm certainly not a 'master' of anything, lol :P I can make rather delicious chocolate brownies though...

funny @chocolate brownies. Have you considered niche's suggestion? You can have different stylesheets. Make them responsive. Google it. One stylesheet takes care of larger screens, the other takes care of mobiles. Edited by Jonathanks
Link to comment
Share on other sites

funny @chocolate brownies. Have you considered niche's suggestion? You can have different stylesheets. Make them responsive. Google it. One stylesheet takes care of larger screens, the other takes care of mobiles.

 

Yeah, my website is already responsive, it just doesn't really work on the smallest screen sizes - needed a slightly different design.

 

 

You also have to take into account dpi or pixel density, some will be able to get up to 4 into normal pixel.

 

Oh dear :( This gets more and more complicated... well, my website seems to be working for most of the phones/tablets and stuff listed on this thing. I'm having an issue with tablets though, actually. They are large enough to display the site normally, but I have a fixed footer with my links in which apparantly cannot be clicked on on a tablet. It just scrolls down instead of allowing the cursor to rest on links, if you see what I mean. Do you think an actual tablet device would be different? I've only touched one of those things like three times, lol.

 

I worked through a ton of small problems tonight and it's looking like my portfolio site is finally nearing completion. :D (Well... ignoring the fact that internet explorer completely and utterly messes the whole thing up)

  • Like 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...