Responsive Design - Bootstrap vs AEM Grid

Forum|Forum|9 years ago
November 20, 2016
6 replies
7625 views

We are migrating our website to AEM 62 from other CMS. We made our site responsive last year by using bootstrap framework.

Now, I would like to bring in the responsive feature of current site as is by using bootstrap . A lot of effort was spent on this project and i don't want to waste it by changing to AEM Grid. Saying that I would like to know if anybody else has faced similar challenge.

I would like NOT to use AEM responsive grid for following reasons:

1. We already have designed everything based on bootstrap responsive grid framework and multiple sites are already using it. Changing it to use AEM responsive grid would be one huge task.

2. AEM responsive grid allows content authors to configure grid sizes which seems overkill to me, IMO, Content Authors should get predefined list of breakpoints for the layouts and they should decide which one to use from that list instead of configuring the grids themselves.

3. Also this grid configuration feature seem to be available for individual component. IMO, how components behave at different break point is a design controlled feature, not content authors controlled feature.

Please let me know if I am thinking in wrong direction or I am missing something.

Also if I use bootstrap, what would be the best approach to integrate it with AEM?

TIA

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

Best answer by Peter_Puzanovs

It's your choice Aemd. My suggestion would be to use what AEM provides,

As without using AEM systems and frameworks it provides, you won't get full power of AEM!

Alternatively, bootstrap you might find these resources useful,

[1] http://help-forums.adobe.com/content/adobeforums/en/experience-manager-forum/adobe-experience-manager.topic.html/forum__cxer-hi_team_i_havef.html

[2] https://github.com/smithstone-oss/aem-bootstrap

Regards,

Peter

Peter_Puzanovs

Accepted solution

Community Advisor

It's your choice Aemd. My suggestion would be to use what AEM provides,

As without using AEM systems and frameworks it provides, you won't get full power of AEM!

Alternatively, bootstrap you might find these resources useful,

[1] http://help-forums.adobe.com/content/adobeforums/en/experience-manager-forum/adobe-experience-manager.topic.html/forum__cxer-hi_team_i_havef.html

[2] https://github.com/smithstone-oss/aem-bootstrap

Regards,

Peter

A

aemd25900338Author

Level 3

If I may ask, what specifically I would be missing if AEM Responsive Grid system is not used?

Will I miss out on some features or Will it increase the development effort? what is the real value of using AEM grid system as compared to using the bootstrap especially when I have UI already developed using bootstrap framework?

Another point is I will still have to use some framework for developing components. So why not use same framework for Grid and components?

D

divyak62111989

Level 2

Hi Aemd,

We are in the exact same situation as yours. Just wanted to know if you have found any solution for that.

Which approach have you taken finally?

A

aemd25900338Author

Level 3

I still haven't decided on the approach but we are moving fast towards making decision one way or another. Layout Container is not really author friendly as compared to having Column Control Component and it does not allow to enforce responsive standards but Layout container has become Adobe standard so it is tough decision to make.