LINUX.ORG.RU
 
maxcom

Изменения на сайте - мобильный вид


0

1

Кстати кроме кнопочек я еще сегодня прикрутил некоторую поддержку мобильного вида в tango. Фактически есть три варианта верстки - для экранов с шириной до 640px, до 800px и для широких.

Цель - возможность работы с сайтом без масштабирования на телефонах и планшетах в любой ориентации.

Точно работает на андроиде htc desire s и на iPad, на аналогичных железках должно работать. Проблемы еще есть и кое-где выглядит страшненько.

Что там на операмини, симбиане и win mobile не знаю, скорее всего ничего нового.

О проблемах и пожеланиях пишите.


[#]  
bender

в white2 на главной на андроиде правая колонка наползает на верхние новости, остальное все вроде нормально

**** ()
[#]  
bhfq
>>-----Цитата---->>

iPad

<<-----Цитата----<<

борщ

На Galaxy Tab тоже что то поменялось

** ()
[#] Ответ на: комментарий от bender 03.02.2012 23:53:05  
maxcom

White2 по задумке не должен был поменяться. Раньше так же было или нет?

***** ()
[#] Ответ на: комментарий от bhfq 03.02.2012 23:54:26  
maxcom

Лучше стало или хуже? Tango?

***** ()
[#] Ответ на: комментарий от maxcom 03.02.2012 23:55:17  
bhfq

В каком браузере посмотреть?

** ()
[#]  
CLU

Выглядит хреново на LG Optimus One (320x480), ширина страницы не равна ширине экрана, т.е. есть горизонтальный скролл, что есть плохо, очень плохо.

Советую мобильную версию сделать с нуля, категорически рекомендую использовать это: http://jquerymobile.com/

()
[#] Ответ на: комментарий от CLU 03.02.2012 23:59:25  
maxcom

Такого экрана у меня нет, попробую потом в android emulator. Скриншот можешь сделать?

***** ()
[#] Ответ на: комментарий от maxcom 03.02.2012 23:54:28  
bender

всегда так было - это пожелание к мобильным версиям, может офтоп

**** ()
[#] Ответ на: комментарий от bender 04.02.2012 0:06:45  
maxcom

Трехколоночная верстка главной?

***** ()
[#]  
MrHouse

Почему не сделать PDA версию?

* ()
[#]  
TGZ

Раньше было лучше, в мобильном IE-9 страница отображалась как в десктопном браузере, сейчас в экран помещаются только названия разделов и названия тем. Речь о трекере.

** ()
[#] Ответ на: комментарий от maxcom 04.02.2012 0:02:24  
bhfq

Танго, первые два скриншота из Opera Mobile, следующие из программы "Браузер", расположение блоков у меня немного настроено через настройки лора, ну а реклама самсунга :)

http://db.tt/PJn0BCqC

** ()
[#]  
bhfq
>>-----Цитата---->>

Цель - возможность работы с сайтом без масштабирования на телефонах и планшетах в любой ориентации.

<<-----Цитата----<<

В вертикальной ориентации немного приходится отдалять масштаб.

** ()
[#] Ответ на: комментарий от bender 04.02.2012 0:09:45  
maxcom

Про такой вариант я забыл, посмотрю потом и на него

***** ()
[#] Ответ на: комментарий от bhfq 04.02.2012 0:16:38  
maxcom

Да, главную как-то переколбасило. Попробую воспроизвести в эмуляторе

***** ()
[#] Ответ на: комментарий от bhfq 04.02.2012 0:24:13  
maxcom

Это я уже починил, но еще не обновил сайт. Спасибо

***** ()
[#] Ответ на: комментарий от maxcom 04.02.2012 0:25:25  
bhfq

У меня стартовая
Слева: Опрос, Архив Новостей
Справа: Топ10, Галерея

** ()
[#] Ответ на: комментарий от bhfq 04.02.2012 0:27:06  
maxcom

А, тоже трехколоночная. Про нее я забыл, поправлю

***** ()
[#]  
PolarFox

Samsung Galaxy Tab 10.1, выглядит прилично в обоих ориентациях.

**** ()
[#] Ответ на: комментарий от maxcom 04.02.2012 0:01:50  
CLU

http://imgur.com/PwPW6.png
Вот так, 6 пикселей лишнего горизонтального скроллинга.
Глянь на форум neowin.net со смартфона - примерно так ДОЛЖНО быть.

()
[#]  
PolarFox

Samsung Galaxy SII, выглядит прилично. Но глюк с несоответствием курсора палочкой, маркера выделения остался. При наборе сообщения, страница скроллится соответственно уехавшему курсору выделения, а не курсору в тексте.

**** ()
[#] Ответ на: комментарий от PolarFox 04.02.2012 0:38:39  
PolarFox

Поясняющий скриншот. Андроид свято уверен, что буква «к» находится именно там, где находится жёлтая стрелочка, и соответственно доскролливает при наборе туда. Может глюк самого андроида, но на других сайтах такого вроде нет. Может просто сделать поле ввода сообщения равное по ширине экрану?

**** ()
[#]  
arsi

вроде неплохо, осталось самое главное — трекер ;)

замечания/жалобы/предложения (после просмотра на галакси мини 320×240): слишком крупный шрифт у «LINUX.ORG.RU — Русская информация об ОС Linux», с трудом на экран умещается; реклама самсунга на главной на полтора экрана…; виджет «Добро пожаловать!» где-то внизу, хотя было бы удобно видеть его в самом начале, но только с пунктами в строчку, а не в колонку. и было бы неплохо продублировать настройки, отвечающие за рендеринг, для пк и мобильной версии раздельно (отображение аватарок, соцкнопок, количества комментариев на странице и т.п.).

**** ()
[#]  
bhfq

На Samsung Galaxy Ace в вертикальном положении в группах форума (www.linux.org.ru/forum/talks/) отобрадается примерно 70% от ширины, приходится отдалять. (Только страница "Форум" по ширине вписывается). В самой теме (www.linux.org.ru/forum/linux-org-ru/7368559?lastmod=1328301724147) процентов 5 не вписывается в ширину.

** ()
[#] Ответ на: комментарий от Mr_Alone 04.02.2012 0:36:20  
bhfq

Что это за терминатор?

** ()
[#] Ответ на: комментарий от PolarFox 04.02.2012 0:41:26  
bhfq

Подтверждаю поле ввода сообщения совсем не приспособлено под телефоны адроида и планшеты.

** ()
[#] Ответ на: комментарий от bhfq 04.02.2012 0:47:01  
PolarFox

Да с планшетами (по крайней мере 1280×800) всё нормально, а вот на телефонах поле убегает.

**** ()
[#] Ответ на: комментарий от bhfq 04.02.2012 0:46:11  

Что не так? Обычный планшетник на Андроид, 1280х800.

*** ()
[#] Ответ на: комментарий от CLU 04.02.2012 0:37:40  
bhfq

Кекеке видишь ли у них два разных css, и два разных наборов js

<link rel="stylesheet" type="text/css" media="screen" href="/css/mobile.css" />

<link rel="stylesheet" href="/css/global.css" media="screen" />

А у нас занимаются извращениями.

** ()
[#] Ответ на: комментарий от PolarFox 04.02.2012 0:48:15  
bhfq

С планшетом на 1024х600 не нормально.

** ()
[#]  
bsdfun
>>-----Цитата---->>

О проблемах и пожеланиях пишите.

<<-----Цитата----<<

Для 128х160 сделаешь? :)

*** ()
[#] Ответ на: комментарий от bsdfun 04.02.2012 1:00:27  
PolarFox

Для семисегментников ещё, ага.

**** ()
[#] Ответ на: комментарий от PolarFox 04.02.2012 0:48:15  
bhfq

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

** ()
[#]  

Танго

На айфоне выглядит ужасно. Во-первых, шапка сайта (логотип + меню) занимает целый экран. Во-вторых, ширина страницы превышает ширину экрана, хотя полезный контент имеет нужную ширину (справа много свободного места остаётся). Как в портретной, так и в альбомной ориентациях. Поскольку я читаю ЛОР почти только с айфона (лишь иногда с айпада), стало несколько неудобно. Хотя в целом начинание отличное, спасибо.

Макс, у тебя же вроде есть айфон, ты не проверял разве, что получилось? :)

()
[#] Ответ на: Танго от Apple-ch 04.02.2012 1:06:08  
PolarFox

Макском не может вот так вот просто переключиться на другое приложение, ведь на его однозадачном ифоне сам ЛОР и крутится.

**** ()
[#] Ответ на: комментарий от PolarFox 04.02.2012 1:08:13  
bhfq

Вброс удался :)

По сабжу, в альбомной ориентации у меня даже на Samsung Ace все нормально умещается, но не портретная.

** ()
[#]  
post-factum

maxcom, ты принципиально white2 не будешь трогать или всё-таки и её модернизируешь?

***** ()
[#] Ответ на: комментарий от PolarFox 04.02.2012 1:04:44  
bsdfun

Ну а что, у моего телефона именно такое разрешение - и это не мешает ходить с него на ЛОР. :)

*** ()
[#]  

240х320 в портретной ориентации выглядит… ммм, страшненько. Да ещё и зум сразу после загрузки страницы врубается автоматом. Ну а проблемы тебе уже выше описали.

PS: Модерский блок под каждым сообщением хавает кучу места и вообще некомпактен, может сделаешь его скрытым и выезжающим через JS по нажатию ссылки? Утром дам скриншот безобразия, если надо.

***** ()
[#]  

и раз уж появился мобильный вид: может, сделаешь пагинацию в стандартном виде помельче, примерно такого размера и вида, как сейчас выглядят свежие кнопки RSS?

***** ()
[#]  
aedeph

А как же black, Максим?

* ()
[#] Ответ на: комментарий от MrHouse 04.02.2012 0:12:21  
>>-----Цитата---->>

Почему не сделать PDA версию?

<<-----Цитата----<<

Владельцы этих уродцев должны страдать как можно больше, для восстановления вселенской справедливости

* ()
[#] Ответ на: комментарий от maxcom 04.02.2012 0:26:15  
SevikL

на n9 верстка не плывет, все на местах, но крупновато

* ()