SEO 73: дневник вебмастера » Web-дизайн

Как получить CSS-ширину (Cordova-Phonegap)

[m.k] — Wed, 04 Mar 2015 19:14:01 +0000

Нужно было в зависимости от ширины экрана менять таблицы стилей. Все это в Cordova (Phonegap). Это такая фигня, с помощью которой можно делать кроссплатформенные приложения, зная только HTML, CSS и JavaSript.

Получаю screen.width, 480 пикселей. Все правильно, ширина экрана у меня такая. Но внутри все оказывается шире чем нужно. Ширина страницы тоже расчитана на 480 пикселей.

В чем же фигня?

Есть такой параметр как devicePixelRatio. Это отношение настоящих пикселей экрана к CSS пикселям.

Да, они не всегда равны, хоть и приложение развернуто на весь экран.

Ну точно, window.devicePixelRatio выдает 1.5. Делим ширину экрана на пиксельратио и вот CSS ширина. Исходя из этого уже и надо подключать ту или иную таблицу стилей.

Если нужна высота, ее считать можно точно так же.

Zemanta

Виджет “Мне нравится” (ВКонтакте) на зеркалах

[m.k] — Mon, 17 Nov 2014 12:17:23 +0000

Есть одна проблема у виджета-кнопки социальной сети ВКонтакте “Мне нравится”: в настройках сайта можно указать только один домен. А если у сайта есть зеркала? Ведь на них вылезет ошибка “Invalid application domain.” на месте, где должна быть кнопка. Проблема.

Кто-то предлагает заводить каждому домену свой ID и в зависимости от hostname менять его. Но у этого способа есть один минус – для каждого домена будет свое количество лайков.

Я предлагаю другой способ. Кривой, конечно, но лучше не придумал. Нужно делать фрейм (получится фрейм во фрейме, что мне не нравится) и отдельную страницу. Код страницы примерно такой:

YOUR_PAGE_URL – адрес страницы на основном домене (который указан в интерфейсе ВК, далее буду его называть YOUR_MAIN_DOMAIN). У меня цель была сделать лайки для главной страницы, поэтому мне проще чем, например, тем, кто хочет лайки к статьям и прочему контенту. Передавайте методом GET параметры, обрабатывайте их на стороне сервера и будет вам счастье .

~~На самом сайте в том месте, где нужна кнопка ставим фрейм:~~

~~YOUR_MAIN_DOMAIN/vklike.htm” frameborder=”no” allowtransparency=”true” scrolling=”no”>~~

SRC – адрес той самой страницы на основном домене. Ее можно назвать как угодно, главное чтобы открывалась (в моем примере файл vklike.htm лежит в корне сайта). И параметры в виде GET передать можно тут ( типа ?postfix=news/1234).

Ширина виджета по умолчанию 144 px, высота 22. Если поменяли размер виджета, то фрейм тоже придется подкорректировать.

~~Может у вас есть более красивое решение? Поделитесь в каментах .~~

Миша, все хуйня (с). Заходим просто по ссылке http://vk.com/editapp?id=YOUR_APP_ID§ion=options и в поле “Базовый домен” добавляем домены. И все, нечего выдумывать всякую фигню :D. Разве что pageUrl: “YOUR_PAGE_URL” нужно прописать.

Zemanta

Новогоднее оформление блога. Подведение итогов.

[m.k] — Mon, 27 Dec 2010 20:52:31 +0000

Конкурс давно закончился, но подведению итогов помешала пропажа одного члена жюри. 22 декабря 9seo ответил по почте и грозился “завтра оценить и написать”. И все, пропал. Санек, ты где?

Придется без него, скоро уж Новый Год.

Первое место занимает Надюша. Единогласно. Что сказать – Надежда-дизайнер, как гласит заголовок ее блога. И не поспоришь .

На втором месте Денис Доня (PaRaDoKs). Тоже единогласно. Кстати, насчитал 18 Дедов Морозов на главной .

А вот по третьему месту возникли разногласия. Hyperseo проголосовал за http://bomb-club.blogspot.com/, а мне больше понравился блог http://efimov.ws/.

Но в рейтинге у Павла Виктор Ефимов занимал 5 строчку, а Эдуард в моем 4-ю. Поэтому почетное третье место занимает Эдуард.

Вот и все. Сейчас буду писать письма победителям.

P.S. Вчера написал статью про программу легализации ПО в цифрах (точнее, в рублях). По-моему все наглядно и убедительно. А бесплатную доставку дисков придется отменить, а то покупатели по другую сторону Урала так и без штанов оставят .

Zemanta

Новогоднее оформление блога. Участники. Часть 3.

[m.k] — Mon, 20 Dec 2010 18:16:27 +0000

Последний день конкурса подходит к концу. И еще тройка участников.

Еще один блог Владимира

Куда оформление делось? Вроде бы, раньше этот блог понаряднее был.

Денис aka PaRaDoKs

А вот человек просто мимо шел и попал на конкурс .

Еще один хотел поучаствовать, но блог не открывается (ни разу не зашел)

Скоро узнаем победителей. Уже догадываюсь, кто займет 1 место (думаю, будет единогласно).

Приз за 3 место купил. Там изображен черно-белый котэ .

Zemanta

Новогоднее оформление блога. Участники. Часть 2.

[m.k] — Thu, 16 Dec 2010 13:38:33 +0000

Вторая тройка участников конкурса на лучшее новогоднее оформление.

Комментарии оставлять пока не буду.

Вот оформление у Надюши:

Леди Ольга тоже украсила свой блог:

А вот оформление блога (который berezablog.com) Владимира:

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

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

Zemanta

Новогоднее оформление блога. Участники. Часть 1.

[m.k] — Mon, 13 Dec 2010 17:36:01 +0000

В конкурсе на лучшее оформление блога уже достаточно много участников. Итак, первая тройка игроков, в студию .

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

Первым заявку оставил Виктор Ефимов.

Следующий – Darmoid

Участник под номером 3 – Эдуард

Сам я тоже оформление сменил. В нем есть один “косяк”, жду, когда кто-нибудь заметит .

Кстати, конкурс еще не окончен ;). Украшайте и кидайте ссылку!

Zemanta

Тема готова!

[m.k] — Mon, 24 Aug 2009 22:52:10 +0000

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

Итак, по порядку. На заднем плане валяются купюры (рубли и доллары). А в качестве той самой изюминки, про которую я недавно говорил, выбрал компьютер. Конечно, клипарт нашел в Интернете. Но обратите внимание – на нем изображен грузящийся линукс Ubuntu (скриншот тоже нашел).

Кстати, про Убунту. Флеша на сайте нет (а если будет, то как можно меньше), а то флеш-плеер сильно загружает систему.

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

Верстал дивами (это при том, что вообще не умею). В итоге шаблон получился валидный:

Правда, пришлось над этим повозиться. Например, пришлось “кастрировать” плагин смайлов, написанный Жуком. Можно, конечно, было разобраться в коде, но я сделал так, как проще.

Нашлось место и значкам Твиттера и RSS. И даже свободное место осталось (на будущее).

И как-то непреднамерено внешний вид сделал напоминающей фид в feedburner. Сходство заметил случайно, нажав значок RSS.

Есть, конечно, недоработки. Например, список категорий. Пытался сделать в виде иерархии, но в Интернет-эксплорере отображалось криво. Буду думать над этой проблемой дальше.

Zemanta

Делаю новый шаблон для блога

[m.k] — Mon, 24 Aug 2009 17:23:14 +0000

Сегодня ночью дорисовал сам дизайн, сейчас кое-как сверстал. Теперь делаю из этого тему для Вордпресса.

За эти дни вспомнил HTML и CSS, узнал особенности некоторых специфических вордпрессовских функций. Вот о них в ближайшее время и напишу.

В ходе верстки внешний вид претерпел небольшие изменения. А задумывалось примерно вот это:

Новый дизайн

Все простенько, но основную тему отражает. Подробнее про это расскажу попозже, когда шаблон будет готов.

Zemanta

В каждом сайте должна быть своя фишка

[m.k] — Thu, 20 Aug 2009 20:04:00 +0000

Только что закончившийся конкурс “Знаток блогосферы“, устроенный Жуком навел на интересную мысль. Ведь в каждом проекте должна быть своя изюминка.

У многих блоггеров есть такие особенные вещи. У NePoD’а это, например, герои из мультика про Вини-Пуха, у самого Жука – зеленый жук, у Ольги Ивановой – конверт с крыльями, у Арнольда Кочари – галочка в чекбоксе. Перечислять можно бесконечно.

Опять уроды электричество выключили! Слава Богу все, что писал, сохранилось. Продолжаю.

А что у меня? Бесплатный шаблон, пусть и немного измененный. Отличительных черт в оформлении никаких нет.

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

Скорее всего и favicon придется менять. Ребрендинг своего рода получается.

~~После завтра~~ Уже завтра день рождения. Напишу-ка я пост заранее и поставлю публикацию 22 числа. А то мало ли .

Zemanta

Размышления о дизайне сайтов и блогов

[m.k] — Thu, 23 Apr 2009 18:02:34 +0000

Побеседовал с Артуром aka MoLoT.ok (который, кстати, недавно написал пост про Wi-FI). Он посоветовал сменить дизайн на блоге Про Автомобиль. Ру. И это навело меня на мысль, а важен ли так дизайн блога (сайта) в настоящее время?

Подумал и решил, что нет. Сайты (а тем более блоги) интересны в первую очередь своим контентом. Те времена, когда пользователи приходили посмотреть на разные эффекты давно прошли.

Пример: искал информацию по 93 федеральному закону. Забрел на сайт, который, видимо, был сверстан левой пяткой с жуткого похмелья человеком, не разбирающемся даже в HTML. Но сайт оказался очень полезный, прочитал там не один десяток страниц.

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

Вообще дизайн должен быть минималистичным, чтобы пользователи не отвлекались от текста (изображений).

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

Про цветовую палитру – все привыкли к белому фону, черным буквам и синим ссылкам. Но это скучно, банально и неинтересно. Попса одним словом (попса=кал ). Однако народу нравится.

Мне лично самому нравятся темные тона. Но большинству то темные сайты не нравятся. Даже не знаю, что делать.

В общем, чем париться над дизайном, лучше попариться над контентом, ИМХО.

Zemanta