Template talk:If mobile

Page contents not supported in other languages.
From Wikipedia, the free encyclopedia
WikiProject iconUsability
WikiProject iconThis template is within the scope of WikiProject Usability, a group of editors promoting application of web and user-interface usability best practices in the presentation of Wikipedia content. For more information, such as what you can do to help, see the main project page.

What a template![edit]

To editor Evad37: this is one awesome template. I think I can use it to improve mobile accessibility to my RM closures. It's being tested at Talk:Noddy (character)#Requested move 19 February 2022. Previously on that closure, the decision within the Tmbox only appeared in desktop view and was unavailable to mobile view. Couple things... 1) can we make this work in template space to accomodate template move requests, and 2) we need to get news of this template spread to a broad spectrum of Wikipedia users, because it must have thousands of applications (or more). Outstanding work! P.I. Ellsworth - ed. put'r there 07:11, 7 March 2022 (UTC)[reply]

I agree—it's extremely useful, and we should use it more (along with other detection templates). At their best, they can help personalize users' experience so that they're shown only the information useful to them. {{u|Sdkb}}talk 07:27, 7 March 2022 (UTC)[reply]

Dependencies?[edit]

Hi Evad37, Does this template require any special conditions to work, or could it just be copied over to another project and would work there? I am thinking of en:Wikivoyage. Cheers, · · · Peter Southwood (talk): 18:04, 22 March 2022 (UTC)[reply]

Template:If mobile/styles.css is certainly required, but I'm not sure if there's anything beyond that. {{u|Sdkb}}talk 19:27, 22 March 2022 (UTC)[reply]
Thanks Sdkb. · · · Peter Southwood (talk): 07:10, 23 March 2022 (UTC)[reply]

Stopped working?[edit]

Resolved

To editors Evad37 and Sdkb: it appears that this template has stopped working. Even the mobile view example on the /doc page doesn't work anymore. It was working great and then it just suddenly stopped working. What's up? P.I. Ellsworth - ed. put'r there 23:01, 14 April 2022 (UTC)[reply]

Could something have gone amiss after this recent software upgrade? See my inquiry at mw:Talk:MediaWiki 1.39/wmf.7#Template stopped working on enwiki. Also posted info to the Village Pump. P.I. Ellsworth - ed. put'r there 02:25, 15 April 2022 (UTC)[reply]

To editor DLynch (WMF): thank you for reverting my flawed resolve! Using the sandbox to try to fix this, but if you know how to fix it, I'll stop. Will continue to test until I hear from you. P.I. Ellsworth - ed. put'r there 20:54, 15 April 2022 (UTC)[reply]

On what page has it stopped working? What are the steps to reproduce the problem? Nardog (talk) 22:24, 15 April 2022 (UTC)[reply]
To editor Nardog: there is an example on the doc page, a link under Template:If mobile#Normal usage to this mobile view. Also, I've been using this template for my RM closes, because I use a template that does not appear in mobile view. My recent close at Talk:Magnesium sulfate (medical use)#Requested move 28 March 2022 is an example of this. Click the mobile view link at page bottom, and the text in the first parameter of this template should appear, but it doesn't. I check this each time I close an RM, and this template has worked fine up to just recently.
Was just checking the links I gave just above, and this template appears to be working now. Perhaps this work by DLynch (WMF) has brought this template back to life? P.I. Ellsworth - ed. put'r there 02:50, 16 April 2022 (UTC)[reply]

To editor DLynch (WMF): thank you again, this time for this edit. Your edit has returned this template to working status. I jumped the gun once, and I don't want to do it again. So in addition to your comment, "Because of how TemplateStyles and MobileFrontend work, it's not possible to directly test for whether the mobile site is being used in a TemplateStyle. As such we'll use Minerva as a proxy. This is imperfect.", would you say that this issue is resolved? at least for now? P.I. Ellsworth - ed. put'r there 07:53, 16 April 2022 (UTC)[reply]

Sorry, I totally missed this question at the time (oops). It is indeed resolved for now -- though we could do it even better now, since I added a specific class to MobileFrontend that we could trigger from rather than having to guess based on Minerva... DLynch (WMF) (talk) 17:02, 22 September 2022 (UTC)[reply]

{{If mobile}} not work on monobook skin[edit]

Unresolved

If you use Desktop view browse If_mobile/testcases with monobook skin on cellphone, {{If mobile}} will display nothing.

If_mobile/testcases with monobook skin on PC If_mobile/testcases with monobook skin on cellphone

The timeless skin seems to have the same problem.

I think this is a BUG. -- Nanachi🐰Fruit Tea(宇帆·☎️·☘️) 13:36, 27 October 2022 (UTC)[reply]

It only happens if "Enable responsive mode" is enabled at Special:Preferences#mw-prefsection-rendering and the window is narrow enough to trigger the responsive mode in the screenshot to the right. It also happens on a desktop PC with a narrow window. I would first have tried to report it at Template talk:If mobile where DLynch (WMF) wrote: "I added a specific class to MobileFrontend that we could trigger from rather than having to guess based on Minerva". PrimeHunter (talk) 15:35, 27 October 2022 (UTC)[reply]

How to fix?-- Nanachi🐰Fruit Tea(宇帆·☎️·☘️) 11:16, 2 November 2022 (UTC)[reply]

Test skins, print, and screen readers[edit]

This template was mentioned at Talk:List of winners of the Rotterdam Marathon#Table abbreviations as a possible way to fix mobile and print accessibility for abbreviations when no hover is available to read the hidden title.

I noticed the doc doesn't mention skins, printing, or screen readers, so I took the liberty to test. Although this template has no media styles to affect printing, and Narrator reads what is displayed, I tested them anyways to be thorough.

Test content: {{If mobile|Mobile|Desktop}} version
Browser: Windows 10 Chrome
Screen reader: Windows 10 Narrator

Skin tests for desktop and mobile versions of the URL when displayed, printed, and narrated:

  • Vector (2022) - correct
  • Vector legacy (2010) - correct
  • MinervaNeue - incorrect "Mobile" on desktop version; correct on mobile version (strike: fixed) correct
  • MonoBook - correct
  • Timeless - correct

I doubt the MinervaNeue skin is fixable since the desktop version appears to use the same styling as the mobile version. I didn't dig deeper into the styling. A disclaimer should be added.

Although disabling JavaScript didn't affect the display, disabling CSS did where the content becomes corrupt and both were displayed as "DesktopMobile version". This will affect crawlers, as already indicated in the doc for search engines, as well as other sites that recycle Wikipedia's content. I wouldn't say all screen readers work since I'm unfamiliar with the vast majority of them where some may read from a non-standard browser or get the content by other means.

Per MOS:PRECOLLAPSE, features that would cause content to be hidden or corrupted when CSS or JavaScript is unavailable must not be used. However, consideration for users without CSS or JavaScript should extend mainly to making sure that their reading experience is possible; it is recognized that it will inevitably be inferior.

In my example, the content becomes corrupted and unreadable as "DesktopMobile" and shouldn't be used to show/hide two versions of inline content, even if spaced. This template might be usable around complete blocks of content to show/hide two versions of the same content (technically not hidden but swapped) or, when no CSS, show both versions (reading possible but inferior). I think more explanation is needed on the doc about its usage and restrictions according to MoS. More discussion with the MoS experts wouldn't hurt either. Jroberson108 (talk) 08:49, 13 January 2024 (UTC)[reply]

I've made some changes in the sandbox that fix the detection for minerva, and the bug for responsive skins on the desktop website. It also adds a hidden fallback separator for no-CSS (default: spaced slash) between the mobile and desktop content, so that without CSS your example above would be "Desktop / Mobile" rather than "DesktopMobile". Haven't tested for narration, or the Android and iOS apps. - Evad37 [talk] 16:07, 13 January 2024 (UTC)[reply]
MinervaNeue is fixed. Before, I didn't test disabling "Enable responsive mode" with a narrow browser, which with the live styles I only see an issue with Timeless not MonoBook. They all work with "Enable responsive mode" disabled on sandbox.
As far as adding a spaced slash, with my basic example it makes the two words readable, but can you still say the same thing if it were in a sentence or longer and in a paragraph? "I'm on the desktop / mobile version" makes no sense affecting the "reading experience". That's why I question it's use with inline text, especially in prose. That's why some MoS experts might need to get involved. Keep in mind that some uses only pass a value in for one parameter leaving the other blank. Jroberson108 (talk) 20:12, 13 January 2024 (UTC)[reply]
I just noticed the "tag" parameter. It gets real interesting if no CSS and {{If mobile/sandbox|tag=div|Mobile|Desktop}}.
Desktop
/
Mobile
Jroberson108 (talk) 20:44, 13 January 2024 (UTC)[reply]
It works with all skins on Android using Chrome, although all skins looked the same and may not apply to mobile. I don't have an iOS device. Does not display anything on the Android Wikipedia app. like the template isn't used. I don't use the app, and it probably has a lot of problems. Jroberson108 (talk) 21:14, 13 January 2024 (UTC)[reply]