3

Сейчас при загрузке картинки на сайт отображается следующее окно:

загрузка

Можно заметить, что в текущем виде текст выглядит не лучшим образом. В частности:

  • наличие запятой в начале строки;
  • жирный текст в две строки.

Оригинальный текст такой:

Drag and drop or click here to upload your image (max 2 MiB)

И окошко выглядит так:

upload

Текущий перевод:

Перетащите изображение или нажмите здесь, чтобы загрузить его (не более 2 мегабайт)

Предлагаю его поправить.

4 ответа 4

4

Есть интересный момент, который почему-то никто не заметил.
Если будет 2 жирных куска, то строки будут расположены адекватно.

разметка

получится так

Полагаю, этому будет соответствовать следующий вариант разметки:

**Перетащите сюда изображение** **или кликните для выбора файла**  
(не более 2 мегабайт)

Перетащите сюда изображение или кликните для выбора файла
(не более 2 мегабайт)


После фикса кода окно выглядит следующим образом:

итог

23
  • Мне такой вариант нравится ещё больше: "перетащите сюда изображение" -- это просто в точку. @alexolut а вам как?
    – A K
    Commented 1 янв. 2017 в 23:04
  • @AK, в комментариях нельзя звать тех, кто не участвовал в комментировании или правке ответа. Позови в соседнем ответе или в чате. А ещё обращаю внимание, что лимит на размер находится вне рамки.
    – Qwertiy Мод
    Commented 1 янв. 2017 в 23:17
  • Я видел, но всё равно выглядит красиво. Фраза "Вы также можете" -- она ведь тоже всегда за рамкой. Пока - имху лучший вариант.
    – A K
    Commented 1 янв. 2017 в 23:51
  • @Qwertiy лимит вне блока это не очень хорошо, так как относится к загружаемой картинке. Хотя в целом выглядит неплохо. В идеале хотелось бы сохранить оригинальное форматирование.
    – αλεχολυτ Мод
    Commented 2 янв. 2017 в 6:30
  • @alexolut, запостил ещё один хак :)
    – Qwertiy Мод
    Commented 3 янв. 2017 в 1:42
  • @alexolut А по мне наоборот красиво именно тем, что условие за рамку попало и слилось с "вы можете использовать изображение из сети", они там как бы группируются в логический блок.
    – A K
    Commented 6 янв. 2017 в 15:31
  • @AK если ограничение действует и на загружаемую из сети картинку, то, вероятно, в этом есть смысл. Хотя мне больше нравится вариант с <sub'ом>
    – αλεχολυτ Мод
    Commented 6 янв. 2017 в 15:40
  • @alexolut, на картинку из сети ограничений нет - она же никуда не загружается.
    – Qwertiy Мод
    Commented 6 янв. 2017 в 19:36
  • @Qwertiy Она загружается на тот же imgur.
    – αλεχολυτ Мод
    Commented 6 янв. 2017 в 19:40
  • @alexolut, o_O Я всегда просто ссылку подставлял руками :)
    – Qwertiy Мод
    Commented 6 янв. 2017 в 19:41
  • Ну, это можно и без обсуждаемого окна делать потому что.
    – αλεχολυτ Мод
    Commented 6 янв. 2017 в 19:42
  • @alexolut, но руками-то оно точно никуда не загружается ;)
    – Qwertiy Мод
    Commented 6 янв. 2017 в 19:44
  • Почему же? На комп того, кто видит тело вопроса. :)
    – αλεχολυτ Мод
    Commented 6 янв. 2017 в 19:45
  • Видимо не хватает дополнительного перевода строки?
    – αλεχολυτ Мод
    Commented 10 янв. 2017 в 19:00
  • @alexolut, ага. Ты два пробела не пропустил в конце строки? Ну или <br> тегом попробуй.
    – Qwertiy Мод
    Commented 10 янв. 2017 в 19:02
1

Ещё немного магии. Чтобы сделать текст чуть мельче и уместить в одну строку побольше, можно использовать верхний или нижний индекс. Однако, это не отменяет того, что надписи надо переформулировать. Жирная мне всегда не нравилась, а уж запятая в начале строки - это вообще жуть.

Скриншот разметки

Скриншот результата

2
  • Какой вид при этом должен быть у строки transifex, чтобы sup работал по Вашему мнению? В явном виде тег написать?
    – αλεχολυτ Мод
    Commented 4 янв. 2017 в 3:38
  • @alexolut, ага, написать тег. Вроде других способов нет? Только sub, а не sup, чтобы расстояние не увеличивать.
    – Qwertiy Мод
    Commented 4 янв. 2017 в 10:30
0

Возможный новый вариант:

Перетащите или нажмите здесь для загрузки изображения (не более 2 мегабайт)

-1

Ещё один вариант (по факту, вариация на ответ @alexolut):

Перетащите изображение или нажмите здесь для загрузки изображения (не более 2 мегабайт)

Поясняю.

Вариант "для загрузки" вместо ", чтобы загрузить" - это шикарный ход, однозначно "за".

Однако я бы оставил слово "изображение" после "перетащите", как по мне это сильнее разносит через "или" два разных действия: или "драг-н-дропните сюда" или "нажмите здесь".

Я бы реально поставил именно "перетащите сюда" вместо "перетащите изображение", но получится масло масленное. Поэтому "перетащите изображение" -- неплохой компромисс.

Нужно посмотреть, как оно будет выглядеть, я так понимаю, что оно опять в две строки будет, да?

Update: Вот несколько вариантов:

Вариант1

вариант2

Вариант3

4
  • Ваш вариант по-прежнему будет отображаться с делением жирного текста на две строки.
    – αλεχολυτ Мод
    Commented 1 янв. 2017 в 20:22
  • @alexolut Вот честно: а насколько это критично? При чтении ваш вариант сильно уступает в понимании из-за выкидывания этого слова. Возможно, это лично моё восприятие, но я бы попробовал поискать ещё варианты. Насколько нужен вообще этот полужирный шрифт, может полностью от него отказаться? Или кардинально по-иному фразу перестроить?
    – A K
    Commented 1 янв. 2017 в 20:31
  • Выделение нужно, т.к. оно учитывается при отображении текста на окне, если не будет выделения, видимо вообще всё поедет (это моя гипотеза). Хотелось бы сделать красиво, т.е. исключить вторую жирную строку.
    – αλεχολυτ Мод
    Commented 1 янв. 2017 в 20:39
  • @alexolut Ну, это как раз просто: берём и прямо в браузере меняем текстовку -- можно легко увидеть, как будет выглядеть. Прикрепил в пост несколько вариантов. Видно, что без жирного текст вылезает вверх -- т.е. отступы рассчитаны на пару строк и одна из них должна быть высокой.
    – A K
    Commented 1 янв. 2017 в 22:32

Войдите, чтобы ответить на этот вопрос.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками .