Please help me with improving dlang.org

aldanor via Digitalmars-d digitalmars-d at puremagic.com
Sun Jan 18 09:51:06 PST 2015


On Sunday, 18 January 2015 at 17:05:28 UTC, Andrei Alexandrescu 
wrote:
> On 1/18/15 9:02 AM, aldanor wrote:
>> This is usually solved by media queries / responsive design / 
>> grid
>> frameworks, sorry if I'm stating the obvious :) Try resizing 
>> the
>> commonly used websites and see what happens, e.g. for 
>> ruby-lang you have
>> at least 3 "versions" which are selected automatically based 
>> on the
>> current viewport's settings which the browser provides:
>> http://imgur.com/a/gE38d
>>
>> E.g. the menus on the left getting folded into one mobile 
>> "button" which
>> expands them on demand and leaves more space for the actual 
>> content, or
>> some elements disappearing in smaller viewports altogether 
>> (like the
>> twitter feed div). This is quite a pain to manage manually 
>> without
>> having an underlying grid framework.
>
> My understanding is there are various simpler way to do this, 
> e.g. separate styles for small screen devices, redirection to a 
> different URL, setting "hidden" to certain DIVs dynamically 
> etc. etc. As you saying there's no way to do this unless we use 
> some grid framework I know nothing about and probably need to 
> learn? -- Andrei

The thing with frameworks is that some designers have put a 
considerable amount of time on putting them together, making them 
cross-browser compatible, working around various edge cases etc 
(and there are many...) -- so that you won't have to. Once you 
want something like responsiveness + automatic reflows, things 
start getting even more complicated... Not all frameworks are 
gigantic like bootstrap/foundation, there's some smaller ones 
that just do the grid thing (like 960). (that, or you can always 
pull just the bits you want from bootstrap or anything and minify 
it). Another point is that if you use the elements the framework 
provides (e.g. navbar menu), they would be already nicely 
compatible with the framework's grid system. As an example -- try 
resizing the width here and see what happens: 
http://getbootstrap.com/examples/grid/.

There's also some minimalistic frameworks -- like PureCSS, just 
to give an example -- http://purecss.io and 
https://github.com/yahoo/pure, where the entire grid system is 
just 0.8KB.


More information about the Digitalmars-d mailing list