====Background
This task aims to implement the designs for the `longtext` view on the microsite. Users(controlled group) will encounter the articles when they land on the dedicated `longtext` page, either after:
- clicking on an advertisement through a social media platform
- or selecting a category from the longtext microsite homepage. Designs in this task will focus on UX and visual design aspects of the longtext which are based on the findings from unmoderated usability tests.
====Description
- URL to the `longtext` microsite
- [[ https://phabricator.wikimedia.org/T345554 | Home & Category view ]]
- [[ https://phabricator.wikimedia.org/T345553 | Longtext Article view ]]
- Ts & Cs, content sources & licences
====Design
**Includes: **
- **Article Title:** This will be displayed at the top of each article e.g. Nelson Mandela.
- **Content: **
- Sections and Subsections: All content sections and subsections sourced from English Wikipedia mobile article. By default,
all sections, excluding the introduction(lead paragraph), will be in a collapsed state for a concise, user-friendly view.
- Images and Multimedia: All visual and multimedia elements from the Wikipedia article will be incorporated.
- Related Articles: At the end of each article, there will be a "Related Articles" section. Its presentation will mirror how it’s
displayed in Wikipedia’s mobile web version.
- Fine Print: The content will be accompanied by a note at the very bottom stating, //"Content is available under CC BY-SA 4.0,
unless otherwise noted."//
- Terms and Privacy: Just below the fine print, links to "Terms of Use" and "Privacy Policy" will be provided for user reference.
**Excludes: **
- **Branding:** The Wikipedia wordmark will not be present.Includes:
- ** Header/Chrome:** The standard Wikipedia header or Chrome will be omitted- Article Title e.g. Nelson Mandela.
- **Blue Links:** Hyperlinks will not be present- Content: Text and Images with collapsable sections similar to the current mobile experience; sourced from English wikipedia.
- **References:** All footnotes and references will be removed.- Option to view the other 3 `articles` within the same category.
- **Toolbar:** The toolbar, which includes options like language selector,- Homepage with 7 categories; downloading PDFs, and editing,4 `articles` under each.
Excludes: will be excluded.
- **Info Box:** The information box will not be incorporated.- Branding
- **See also:** We will exclude this one too.- Blue links, References, Left panel links, Top menu, Tabs [we are limiting the depth of navigation for simplicity]
**General Notes for Design:**
- Font & Typography: Render the text as it appears on the mobile version of Wikipedia.
- Collapsing mechanism: Retain the same behavior for collapsing and expanding sections and subsections as in the mobile view of a wikipedia article.
- Image placement & size: Maintain the image placements, sizes, and captions as they appear in the mobile version.
- Scrolling behavior: Keep the scrolling experience consistent with the mobile version of Wikipedia.
Error states
====Acceptance Criteria
TBA
====Test Scenarios
# speed of loading images
# user experience on different devices
# navigation (mobile-first):: Home & Category view, Article view
====Open questions
- Traffic from the social/paid media ads being redirected to a `longtext` article and [[ https://phabricator.wikimedia.org/T343990 | randomising ]] the assignment to the control group.
- TBA.
- Should a user be able to view & navigate to the `highlight` microsite?
- No.