Okay, first off, I am not sure if I should post this here but I have a question.
I've read somewhere that most people tend to use their phones when accessing a site. (or forum) I have a question for the skinners of MyBB community. Whenever you design, do you always consider on creating it to be responsive? If so, how do you usually place the HTML elements in mobile (or smaller) version? Is there any specific tips on how you should code?
Thank you!
PS. I ask this because I'm currently working on one. And, sorry for my bad English.
I've just gotten started in theming myBB so here is my take.
A lot of people do access forums using their phones or tablets. I can speak from personal experience. I don't mind pinching to zoom in on a forum but I suppose mobile themes add a nice touch to a site. It makes the design feel more complete, more deliberate.
Making a theme mobile friendly requires an understanding of the viewport. You can think of it as the screen resolution of your computer. Yours might look ideal at 1280 x 720 but a smaller, older screen would be best viewed at 800 x 600 resolution. So it follows that a small mobile screen won't look its best at the same resolution that looks best on a computer.
It's also important to know about media queries. Essentially, using media queries means you can target CSS properties and style them specifically for small screen sizes without messing up the rest of your stylesheet.
Start from the smallest resolution and then, design up to the biggest.
That's the easiest way to make a responsive design.
(2017-02-21, 06:23 PM)beautes Wrote: [ -> ]I've just gotten started in theming myBB so here is my take.
A lot of people do access forums using their phones or tablets. I can speak from personal experience. I don't mind pinching to zoom in on a forum but I suppose mobile themes add a nice touch to a site. It makes the design feel more complete, more deliberate.
Making a theme mobile friendly requires an understanding of the viewport. You can think of it as the screen resolution of your computer. Yours might look ideal at 1280 x 720 but a smaller, older screen would be best viewed at 800 x 600 resolution. So it follows that a small mobile screen won't look its best at the same resolution that looks best on a computer.
It's also important to know about media queries. Essentially, using media queries means you can target CSS properties and style them specifically for small screen sizes without messing up the rest of your stylesheet.
Yes, I always consider "What if the site is viewed on smaller screen?" and that's why I am conflicted and always TRY to think a way to actually fit the elements naturally which makes it a bit forced(?) or a lot more unnatural than it was before.
And yes, I am studying media queries and used some for testing.
Thank you!
(2017-02-21, 06:58 PM)eNvy Wrote: [ -> ]Start from the smallest resolution and then, design up to the biggest.
That's the easiest way to make a responsive design.
What do you mean by smallest resolution? You mean computer screen or the mobile screen size? And should I also scale the elements on that size you mention? Thank you.