Jump to content


Photo
- - - - -

Systems for responsive design

responsive design grid systems

  • Please log in to reply
3 replies to this topic

#1 AnthonyBrown

AnthonyBrown

    Forum Newcomer

  • Members
  • Pip
  • 1 posts

Posted 21 October 2017 - 07:43 PM

Hello, I know there are grid systems out there like Bootstrap, 960px-grid, etc.. but I don't know which to choose for a given project or why. Is there a grid system that is really common that I should just devote all my energy into learning? Or should I learn multiple systems because different systems might confer different benefits depending on the project?

 

Also, does anyone have any good resources/tutorials for learning how to approach wireframing/design with these grid systems?

 

Thanks!

 



#2 TimW

TimW

    Advanced Member

  • Members
  • PipPipPip
  • 270 posts
  • Gender:Male
  • Location:West Country
  • Experience:Intermediate
  • Area of Expertise:Nothing

Posted 21 October 2017 - 10:55 PM

Once you have got the hang of one css grid learning another will be easy, a ten minute job, but bootstrap has loads of other stuff in it which takes a while to get familiar with, it isn't just a grid. I used to like skeleton, it was just resets, some basic typography and a button or two plus an easy grid but it might be old hat now, You need to get some boilerplate from somewhere, you can't be writing everything from scratch.



#3 deshmukhavinash

deshmukhavinash

    Forum Newcomer

  • Members
  • Pip
  • 1 posts

Posted 23 October 2017 - 09:30 PM

I suggest you learn Bootstrap. It is not necessary but desirable. Bootstrap 4 is almost rock solid. Once you learn Bootstrap, it really easy to learn other systems. Plus, Bootstrap is built in scss and several components. You can customize it or trim it down, it is up to you. It is simply amazing. In fact, the Gzipped version of bootstrap is less than 50k - which in today's time is a breeze and a half.

If your are puritan and need to build for future, you will have to get your hands on CSS grids. They are the future.

Sent from my Moto G (5) using Tapatalk


#4 rbrtsmith

rbrtsmith

    ReferenceError

  • Privileged
  • PipPipPipPipPip
  • 4,033 posts
  • Gender:Male
  • Location:Manchester, UK
  • Experience:Nothing
  • Area of Expertise:Web Developer

Posted 24 October 2017 - 11:12 AM

The framework I have built uses a grid.  Bootstraps grid falls apart when you have items that tile and are not the same hight... not great for dynamic data.

On it's own Nebula is around 6kb which can be made much smaller if you really care about file size.

https://nebulaui.git...pi/objects/grid

 

 

CSS grid is a long way off being used in production lots of browsers that are still in heavy use do not have it implemented.  give it a few years and it will be the go-to tool for layout.

Also while grids work in most cases for responsive layout - what if you want to mix both fixed-width and fluid content side by side?
The flag object here accomplishes that https://nebulaui.git...pi/objects/flag


Edited by rbrtsmith, 24 October 2017 - 03:56 PM.






0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users