# iOS 荷兰语版按钮重叠问题

**URL:** <https://meta.discourse.org/t/overlapping-buttons-in-ios-dutch/82244>\
**Category:** UX\
**Created:** [2018年三月5日 18:36 UTC](https://meta.discourse.org/t/overlapping-buttons-in-ios-dutch/82244 "2018-03-05T18:36:22Z")\
**Posts on this page:** 13\
**Page:** 1

<div class="post-metadata">

**Author:** ![willemb2](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/willemb2/32/91608_2.png) [@willemb2](https://meta.discourse.org/u/willemb2)\
**Post date:** [2018年三月5日 18:36 UTC](https://meta.discourse.org/t/overlapping-buttons-in-ios-dutch/82244/1 "2018-03-05T18:36:22Z")

</div>

On smaller iPhones with Dutch as language the buttons at the bottom of the message composer are overlapping:

 ![iOS%20knoppen%20door%20elkaar](https://global.discourse-cdn.com/meta/original/3X/a/f/afe81a343fa704e38628b2da398eee339609d0c6.JPG)

Screenshot taken on an iPhone 5c with iOS 11.2.6. That’s an old model, but still widely used and I’m getting reports that is no different on more recent models.

Yes, our language has longer words for “saved” and “Upload”. But on a 4.6" Android 7 it looks like this:

![menu%20Android](https://global.discourse-cdn.com/meta/original/3X/a/9/a98e38d7efa4c9313adafccae6a777750fb4a31f.JPG)

Another minor detail: inconsistent capitalization.

---

<div class="post-metadata">

**Author:** ![sam](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sam/32/102149_2.png) [@sam](https://meta.discourse.org/u/sam)\
**Post date:** [2018年三月5日 20:37 UTC](https://meta.discourse.org/t/overlapping-buttons-in-ios-dutch/82244/2 "2018-03-05T20:37:57Z")

</div>

@awesomerobot perhaps we can change saved to an icon on mobile?

---

<div class="post-metadata">

**Author:** ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)\
**Post date:** [2018年三月6日 02:50 UTC](https://meta.discourse.org/t/overlapping-buttons-in-ios-dutch/82244/3 "2018-03-06T02:50:18Z")

</div>

Agree but saved is a rough one for iconography unless you still use floppy discs ..

---

<div class="post-metadata">

**Author:** ![awesomerobot](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/awesomerobot/32/142900_2.png) [@awesomerobot](https://meta.discourse.org/u/awesomerobot)\
**Post date:** [2018年三月6日 05:03 UTC](https://meta.discourse.org/t/overlapping-buttons-in-ios-dutch/82244/4 "2018-03-06T05:03:11Z")

</div>

Right, other than a floppy not a lot else makes sense for save… we’d just be coming up with ideas that aren’t very clear to most people (and the floppy icon has slowly been losing clarity for decades now too).

 ![54%20PM](https://global.discourse-cdn.com/meta/original/3X/4/4/44e817fa803afd46ea20437ff3b42709d3789c2c.png)

So we could instead assume upload and cancel are mostly understood through icons…

 ![57%20PM](https://global.discourse-cdn.com/meta/original/3X/1/4/14f2b45059b29b41f901bcc3072654900dea28b1.png)

In this last example, we could also remove the word from the uploading progress indicator (to save space) and it could occupy the same space as saving/saved.

Then if they’re icons… are they clearer as buttons? is the image icon clearer than the upload icon (especially in the mobile context)?

 ![02%20AM](https://global.discourse-cdn.com/meta/original/3X/a/8/a84a9ed3a029cb1eafcd95b7fb437b66ebaed50b.png)

---

<div class="post-metadata">

**Author:** ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)\
**Post date:** [2018年三月6日 07:29 UTC](https://meta.discourse.org/t/overlapping-buttons-in-ios-dutch/82244/5 "2018-03-06T07:29:21Z")

</div>

> [@awesomerobot](#):
>
> are they clearer as buttons?

I think upload / image is more than important enough to be elevated to button status. Cancel, definitely not.

I very much like your idea of avoiding the “what the heck glyph do we use for save” conundrum in favor of making cancel and upload glyphs, instead … let’s do that! 😉

---

<div class="post-metadata">

**Author:** ![sam](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sam/32/102149_2.png) [@sam](https://meta.discourse.org/u/sam)\
**Post date:** [2018年三月6日 08:02 UTC](https://meta.discourse.org/t/overlapping-buttons-in-ios-dutch/82244/6 "2018-03-06T08:02:52Z")

</div>

Cancel as a glyph can kick in on narrow with a media query, on my iPhone X there is plenty of room

---

<div class="post-metadata">

**Author:** ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)\
**Post date:** [2018年三月6日 09:03 UTC](https://meta.discourse.org/t/overlapping-buttons-in-ios-dutch/82244/7 "2018-03-06T09:03:45Z")

</div>

I think it’s OK to use the glyph for upload and cancel on desktop too @awesomerobot – less translations, more room!

---

<div class="post-metadata">

**Author:** ![sam](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sam/32/102149_2.png) [@sam](https://meta.discourse.org/u/sam)\
**Post date:** [2018年三月6日 09:11 UTC](https://meta.discourse.org/t/overlapping-buttons-in-ios-dutch/82244/8 "2018-03-06T09:11:31Z")

</div>

But the click target is so small for my old fingers, cancel is easy to click, a tiny x is not easy

---

<div class="post-metadata">

**Author:** ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)\
**Post date:** [2018年三月6日 09:12 UTC](https://meta.discourse.org/t/overlapping-buttons-in-ios-dutch/82244/9 "2018-03-06T09:12:52Z")

</div>

Cancel should be smaller, it is a much rarer action. And destructive.

---

<div class="post-metadata">

**Author:** ![willemb2](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/willemb2/32/91608_2.png) [@willemb2](https://meta.discourse.org/u/willemb2)\
**Post date:** [2018年三月6日 11:29 UTC](https://meta.discourse.org/t/overlapping-buttons-in-ios-dutch/82244/10 "2018-03-06T11:29:27Z")

</div>

Opgeslagen / saved always appears within a split second after I type the first character, even when I’m on a slow 3G connection. Before that there is a blank space. So my impression is that it is a status indicator, while the other 3 on that bar are “user action” items. I dont’t think any of my users would even notice if it doesn’t appear, nor would they know what to do then.

But if it needs to be there: would it not be easier to make the font on iOS a bit smaller, like it is on Android? You probably know by now that I’m not a software developer.

BTW this is only the 3rd day of my Discourse trial and I love it! Coming from SMF.

---

<div class="post-metadata">

**Author:** ![awesomerobot](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/awesomerobot/32/142900_2.png) [@awesomerobot](https://meta.discourse.org/u/awesomerobot)\
**Post date:** [2018年三月10日 03:47 UTC](https://meta.discourse.org/t/overlapping-buttons-in-ios-dutch/82244/11 "2018-03-10T03:47:01Z")

</div>

Just pushed an update on this — replacing the cancel button with an X in the composer everywhere, and changing “Upload” to the button on mobile.

 ![49%20PM](https://global.discourse-cdn.com/meta/original/3X/b/c/bcda62e094d8e7c65dad460eeba91ffac3034bff.png)

---

<div class="post-metadata">

**Author:** ![schungx](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/schungx/32/70989_2.png) [@schungx](https://meta.discourse.org/u/schungx)\
**Post date:** [2018年三月10日 04:36 UTC](https://meta.discourse.org/t/overlapping-buttons-in-ios-dutch/82244/12 "2018-03-10T04:36:22Z")

</div>

The icons are very clear (probably the upload one less so) but quite hard to press on a small screen.

Can you make the buttons hit test areas wider?

---

<div class="post-metadata">

**Author:** ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)\
**Post date:** [2018年三月10日 05:34 UTC](https://meta.discourse.org/t/overlapping-buttons-in-ios-dutch/82244/13 "2018-03-10T05:34:37Z")

</div>

Also I think cancel should be a much lighter grey, it feels far too strong at the moment.

 ![image](https://global.discourse-cdn.com/meta/original/3X/5/5/55725e5bd84263b8a3106e8669c636d079d0707f.png)
