I know this topic has been discussed already (“[AnkiWeb] Downloading decks UX”), but it seems to cause confusion for a lot of people:
These are two examples, but I’m sure they not the only ones out there.
So, I would suggest, if not moving the “Download” button to the top, at least making the button bigger, more visible or add some kind of text at the top of the page hinting at the button.
Since the button is already a different color and larger, perhaps it would help to see what download pages these reviews came from. If the pages were particularly long and disorganized in some way, that might give some clues as to how to help users find what they need.
By total coincidence I came across the first one just now, it’s from a deck called “JLPT N5 Vocabulary Deck - With Audio & Example Sentences”.
As for the download button I agree it’s not in a very good position. I have been using this app for 5 years, and I swear I still forget where to find the download button.
My other suggestion comes useful here:
Another day of me forgetting where the download button is. One pattern I notice is I keep thinking the download button is right after description and not right after the sample notes (where it actually is).
Pictures below are taken on the following shared deck page: https://ankiweb.net/shared/info/1194221613.
I’d prefer to add styling to the following (and I’m aware I cannot open PRs), but maybe the following code could be moved up at least?
<div class="mb-3"><button class="btn btn-primary btn-lg">Download</button></div>
<p>After the file is downloaded, double-click on it to open it in the desktop
program.</p>
<p>At this time, it is not possible to add shared decks directly to your
AnkiWeb account - they need to be added from the desktop then synchronized
to AnkiWeb.</p>
Would look like this (I added <br> at the start and end of the code for spacing):
The reason why I propose additional styling is readability. E.g. I largly borrowed the styling used in the deck options:
border: 1px solid #e4e4e4;
border-radius: 12px;
padding: 1rem 1.75rem 0.75rem 1.25rem;
box-shadow: 0 3px 3px -2px #14141433, 0 3px 4px #14141424, 0 1px 8px #1414141f;
margin: 2rem 0;
and put the html code from above into a container:
<div id="download-container">
<div class="mb-3"><button class="btn btn-primary btn-lg">Download</button></div>
<p>After the file is downloaded, double-click on it to open it in the desktop
program.</p>
<p>At this time, it is not possible to add shared decks directly to your
AnkiWeb account - they need to be added from the desktop then synchronized
to AnkiWeb.</p>
</div>
It looks like this:
We could also add a width: 100% to the download button to make it huge:
I think the user would first read the description and maybe the sample notes and reviews. So, maybe if there was a top bar with the download button that would help (if you scroll down, download would still be visible). Look at this website for example.
By the way, the additional text seems unnecessary. First of all, a lot of us are on mobile clients. And second, if you already know where to get shared decks from the next line doesn’t seem necessary.
I can’t see a linked website but can imagine what you mean.
Not sure I agree. But I’d like to point out that I didn’t add this text – I just took the text that was already there.
Lol, I meant the forums we are in.
The rationale for the current position is that we want the user to read the description+sample notes before they decide to download. This preserves server resources, reduces the chance the user will hit download limits, and saves them having to scroll back up if they had read those things.
