01.05.2015, 15:58 | #11 |
Дикий
Регистрация: 02.06.2007
Адрес: <Noindex>
Сообщений: 2,551
Вес репутации: 360
|
На данный момент работаю с заказами с Серча. На данный момент адаптировал уже порядка 18 сайтов.
А вот последние полезные наработки: PHP код:
PHP код:
__________________
Делаю кулоны с опалами в стекле и не только! |
25.08.2015, 21:45 | #12 |
Дикий
Регистрация: 02.06.2007
Адрес: <Noindex>
Сообщений: 2,551
Вес репутации: 360
|
__________________
Делаю кулоны с опалами в стекле и не только! |
23.12.2015, 08:46 | #13 | |
Дикий
Регистрация: 02.06.2007
Адрес: <Noindex>
Сообщений: 2,551
Вес репутации: 360
|
Я что-то вспомнил, что не рассказал про адаптацию рекламы от Гугла и Яндекса для мобильных устройств.
С адаптивной рекламой Гугла все довольно просто. Там есть специальные блоки, я только меняю обычно data-ad-format="auto" на data-ad-format="rectangle". Это позволяет показывать только прямоугольные и квадратные блоки, занимая под статьей больше места. Еще можно показывать, например, большой блок рекламы для десктопа и адапривный - для меньших экранов: Цитата:
У Яндекса сейчас тоже появилась адаптивная реклама, но я предпочитаю использовать горизонтальный тизер, просто меняя количество объявлений. Ну и по центру его неплохо бы выравнивать. Для этого нжно добавить к div: style="margin-left: auto; margin-right: auto; display: inline-block;" Как же изменить количество объявлений в блоке для подстройки под адаптивный дизайна? Для асинхронного кода после (function(w, d, n, s, t) { нужно вставить скрипт определения ширины экрана: var limmw=document.getElementsByTagName("body")[0].offsetWidth; if (limmw>=1020) {var limm="3";} else {var limm="2";} if (limmw<=820) {limm="1";} Ну и заменить limit на limit: limm,
__________________
Делаю кулоны с опалами в стекле и не только! |
|
21.01.2016, 20:38 | #14 |
Дикий
Регистрация: 02.06.2007
Адрес: <Noindex>
Сообщений: 2,551
Вес репутации: 360
|
Я просто обязан оставить это тут:
__________________
Делаю кулоны с опалами в стекле и не только! |
18.02.2016, 19:23 | #15 | |
Дикий
Регистрация: 02.06.2007
Адрес: <Noindex>
Сообщений: 2,551
Вес репутации: 360
|
Сегодня переделывал сайт pleervox.ru и получил у Гугла 100 / 100 Удобство для пользователей.
Даже слайдер и просмотрщик фотографий переделан под мобильные устройства. Единственное, я не понял, что за просмотрщик фото такой в карточке товара, но адаптируется он для мобильных и планшетов вот так: Цитата:
__________________
Делаю кулоны с опалами в стекле и не только! |
|
19.02.2016, 12:21 | #16 |
Мастер
Регистрация: 29.05.2007
Сообщений: 525
Вес репутации: 234
|
интересно, если в медию сразу *{display: none} воткнуть, удобство будет 146%?-)
__________________
|
19.02.2016, 13:17 | #17 | |
Дикий
Регистрация: 02.06.2007
Адрес: <Noindex>
Сообщений: 2,551
Вес репутации: 360
|
Цитата:
А тут в примере все не так страшно. Я просто скрыл все 4 рамки у модального окна и 4 картинки углов. Они там показываются через такое мракобесие больно уж много места занимают, да и на мобильных - не нужны совсем. Ну а потом все блоки и фрейм просмотрщика версии для печати растянул на 100% по ширине экрана. Удобно вполне. Да и лучше, чем убирать функционал.
__________________
Делаю кулоны с опалами в стекле и не только! |
|
23.02.2016, 23:39 | #18 | |||
Дикий
Регистрация: 02.06.2007
Адрес: <Noindex>
Сообщений: 2,551
Вес репутации: 360
|
Довольно интересная статья: https://habrahabr.ru/post/277753/
"Начиная с 39 версии хрома для Android Lollipop была внедрена возможность менять цвет интерфейса браузера веб-разработчиками. Сделать это просто, нужно в <head> добавить новый мета-тег:" Цитата:
Цитата:
Кстати, для добавления иконок в Айфонах я когда-то сделал у себя на сайтах файл browserconfig.xml: Цитата:
и apple-touch-icon-precomposed.png (со скруглениями). Две - так как я очень ленивый, а проверять просто негде.
__________________
Делаю кулоны с опалами в стекле и не только! |
|||
01.03.2016, 00:35 | #19 | ||
Дикий
Регистрация: 02.06.2007
Адрес: <Noindex>
Сообщений: 2,551
Вес репутации: 360
|
Сделал тут простую кнопку переключения на полную версию сайта для адаптивного дизайна:
В Хедер, вместо meta name=viewport: Цитата:
Сама кнопка: Цитата:
На здоровье Если кому-то интересны технические моменты, то мы меняем width=device-width на width=1024, делая сайт "шире" для мобильного устройства. Также, я изменил начальный масштаб загрузки страницы с initial-scale=1 на initial-scale=0.1 - так работа очевиднее.
__________________
Делаю кулоны с опалами в стекле и не только! |
||
06.03.2016, 18:26 | #20 |
Дикий
Регистрация: 02.06.2007
Адрес: <Noindex>
Сообщений: 2,551
Вес репутации: 360
|
Сегодня у нас интересная тема!
Как сделать таблицу адаптивной и не сойти с ума В общем, адаптация под "резиновую верстку" табличного сайта часто выглядит примерно вот так. Особенно, если нет легкого доступа к самой таблице. У меня есть полная статья на эту тему, но давайте тут просто приведу список полезностей по пунктам: 1) td {hyphens: auto;} - корректный перенос слов в таблице. Жаль, не во всех браузерах. 2) word-break: break-all; - принудительно разбиваем строки и слова в таблице. Не очень красиво, но работает. 3) <WBR> сами расставляем места переносов. 4) Заключаем таблицу в DIV c фиксированной шириной и overflow: auto. Это включит прокрутку по горизонтали. 5) Иногда достаточно уменьшить отступы в ячейках. 6) td {display: inline-block !important; width: 100% !important;} - а этот способ дошел до меня совсем недавно. Можно сделать столбцы таблицы блоками или инлайн-блоками. Это настолько легко и круто, что даже слов нет! Любые карточки товаров легко складываются друг под друга, а ячейки переносятся. И все это - без физической разбивки таблицы на 2 части (у таблиц вообще много глюков с float: left в разных браузерах). Да, подход применим и к строкам (tr). В принципе, стилями таблицу можно даже пересобрать заново.
__________________
Делаю кулоны с опалами в стекле и не только! |
|
|
Похожие темы | ||||
Тема | Автор | Раздел | Ответов | Последнее сообщение |
Оптимизация сайта | koctik | Общие вопросы оптимизации | 5 | 13.07.2013 15:23 |
SEO оптимизация сайта | birja | Общие вопросы оптимизации | 2 | 13.04.2012 10:54 |
Задачка... 3 строчки на JS. Хелп! | MonAmur | Разработка и сопровождение сайтов | 3 | 08.10.2009 14:50 |
Оптимизация сайта | sunplant | Общие вопросы оптимизации | 9 | 25.11.2008 09:15 |
оптимизация сайта :( | pha | Яндекс | 1 | 10.12.2007 15:54 |
Часовой пояс GMT +3, время: 15:03.