59

It seems like the input field for writing your messages in a chat application is always placed at the bottom of the conversation.

Do we have any argument for this seen in a UX perspective?

5
  • possible duplicate of Chat arrangement question: Left or right?
    – Mervin
    Feb 10, 2014 at 16:09
  • 7
    That question deals with the horizontal alignment of chat dialogs and the answers don't touch on the question above. Feb 10, 2014 at 16:53
  • 1
    In the Japanese animation series Durarara!! a chatroom is a major plot element and interestingly it has the input field at the top. This isn't the norm in real Japanese online chatrooms, but a fan site nevertheless provides a popular counterexample.
    – Anko
    Feb 15, 2014 at 14:41
  • 1
    Perhaps the idiom originated with Telex machines (if you are old enough to remember :-)) where a hard copy of the incoming text was printed on a spool of paper in typewriter fashion. Incoming & outgoing Telex messages appeared in chronological order, the latest last.
    – copper.hat
    Feb 15, 2014 at 16:37
  • Interesting fact: Facebook / Twitter show their posts (not messages) from newest = top to oldest = bottom.
    – DarkTrick
    May 6, 2022 at 11:30

11 Answers 11

65

People read from left to right and from top to bottom. Chat applications normally place texts from top to bottom. The newest chats placed at the bottom. Placing the input at the bottom, therefore, is logical.

Edit
With this answer I didn't mean ALL people. For example, Arabic is read from right to left. But considering this websites' audience and the OPs background I generalized it a bit.

15
  • 11
    And on mobile devices the keyboard is always at the bottom, so it makes sense to have the input field right above it.
    – Kweamod
    Feb 10, 2014 at 13:25
  • 7
    Facebook posts do not form a dialog and the input field is at the top of the screen. Same goes for Twitter. Facebook comments however do form a dialog and are placed from top to bottom with the newest comments at the bottom. Feb 10, 2014 at 14:24
  • 4
    "People read from left to right and from top to bottom" is incorrect. While it is true for some people it is not true of all people, and simply making that assumption leads to poor UX in internationalization. Paragraphs 2-4 are valid points and form the correct answer, without the 1st paragraph. Feb 10, 2014 at 22:08
  • 2
    I'm aware that there are right-left, left-right and vertically top-to-bottom languages. Are there any that read bottom to top? That seems like it would be really hard to internationalize for.
    – Fake Name
    Feb 11, 2014 at 10:24
  • 3
    Japanese is traditionally top->down first, then right->left, but nowadays is just as common (if not more so) to adopt the western left-right, top-down. So it's not set in stone, either.
    – Izkata
    Feb 11, 2014 at 15:19
65
</textarea>
     placeholder="Enter your next post here!">
<textarea name="postText" rows="3"

</div>
    top.
    to put the input at the
    it would make sense 
    from bottom to top,
    read a chat window
    In a world where we 
<div class="post">
16
  • 20
    Try reading it the other way. :) Feb 10, 2014 at 22:19
  • 14
    The unterminated opening textarea is bothering me the most right now...
    – Izkata
    Feb 11, 2014 at 15:21
  • 6
    @Izkata ...have you 'got' it yet?
    – Anentropic
    Feb 11, 2014 at 16:04
  • 5
    <div class="post">In a world where we read a chat window from bottom to top, from bottom to top, it would make sense to put the input at the top.</div><textarea name="postText" rows="3" placeholder="Enter your next post here!"></textarea>
    – DickieBoy
    Feb 11, 2014 at 17:09
  • 7
    @lzkata The 'placeholder' code is part of the 'textarea' tag. It is split over two lines (still valid html).
    – Nathron
    Feb 11, 2014 at 21:39
9

I don't see it as more than logical.
If the text is displayed in the main window from top to bottom, then the input box for your reply is on the bottom, because that's where your text will end up.

enter image description here

While in another situation, like a comment thread on a blog, the most recent entry can be on top.
Then the input field for new entries is above that, again, because that is the spot where the new text will be.

enter image description here

Both situations feel natural for me. Note that my example is with left to right text, but I'm sure it would be very similar with right to left text.

2
  • +1 I agree. As long as the functionality is mirrored, you should be fine either way. With the input at the bottom, you want the most current blurbs to read from bottom to top. With the input at the top, you want the most current blurbs to read from top to bottom. Feb 14, 2014 at 14:50
  • ok, now imagine someone typing a long sentence in two parts each separated as a new comment. » Like a yoda » I shall sound. Feb 16, 2014 at 15:37
7

When multiple messages are ordered in order of writing, it is natural to put the latest one at the bottom. This mimics how physical writing works - imagine a long paper sheet or a guestbook where people come by from time to time and leave a note.

Everyone would write their note just under the last note, and it would end up automatically ordered from oldest to newest.

Thus, it is natural to put the input closest to where the result will appear, so the text box goes to the bottom.

You could argue against the "latest last" ordering. For instance, Facebook orders its feed "latest first". Interestingly, with comment threads of individual posts, the comments are ordered "latest last" despite that.

2
  • 4
    I've used a few blogs where the latest comment is at the top, just below the main post. It's remarkably disconcerting to have to read down a comment, and then jump up to get to the next one in chronological order.
    – Jules
    Feb 11, 2014 at 8:34
  • I think this answer is highly underrated. It explains much more (sure not everything) and in a better way than the others.
    – DarkTrick
    May 6, 2022 at 11:36
6

The reason is not related to any language but the nature of the information and the focusing point for getting a general overview of changing any situation.

Conversation is not a static information like the text in book. Placing text on the bottom will let user to get the latest message and ongoing conversation.

The computer console is also working with the same logic the last written piece of information is the last and newest information. From my point of view, there are also other implementation of the same concept.

The stock information or latest news will be positioned to the bottom of the screen because it is the best place that you can keep focal point to the changing information while having a general overview information.

enter image description here

enter image description here

enter image description here

Subtitles are also performing better if it is positioned at the bottom of the page than putting it the top of the screen, and Japanese are also using the same way. Do you mind if we are going to move the subtitles above the screen? Are you going to perform better in that case?

I do not have data but definitely have some connection with that too.

1
  • 1
    Interesting point! I have attended several Opera's where they projected English translations to a small screen above the stage. The stage was quite large, so it required a large shift of the eyes to read the translations. Two reasons that made this a special case: 1) Some attendees I'm sure would prefer to ignore the translations. 2) Putting the screen in front of or below the stage would have made it hard for people seated front and center to see all of the text or all of the stage - one would be obscured somehow.
    – Patrick M
    Feb 12, 2014 at 18:04
4

English speakers read from top to bottom.

In order to comment on a Discussion, it is advisable to read the conversation before commenting. By placing the conversation before the input field, we increase the likely-hood that users read before commenting.

In some websites, it is the opposite - The input field is first, then the most popular comment is after it and comments follow in popularity order. The reason for this design is that the website wants the most distinct possible comment threads (they want everyone to state their opinion). After stating your own opinion, you will read others opinions and +1/agree/disagree with them.

2

Because in all instances, people read from top to bottom - unless you are reading upside down. A chat is context sensitive. Like a conversation, you need to know what happen before in order to contribute your two cents or form a reply or challenge a statement etc. So having the input at the bottom is only akin to what happens to a chat in real life.

As oppose to search.. you really don't care what has happened, you just want that information you are searching for NOW! - I wish real life could be like that.

1

One aspect that has not been mentioned in the other answers is that there may be some form of 'race memory' going on from the days before VDUs when teleprinters were the norm.

In the case of teleprinters / early computer terminals, the most recent text was printed on the current line and the paper scrolled upwards so you could see it. This was my first experience of communicating with a computer, and I'm still coding, so data entry at the bottom is quite natural for me.

While a small proportion of the population would have used computer terminals at the time, the concept was very familiar to a wide population from the humble typrewriter, telex machines in offices, TV shots of football results coming up on a teleprinter, and visual references in films set in that time.

0

Whoa! People who are conversant with certain written languages will read from left-to-right, and from top-to-bottom. Other written languages do things differently. This arrangement is only natural for people who read/write certain kinds of languages. I suspect that the input-at-the-bottom started with GUI coders who happened to read/write one of these languages (like English). And, that it continued, because a lot of people just copy what they see others do.

6
  • 4
    I am unaware of languages that read bottom-to-top.
    – Denis
    Feb 10, 2014 at 21:04
  • 4
    @Denis, interestingly, there are two I can find in the Philippines: Hanunó'o and Tagbanwa. I'd bet that there aren't very many speakers and less for who these are an only language.
    – nwellcome
    Feb 10, 2014 at 21:54
  • 4
    @LeonardD - When an answer starts with I suspect that without providing any facts to back it up, it can't really be considered an answer. More of a comment. Feb 10, 2014 at 21:54
  • 1
    @nwellcome, that is quite curious, thank you for bringing this to my attention.
    – Denis
    Feb 11, 2014 at 11:05
  • @CodeMaverick - well, since I wasn't around when the input fields of the first chat windows were designed, I really don't have any facts about what those designers/coders were thinking, or what they were basing their choices on. My "I suspect" was (and is) based on my experience with languages, and with people who design human-machine interfaces, and with all those who have tunnel vision.
    – Leonard D.
    Feb 11, 2014 at 18:49
0

I think it's due to:

  1. The input text box should be close to the most recent message, so you can easily check that your response makes sense, and you don't miss something.
  2. Messages scrolling up (not down) is most consistent with what users expect.

It would probably work ok to have the input box at the top, if messages scrolled downwards - but it would feel a bit surprising.

0

Reading a chat session is similar to reading any other script, or book. Writing (Replying) on a chat, is appending to the previous text/ chat. Since it is an append to the last, it makes sense to have the message input closer to the context...

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.