0

i'm designing for web since 2006. i waste a lot of time ignoring things like bootstrap... i understand how grids(and the specific bootstrap) work. But i have a "theorical" question about it: How to take decision like "width of a element" in design step(e.g. drawing in sketch app). I can't handle this questions without struggle with bootstrap grid system. This problem completely dissolves when i'm directly "design in browser". But persists when i'm on a graphic software like sketch or photoshop. Sometimes i've to formalize some pages and drawn its UI's in these softwares. (english isn't my first language, sorry)

  • Sorry, questions here need to be related to operating or administering your website, not how to design them. This question is also very broad and opinion-based, so I'm not sure what other Stack Exchange site might be a better fit - perhaps User Experience. – dan Apr 19 '18 at 0:13
3

Anytime you're designing something that's going to be responsive, it helps to design multiple viewports. If it's for an existing site, look at analytics to find the most common resolutions people use when viewing your site, and grab the top 3 along with some sample images and text so you can decide when things need to reflow.

If you're designing a new site, you can always check StatCounter's global statistics or since you are planning to use a framework stick with their definition of small, medium, and large. Design even your wireframes at these top breakpoints and then as you are actually coding and adding real content, you can make minor adjustments rather than trying to determine breakpoints while you are in the midst of coding.

Personally, I like to design in Illustrator and use multiple artboards - I use the top 3 most common viewport widths and design at least a couple of pages. If you create a pattern library and reusable components, you can become even more efficient.

All that said, Bootstrap is becoming a bit dated and I'd encourage you to begin looking into CSS Grid instead, if your users are using modern enough browsers that you won't have to code everything with a ton of fallbacks. You'll likely save a lot of lines of code.

  • Agree that Bootstrap isn't anything to get into at this point. Legacy websites and WordPress themes will keep it around a while longer, but the front end dev community is mostly moving on. – Henry Visotski Apr 18 '18 at 20:51

Not the answer you're looking for? Browse other questions tagged or ask your own question.