Difference between revisions of "Nookipedia:Project Interface"
m (→Members: typo) |
SuperHamster (talk | contribs) (→We encourage:: +CSS grids) |
||
Line 24: | Line 24: | ||
* Prioritizing vertical orientation of templates, or flexible templates capable of shifting their aspect ratio | * Prioritizing vertical orientation of templates, or flexible templates capable of shifting their aspect ratio | ||
* Maximal information in minimal space to avoid excessively long pages/lots of scrolling | * Maximal information in minimal space to avoid excessively long pages/lots of scrolling | ||
+ | * Use [https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout CSS Grids] to create responsive designs and lists (e.g. see [[Template:VillagerGallery]] in action at [[Dog]]). | ||
== Members == | == Members == |
Revision as of 05:24, May 13, 2020
Welcome to the project page for Project Mobile! For more information about the project and our objectives, please read on. If you would like to comment on our progress, please use the talk page. If you're interested in joining, simply add your name to the list of current members.
Purpose
This project is focused on improving Nookipedia's mobile implementation and establishing mobile-focused design standards that enhance the user experience. One of the project's main areas of focus is the development of templates and tables that display well across a variety of devices.
Guidelines
These general guidelines aim to improve the mobile experience on the site, as over 70% of Nookipedia's readership comes from cellular or tablet devices. Following these suggestions will reduce the amount of clutter within our template and article pages, providing our users with a more productive reading and editing experience.
Please avoid:
- Hovertext generated using template {{tt}}
- Expand/collapse buttons generated using
class="collapsible"
- Instead use the tabs extension as documented here.
- Placing tables within tables
- Instead use a series of
<div>
s or consider simplifying your layout.
- Instead use a series of
- HTML & CSS styling on article pages
- Instead limit HTML and CSS styling to template pages.
- Duplicating wikitext code or CSS styling in template pages
- Instead consider utilizing the loops extension.
We encourage:
- Setting template widths to 100% to occupy the full width of the mobile display
- Prioritizing vertical orientation of templates, or flexible templates capable of shifting their aspect ratio
- Maximal information in minimal space to avoid excessively long pages/lots of scrolling
- Use CSS Grids to create responsive designs and lists (e.g. see Template:VillagerGallery in action at Dog).
Members
If you wish to join Project Mobile simply add your name to the list of current members below.
Current