Резиновый макет

28.05.2012

Прошу подсказать с чего начать надо переписывать стили и т.д, чтобы с фиксированного дизайна страниц (макетов) перейти на резиновый, так как все больше часть посетителей начинает пользоваться входом с телефонов и таких устройств как iPad и др, а также можно написать источник с информацией за ранее благодарен!...

28.05.2012

Либо убирать параметры width в css, либо вообще не прописывать их, чтобы блоки растягивались по содержимому.
Или же верстать через проценты.

**********
**********

28.05.2012

Или использовать media queries из CSS3. Источники гуглить по "адаптивный дизайн"

28.05.2012

Делать разные странички для телефона и для монитора. Самый разумный вариант. Невозможно экран 19"-26" монитора. Запихнуть в 2"-4" телефона. без искажений.
Либо придется делать дизайн максимально упрощенным. и выглядеть на мониторе он будет весьма тоскливо.
Посмотрите на сайт Вконтакте или Яндекс. Существует мобильная версия и Основная версия. Все остальные ухищрения это ерунда.

28.05.2012

Вообще-то просто "подсказать" тут не выйдет. Это сложная тема. При разработке нового дизайна, его нужно делать по принципу "Mobile first", т.е. вначале разработать его под мобильник, а потом адаптировать под прочие экраны. И разработать новый диз зачастую проще, чем адаптировать старый.

Рекомендую почитать: **********, **********, **********, **********, **********, **********, **********, **********, **********, **********, **********, **********, **********, **********, **********, **********, **********, **********, **********. Для начала.

Я стараюсь задавать для всех блоков margin и padding в процентах. Это в первую очередь. Далее - если на страничке есть эл-ты, которые меньше определённых размеров уменьшать нельзя, их нужно переносить на новую строку. Например, картинки или блочные эл-ты статей. Попробуй для примера растягивать **********. Он бесплатен и доступен для скачивания. На его примере можно отлично разобраться, как что лучше использовать. Главное - не забывай тестить на всех устройствах.

28.05.2012

Вам тоже рекомендую погуглить "адаптивный дизайн", чтобы избавиться от такой категоричности. Если лень гуглить, ********** пять шаблонов адаптивной верстки со ссылками на живые примеры, поиграйтесь с изменением размера окна браузера.

29.05.2012

BETEPAH,
Пробежался взглядом по статье абсолютно не поменялось мнение.
Опишу основные проблемы.
1. это шрифт. Разрешение современных дорогих коммуникаторов не намного меньше разрешения 17" монитора. а вот физический размер пиксела и соответственно размер шрифта меньше на порядок. Значит шрифты надо делать больше. Или надеяться, что браузер подгонит корректно. Но делают браузеры это далеко не всегда хорошо.
2. Изображения. Для мобильной версии их желательно делать не более 100х100 пикселов. Не только потому что в противном случае они будут заползать за края экрана, но и будут сильно отжирать дорогой мобильный трафик. Для монитора такие картинки будут слишком малы.
3. Анимацию и флеш надо убирать. Видеоролики соответственно тоже.
4. Рекламу надо убирать, рекламные блоки не впишутся в мобильный формат.
И еще куча всяких косяков висяков и.т.д.
По настоящему комфортно просматривать веб ресурсы с экрана мобильного устройства менее 10" возможно только в специально адаптированой версии.
Все остальное, это попытка прикрутить на Запарожец колеса от Камаза. Технически возможно, а практически получится фигня.

p.s.
Пробежался еще по ссылкам. Там предлагают на стороне сервера вести обработку скриптов и посредством PHP ужимать страничку под размер мобильного устройства.
Но это во первых резко повысит нагрузку на сервер.
Во вторых Это уже не относится к МП чатам. Так как здесь у нас только HTML, ЯваСкрипты и стили.
В третих Это уже и будет адаптированный дизайн о чем я собственно и говорил.

29.05.2012

Анатолич,
1. Шрифты можно указывать не только в пикселях
2. Не согласен. Для мобильной версии изображений должно быть минимум. Внутри чата должна иметься возможность их отключения.
3. Согласен, см. п.2
4. Какую еще такую рекламу?
Про обработку посредством РНР я ничего не писал, я говорил лишь о media queries.
Можете оставаться при своем мнении, сдаюсь.

29.05.2012

BETEPAH,
2. я и говорю, что картинки в мобилиьной версии доложны быть минимальны. а сайт на компьютере без картинок будет выглядеть скучно и уныло.
4. Такую рекламу которую ставят на любом посещаемом сайте. В этом мире надо за все платить. А откуда брать деньги?
В теории вы правы Запорожец с камазовскими колесами это необычно и интересно.
А на практике сайт скорее всего будет работать коряво. На адаптацию каждой странички вы угробите кучу времени. Полноценная версия сайта будет выглядеть скучно и уныло. Да еще и с рекламой непонятки.

29.05.2012

Расскажите это владельцам сайтов:
**********
**********
**********
**********
**********
**********
**********
**********
**********
**********
**********
... хватит? 😉

Ну уж не больше, чем разработка для каждой странички вариаций с разрешениями 320, 480, 768, 1024, 1920

29.05.2012

вот и есчо примеры резиновых макетов

29.05.2012

BETEPAH,
вы бы еще флеш мультик кинули. Который на любом разрешении будет работать.
Выглядит конечно эффектно. Но
Во первых: не уверен что на телефоне эти сайты не будут тормазить и отжирать Золотой трафик.
Во вторых: Неужели вы хотите сказать, что администратор чата может сделать со своим чатом тоже самое без помощи Дмитрия?
Напоминает самоучитель. Как самому собрать феррари в гараже.
Есть действительность, а есть картинки с выставки. вы сейчас показываете картинки.
А вот реальность. Сайты которые ежедневно посещают миллионы.
Которые не тупят работают шустро и корректно.
**********
**********
**********
**********
Рабочие лошадки.

29.05.2012

так речь идет не тока об мобиле. а вот к примеру сказал что мне нужно допустить разрешение всех страниц чата для любого апарата так что бы было все современно

p.s ненавижу однокласники, вечно тупят

29.05.2012

Анатолич, о 3G, безлимитном интернете, touchwiz и multi touch, flash плеере для мобильных, html5 и т.д. вы конечно не слышали?
Посмотрите когда делались мобильные версии приведенных вами сайтов и откройте их полные версии что бы увидеть почему, полные версии кстате так же шустро и корректно работают, хотя vk к примеру я посещаю с qip, при этом я так же являюсь одним из этих миллионов посетителей и при этом не вижу вообще никакого дизайна.
Единственная помощь Дмитрия нужна та, которой он сейчас и занимается, а именно разработка отдельного движка, ни что не стоит на месте и все совершенствуется, надо бы это понимать и не быть таким критичным, а прислушиваться к людям, иначе вы так и будете сидеть на мобильной версии в отличии от других, которые будут предоставлять все прелести своих разработок, отдавая пользователям намного больше информации чем это предоставляет мобильная версия.
Можете посмотреть как выглядят адаптивные шаблоны на этих примерах ********** вот это реальность за которой я считаю будущее. И после этого вы все еще будете считать что это выглядет скучно и уныло?
В заключении могу привести еще пару ссылок где можно почитать на счет адаптивных шаблонов:
**********
**********
Ну и по поводу картинок, если не в курсе, впринципе для этого и нужна помощь Дмитрия, о чем я писал выше: **********

PS ну и поиск по "Responsive Web Design" в помощь

30.05.2012

admiral,
Вся разница в том , что вы говорите о будущем, а я о настоящем.
Мне лень искать точную статистику. Но лишь небольшой процент людей пользуется мобильным интернетом. А из тех кто пользуется, лишь небольшой процент имеет крутые планшетники с диагональю 10" и поддержкой флеш и имеет безлимитный мобильный интернет на высокой скорости. Особенно если люди живут не в мегаполисах.
Позволю привести аналогию. Электромобиль это круто и возможно за ними будущее и уже сейчас они могут многое. Но ездят все на бензиновых, потому что они практичнее.
Если приведенные мною в пример сайты не убедили вас в том, что пока еще рано думать о переходе на адаптивный дизайн.
Приведу в пример еще один маленький и совсем непопулярный сайт.
Который написали Лохи которые ничего не понимают не в веб дизайне не в продвижении сайтов.
Которые наверняка не слышали об адаптивном дизайне.
Собственно вот этот сайт ********** всего лишь самый посещаемый в мире.

Резюмирую.
Все то о чем вы говорили это круто. Но не шибко востребовано на данный момент.

30.05.2012

Анатолич, не мешало бы посмотреть на статистику и сопоставить со скорость роста, не нужно иметь крутых планшетников, полно китайских с различным форматом, на различных платформах и с диагоналями не только 10 дюймов. Продажи смартфонов и планшетов еще в прошлом году обогнали продажи настольных компьютеров и ноутбуков, да и как раз в удаленных районах преобладает по большей части мобильная связь.
В примерах кстате что я давал настоящие и рабочие сайты, а не картинки из будущего. Вы хоть в курсе что у приведенного вами сайта треть посетителей с мобильным интернетом и большая часть из них посещают его через приложения, а не приведенную вами мобильную версию? Вопрос почему, да потому что это удобней, был бы нормальный адаптивный и информативный шаблон, думаю многие бы не заморачивались на установки кучи приложений, а пользовались бы одним обычным браузером. На тот же ютуб бы посмотрели сколько вкладывается на адаптацию, а там не один человек работает, если сам разрабатываешь, то как раз адаптивный шаблон и выгодней тем что не на столько это накладно каждый раз подстраиваться под новое железо. Вообще мы от темы что то отдаляемся, надеюсь lex, сделал выводы для себя в какую сторону двигаться для достижения своей цели

30.05.2012

Думаю что у Лекса был спортивный интерес, навыков в программирование и веб дизайне у него не очень много. Не хочу его обидеть, но сделал вывод по его постам в других темах. И мы его спортивный интерес удовлетворили в полном объеме.
Перевести Дизайн МП чатов на адаптивный, труд огромный. И для хороших результатов. Необходимо переделывать сам движек.
Не думаю, что кто то из пользователей чатов создал бы что то по настоящему удобное.
Спор считаю бессмысленным. Потому что вы говорите о красивом будущем, а я о суровой реальности.
Хочется вам верить что каждый второй житель России имеет безлимитный мобильный интернет и имеет планшет с доступом к всемирной паутине, верьте ради бога.
Нравится вам прибывать мире грез. пребывайте. Фантазировать это здорово.
Именно фантазеры и двигают прогресс. Правда зачастую свою жизнь они обустроить не могут.
Но это уже лирика.
А реальность я вам показал, пока что для мобильных нужд рулят простенькие шаблонные сайты.
Минимум графики и украшательств, максимум совместимости стабильности и удобства.

30.05.2012

Не надо думать за других, надо делать так что бы другие начали думать, тогда и в дальнейшем от них будет меньше вопросов, по крайней мере тех, в которых уже разобрались
Для чего скажите мне необходимо переделывать движек, что бы сделать адаптивный дизайн?
Если для картинок, то с ними я привел лишь один из вариантов, который считаю удобней и практичней чем остальные.
И еще раз повторю, что это реальность, которую можно сделать, а не фантазия, те кто считает это фантазией наверное до сих пор пишут одними <table> и <td>,
так что не надо за жизнь, с этим все в порядке, жена, сын, друзья/знакомые etc, за работу вообще молчу, она постоянно есть и не одна.
Почитайте лучше и по изучайте, а то и дальше будете сидеть на таблицах в ожидании что разработчики когда то начнут под вас подстраиваться, вместо того что бы выпускать и продавать то, что востребовано и имеет спрос, на этом я с темы выхожу.

30.05.2012

admiral,
Пожалуйста не нужно переходить на личности.
Я конкретно показал как выглядят сайты для мобильных устройств. У самых успешных сайтов в мире.
Если вы считаете себя умнее владельцев этих сайтов , то это ваше право.
Если вы хотите чтобы и другие считали вас умнее, то сделайте сайт с адаптивным дизайном. большими картинками, красивым фоном, и.т.п. который заткнет за пояс по популярности тот шаблон и примитив который я вам показал.
Или хотя бы покажите сайт который сделал это.
Пока что, я вижу только что вы пытаетесь не аргументировано навязать свою точку зрения.

30.05.2012

Анатолич, извините, но в Ваших сообщениях сплошные "надеяться, что браузер", "доложны быть", "скорее всего", "не уверен что", "Мне лень искать точную статистику", "Необходимо переделывать сам движек" (он-то здесь при чем?), "Не думаю, что кто то" (орфография сохранена). Единственный аргумент - наличие мобильных версий известных сайтов, а ведь вопрос не об этом был задан.
Категоричные заявления "всё, что я не знаю, - ерунда" хороши в компании друзей, людей, которые Вас хорошо знают, для которых Вы являетесь авторитетом. В остальных случаях они вызывают либо раздражение, либо смех. Извините.
Какой-то глупый спор с оффтопом. Человек задал вопрос о резиновом макете, назвал даже устройства, для которых хотел бы видеть страницу (забавно будет смотреться мобильная версия на айпэде, кстати), ему перечислили возможные варианты, дальше дело выбора ищущего.