https://en.m.wikipedia.org/
2012/5/18 Jon Robson <[email protected]> > Currently www.wikipedia.org is not mobile friendly - when served to a > mobile device it appears the same as the desktop site meaning a user > has to zoom and scroll around the page (see bug 30389 [1]). We can do > better! > > As a first step it made sense in my head that we should use media > queries for devices which support them to adapt the desktop site so it > is optimised for at least modern mobile users which would be a step in > the right direction. > > I made a couple of changes [2,3] on the www.wikipedia.org_template > (temp version) to support this. Firstly I moved inline styles into css > rules and then I added device specific css rules that use media > queries. This results in a mobile optimised homepage [4] for any > devices which have a max screen width of 480px (which was the width > that I judged problems with the desktop layout began to occur). > > I would appreciate thoughts on whether this is workable and what would > need to happen to move these changes over to the homepage. The current > desktop site stays exactly the same and I'm sure there are further > optimisations that can be made to make this adapted version prettier > (please do volunteer those if you believe you can improve it even more > so!). > > Going forward when device detection is built into the mediawiki core > it would be great to support other mobile devices which do not have > media query support by serving these additional styles without the > media query wrapper. > > Thank you for your interest and help in making Wikipedia more usable > to our growing mobile community! > Jon > > [1] https://bugzilla.wikimedia.org/show_bug.cgi?id=30389 > [2] > https://meta.wikimedia.org/w/index.php?title=Www.wikipedia.org_template%2Ftemp&diff=3764806&oldid=3754632 > [3] > https://meta.wikimedia.org/w/index.php?title=Www.wikipedia.org_template%2Ftemp&diff=3764927&oldid=3764806 > [4] http://bug-attachment.wikimedia.org/attachment.cgi?id=10619 > > _______________________________________________ > Wikitech-l mailing list > [email protected] > https://lists.wikimedia.org/mailman/listinfo/wikitech-l > _______________________________________________ Wikitech-l mailing list [email protected] https://lists.wikimedia.org/mailman/listinfo/wikitech-l
