Issues I had with Bootstrap:
- At the bottom of the zopyx.de front-page there is an image section with reference customer logos. The number of images to be displayed depends on the width of the browser windows (for desktop browser I am using six images, iPad in landscape mode shows up with five images and iPad in portrait mode displays 4 images). By default Bootstrap on iPad moved two references logos into a second row because six images did not fit into one row...working but ugly....as a workaround I added some media queries just hiding the 5th or 6th logo depending on the width of the browser window.
- For iPhone I made the decision to disable parts of the front-page e.g. the large image slider and the customer references do not show up (display: none). However the images are still being loaded although not loaded...nasty and a waste of bandwidth.
Although I am pretty happy with the result so far I am convinced that the current programming model for responsive sites is partly broken.
Decisions when to render what and how is scattered among different places
- CSS (with media queries)
- backend code