Grow your CSS skills. Land your dream job.

Mobile Design

  • # March 6, 2013 at 12:55 pm

    I’m going to create my own simple website project because I want to learn how mobile design works. Was wondering if anyone can help me out real quick? When I create a site I put in all my css and name my css file main.css.

    Do I link it to my css but for media put screen?
    Then I have to create a new css file and call it mobile.css, then link it to that css and change media to handheld?

    When I create my main.css instead of using pixles I use percentages?

    # March 6, 2013 at 1:41 pm

    I would download something like [Ratchet](https://github.com/maker/ratchet “”) and look at what they use.

    # March 6, 2013 at 3:41 pm

    @johnjf are you interested in [Web or Native mobile apps](http://sixrevisions.com/mobile/native-app-vs-mobile-web-app-comparison/)?

    I know nothing little about Native apps!

    As for the Web apps, I’ve learned a lot about building mobile first responsive websites by looking at the [Andy Clarke’s 320andup boilerplate](http://stuffandnonsense.co.uk/projects/320andup/). Following [writings of Luke Wroblewski](http://www.lukew.com/ff/entry.asp?933) and [Ethan Marcotte](http://ethanmarcotte.com/).

    # March 6, 2013 at 5:35 pm

    Web, I’m just trying to create a normal simple site that will be able to fit in any screen.

    # March 6, 2013 at 6:46 pm

    Johnf,

    If you want to go mobile first you could do this:

    For desktop first the other way around of course.
    I personally prefer to put everything into one css file, especially for a small site.
    For the desktop view you will probably want to set the wrapper width in pixels, or a max width. For small screens I recommend 100%. Look into responsive grid systems to make your life easier.
    Oh – and the polyfill if you go mobile first: < https://github.com/scottjehl/Respond>

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".