any tips for styling mobile and desktop
I'm full stack, but css isn't my strong suit.
I just finished my deployment pipeline. Now it's time to create some components.
Are there any easy ways to make sure my website looks good on mobile and desktop?
4 Replies
From my experience, planning is the most important part.
Actually think about what the layout of your interface should be both for the mobile and for desktop. It can be quite difficult if you just think about one and then have to adapt your old decisions on the fly.
Also, tailwind (if you're using it) is mobile-first, which you then override with
sm:, md:, etc. to make the design fit larger screen sizes. If you're using regular old css it doesn't matter which way you write your media queriesYou should first create a design layout in something like figma, else if you start designing everything on the fly its not a good experience because it could lead to you changing small bits till it feels good.
First create a mobile layout then desktop layout, because you can build up on mobile components and add more as desktop has more space to show things.
Tbh I dont like designing myself, so just go very clean and minimal.
my advice is to get some book about design,
https://www.designingui.com/
https://www.refactoringui.com/
https://www.practical-ui.com/
Refactoring UI
Learn how to design awesome UIs by yourself using specific tactics explained from a developer's point-of-view.
adhamdannaway
Practical UI
UI design book - Practical UI
A UI design book to learn a logic-driven approach to design intuitive, accessible, and beautiful interfaces using quick and practical guidelines.
thanks folks