D.iK.iJ
 
Ссылки Поиск Написать В избранное NO

Блоггер / Блог 2017 год

RSS лента новостей, Подписка по Email

Адаптивный шаблон на HTML 5 с меню - скачать бесплатно

Попросили меня сегодня быстро сделать простой адаптивный шаблон для небольшого сайта.


Протестировать можно по ссылке выше. Для примера я сделал вариант, который вечно не могу найти на Html Book - фиксированная левая колонка и резиновая - правая. Все остальные элементы сделаны просто для примера. Да и ограничения на максимальную ширину тут нет. Верстка блочная, а стили встроены в саму страницу.

Код удобно править по [F12] в Хроме, а проверять - уменьшая ширину окна браузера. Сильно расписывать не буду, так как остальное можно прочитать у меня в статье (внизу страницы) «Как сам...

Экзотические фрукты - почти как из Таиланда

ВК и телефон - это хорошо, но ничего не заменит хорошей фотографии на зеркалку и записи в блоге, которую всегда можно найти и вспомнить названия фруктов!


К нашей 5 годовщине поехал с мамой в Ленту и решил порадовать всех экзотикой, которой недавно еще не было в нашем городе. На фотографии питахайя, саподилла, салак (снейкфрут или змеиныйфрукт) и рамбутан. А вот мангостин гнилой оказался. Даже фотографировать не стали. Жаль, дорого. Коробочка на один вид фруктов - от 250р. Хотя, тут только часть. Остальным угостил родителей.

1) Питахайя - хоть и драконий фрукт, но на самом де...

Первая проба кулонов с опалами из медной проволоки (wire wrap)

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




1) Брелок с искусственными опалами и лавой. Кабошон - брак. Пробовал обточить и перезалить после кривой китайской формы, но лавовый порошок просочился на лицевую сторону. Получилось интересное такое "затмение".

2) Просто остатки эпоксидки с блестками (от какой-то заливки).

3) "Ледяной кулон" из поста ранее. Стекло кракле и эпоксидная смола.

4) Из наполненной серебром пров...

Как производители мобильных игр заставляют нас устанавливать игры конкурентов

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


Например, сейчас вот часто смотрю МИР MMO ИГР или что-то отдельное, что заинтересовало и точно не хочется покупать и проходить. В принципе, на этом мое участие в десктопных играх заканчивается, если не считать поддержку проекта СтарСитизен, который, если честно, на моей старой видяшке ужасно тормозит.
А вот с мобильными играми интереснее. Не всегда хочется начинать читать серьезный роман в обе...

Кулоны с натуральными эфиопскими опалами

Как обычно, купить недорого можно будет на mosaicopal.ru. А точнее - в магазине на Ярмарке Мастеров.


Очень любопытно, что все кулоны - с практически одинаковыми камнями (только для второго подбирал желтые опалы). А главное различие тут - в подложке. И вот как ни старайся, на темном фоне опалы всегда играют цветами значительно сильнее. И мастера этим практически всегда пользуются как в триплетах, так и в мозаичных опалах.
Да и без хорошего света тут никак не обойтись. В общем, получился очень занятный эксперимент с натуральными камнями. А впереди еще большие подвески с оправой...

Похоронили Рэкса

Ты был хорошим и верным котом. Прости, если что-то сделал не так. Мне очень жаль, хоть ты и не умеешь читать. Оставляю тебе твою любимую лежанку, которую подарили 10 лет назад и торжественно обещаю, что ни один кот не будет гадить в твой лоток.
Прощай, друг. Я надеюсь, что все коты попадают в Рай. А если и нет, то для тебя найдется вкусная еда и теплая батарея и в любом другом месте.
Но мы будем скучать.





Идея (небольшой мастер-класс) «Жидкие опалы». Делаем магический кристалл любого размера

Доброго вечера всем. Сегодня мы будем делать самую настоящую магию!



Это может быть как как кулон, подвеска или кольцо, так и так и огромный кристалл с волшебными переливами. Себестоимость в любом случае - от 100 рублей. Заранее извиняюсь за качество фотографий. Они были с процесса на телефоне, а теперь уже все подарил и не могу переснять.

И начнем мы с самого простого. Голографическая пленка для ногтей. Бывает как прозрачная, так и с отделяемым верхним слоем. Приведу ее для примера, но она нам не нужна. А вот прозрачная выглядит очень интересно!

Тут нужно чу...

Осенние галактики в кулонах с опалами

Вечер добрый всем! Наконец смог полностью переснять новые кулоны с опалами, фотографии с которыми я умудрился... потерять. В честь первого снега - осенняя тематика!
Ну и анонс новых кулонов, которые будут добавлены в ближайшее время в магазин mosaicOpal.ru.



Да, это черные и белые искусственные (или лабораторные) опалы в эпоксидной смоле. Подложка - лунный камень или лава. Видео было вот тут, если кому-то интересно.
Ну или ужасный ролик с телефона - сразу после заливки. К сожалению, ничего снимающего лучше - пока не предвидится.


Зима близко! Делаем ледяные кулоны. Пошаговый мастер-класс и хитрости работы с эпоксидной смолой

И начнем мы, пожалуй, с фото для привлечения внимания!



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

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

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

Про кулоны с опалами, грудь и работу

В последнее время очень много работаю, но стараюсь уделять время и кулонам с опалами: mosaicOpal.ru. Было несколько розыгрышей в Инстаграме и каждый раз фотографии получивших кулоны девушек меня очень и очень радовали! Например, ниже фото сессия от моей очень хорошей знакомой, которая давно меня поддерживает и с удовольствием забрала еще самые первые кулончики, которые делал просто с блестками.



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

Еженедельный розыгрыш кулона с опалами

Сегодня у нас лунное затмение! И я очень хочу подарить кому-то практически лунный кулон с белыми опалами.


Условия просты:
- Подписаться в Инстаграмм на @mosaicopal.ru
- Сделать (в нем же) репост этой записи со ссылкой на мастерскую.
- Под оригинальной записью оставить свой уникальный номер участника (по порядку) и упомянуть двух друзей, кому это может быть интересно.
- В случае победы оплатить 300 рублей за доставку посылки.

Да, победитель будет выбран в следующий понедельник днём, если наберем больше 20 участников за неделю.
Не принимаются "конфетные" странич...

Кулоны с опалом и не только - MosaicOpal.ru

Ну или по всем вопросам можно написать мне.



Как я уже писал, купить что-то красивое из опалов - это просто не реально. Китай продает только искусственные камни большими партиями, мелкие магазины торгуют какими-то «зернами» (явно для ювелиров) по 15 -20 тысяч рублей. А крупные фирмы сосредоточены или на мелких серых камешках, которые по какому-то странному стечению обстоятельств (и химического состава) тоже называются опалами. Или же продают «крупные» камни в несколько сантиметров за сотни тысяч рублей.
Так и появился сайт MosaicOpal.ru и мастерская #WildCraft66, которые врем...

Искусственные опалы и MosaicOpal.ru

На днях я купил домен MosaicOpal.ru под очень конкретный проект по созданию кулонов из опалов и других украшений из них. Дело в том, что у нас в стране абсолютно любой (белый, черный, матрикс или даже искусственный) опал будет стоить огромных денег. И его еще нужно купить!
Даже триплет (опал-мозаика из нескольких слоев) встречался мне всего несколько раз. И выглядел обычно как кусок... не пойми его на черном фоне. А это ведь уже даже и не совсем настоящий камень. А уж про цену за эти «рисовые зернышки» я лучше промолчу. Несколько десятков тысяч рублей вас неприятно удивят.



А...

Рецепт вяленого мяса в домашних условиях

Я уже писал про покупку вяленого мяса, которая оказалась не самым простым делом. А теперь вот реально вкусный рецепт для приготовления в домашних условиях.


В оригинальном рецепте автор готовит биф джерки и берет:
• Сок 1 лайма;
• Чайную ложку горчицы;
• Две столовые ложки меда;
• Пол столовые ложки сушеного чеснока;
• Столовую ложку кусочков паприки;
• Столовую ложку черного перца горошком;
• Стакан соевого соуса.
Мясо режется поперек волокон на пласты толщиной 1 сантиметр (жир и жилки убрать) маринуется в смеси 8 часов и потом сушится часов 6 (до готовности)...

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

Источник: «С 1 июля 2017 г. вступают в силу поправки, внесенные в ст. 13.11 Кодекса РФ об административных правонарушениях (далее — КоАП РФ), которая устанавливает наказания за нарушение порядка сбора, хранения, использования или распространения персональных данных граждан.

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

Кольцо из старой курительной трубки и эпоксидки

Дерево - бриар (вереск после 10 лет сушки и 2 лет использования в трубке). Ну и ювелирная смола.



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

Асинхронная загрузка комментариев и других скриптов Вконтакте - улучшаем Google PageSpeed Insights

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


Почему это так важно?
При синхронной (обычной) загрузке скрипта браузер ждет его полной загрузки. И только потом показывает посетителю идущий ниже в коде контент. Так как обычно все скрипты идут в <HEADER> страницы, при блокировке домена или его «подвисании», дальнейшая загрузка может занимать до 3 минут. Нужно также учесть, что скрипт комментариев ВК весит около мегабайта. И на мобильных устройствах может грузиться довольно дол...

5 литров апельсинового сока за 90 рублей

Так как я люблю варить всякую бурду, сегодня пробую рецепт - как из 3 апельсинов и лимона сделать 5 литров сока.


Рецепт крайне прост!
- 3 - 4 апельсина помыть и ошпарить кипятком.
- Убрать апельсины в морозилку примерно на 2 часа.
- Достать, порезать и пропустить через мясорубку.
- Залить водой и нагреть, не доводя до кипения.
- Процедить через сито и добавить примерно 15 - 19 столовых ложек сахара на 5 литров жидкости (видел рецепт с килограммом сахара на 9 литров воды, но как-то это совсем много).
- Добавить сок 1 лимона.
Да, во многих рецептах рекомендуют про...

Раскрашиваем любое старое фото автоматически в цветное

Вот пример работы алгоритмов. Фотографии просто снял на телефон (для примера) и загрузил:



Сервисы:
color.artlebedev.ru
demos.algorithmia.com/colorize-photos

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

Как сделать открытие меню свайпом вправо, влево, вверх или вниз

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


Ниже я привожу код (JavaScript), который использован у меня в адаптивном меню. Найден в сети, чуть переделан и точно работает на Андроиде:

var initialPoint;
var finalPoint;
document.addEventListener('touchstart', function(event) {
initialPoint=event.changedTouches[0];
}, false);
document.addEventListener('touchend', function(event) {
finalPoint=event.changedTouches[0];
var xAbs = Math.abs(initialPoint.pageX - finalPoint...

Как получить 100% по PageSpeed Insights за изображения

Элементарно! Использовать на сайте только .pnd, так как Гуглу он нравится практически в любом виде:


Как это тестировалось?
Я взял 2 одинаковых изображения, которые сделал из скриншота экрана.
Размером в 241 000 байт каждое. Сохранено Фотошопом для Веб и устройств.
Ширина 1024px (если сделать 800, ошибок не будет вообще).
И на скриншоте выше отлично видно, что у проверки скорости претензии есть только к .jpg картинке, которую предложено оптимизировать или скачать по ссылке готовый вариант на 79 килобайт. Качество, если честно, ужасное.

Потому скажу в блоге еще раз ...

Как сделать рекламу от Яндекс Директ и Гугл Адсенс адаптивной (мобильной)

Ну или скажу иначе - как на мобильном показывать одни рекламные блоки Директа (например, Motion) а на десктопе - другие? Ниже в примере Постер на 3 объявления - с десктопной версии.


Но начну я с настройки адаптивных блоков Адсенс. Если помните, я там просто меняю формат блоков с data-ad-format="auto" на data-ad-format="rectangle". Слишком уж много в блоках узких горизонтальных объявлений. А так выводятся только большие прямоугольные и квадратные. Но если очень нужно, модно под каждый размер экрана выбрать свой размер объявлений. Нужно только грамотно настроить стили и медиа-запросы....

Отключаем скролл (прокрутку) страницы при открытии модального окна

Также, этот способ использован в скрипте адаптивного меню для сайта.


Все очень и очень просто! Обычно хватает использования body {overflow: hidden;} в стилях. Это скрывает полосу прокрутки страницы, а лежащий поверх слой с меню (или модальным окном) прокручиваем при помощи того же overflow: auto. Причем, специфические overflow-x и overflow-y лучше всего использовать только для отмены прокрутки по одной из осей, так как не все браузеры их вообще понимают.
Но и с самим overflow: hidden иногда бывают проблемы. Некоторые браузеры позволяют прокручивать такой блок (без полос прокрутки...

От рукоделия до макросъемки всего один шаг

Просто бусина из стекла, которая снята через стеклянный кабашон.



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

Разрешения экрана для адаптивной верстки

А это ведь очень интересная тема! И от заказчиков я часто слышу полностью противоположные мнения. Кому-то хочется захватить только мобильные телефоны, кому-то важен только Айфон, а некоторым хочется видеть на Айпаде только полную версию и не переходить на мобильную (адаптивную) версию сайта.
Ниже я привел список разрешений для работы в Бутстрапе (который я не использую, кстати):


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

box-sizing: border-box - делаем так, чтобы отступы не учитывались в ширине блока

Я иногда несказанно торможу. Например, вообще забыл про просто спасительное для адаптивной верстки box-sizing: border-box, поддерживаемое всеми современными браузерами.


Вот очень простой пример из трех блоков шириной 180px. Первый - с отступом в 10 пикселей и рамкой 3px, второй - без отступа. Третий - просто с рамкой и с использованием box-sizing: border-box.

padding 10px
padding 0px
box-sizing: border-box
И тут видно самое интересное. Если не использовать box-sizing: border-box, то ширину блоку добавляет не только внутренний отступ padding, но и сама рамка. И если в...

Скачать скрипт социального замка (соцзамка) без регистрации и СМС

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


Я не стал прятать контент со страницы, подменять скриптом или размывать, так как все это имеет смысл, если у вас какой-то крупный проект полностью завязан на соцзамках. Но тогда вы скорее наймете программиста, который будет отслеживать лайки и клики по API, а не просто показывать контент через 10 секунд после клика и ставить куки на неделю.
Хотя, на сайте с миллионо...

30 лет

...это лучший в мире повод купить себе квадрокоптер с камерой! Особенно, если есть сын.


Ну и от брата еще вчера получил очень крутое поздравление с цитатой в тему:
«Я молчал. Он окликнул еще раз:
– Ник?
– Что?
– Может, выпьешь?
– Нет… Я сейчас только вспомнил, что сегодня день моего рождения.
Мне исполнилось тридцать. Впереди, неприветливая и зловещая, пролегла дорога нового десятилетия.
Было уже семь часов, когда мы втроем уселись в синий «фордик» и тронулись в обратный путь. Том говорил без умолку, шутил, смеялся, но его голос скользил, не задевая наших мыслей...

Где купить самое вкусное вяленое (сушеное) мясо недорого?

Очень просто! У @serezkako (Сергей Колдаев)! Все, на том пост можно и закончить. :-) Ну правда. Это круче стейка из свинины и вкуснее самых любимых пельменей. Только камера на телефоне все равно не передаст вкус.

#jerky #meat #мясо #вяленоемясо #сушеноемясо #джерки #someguys #оченьвкусно #вяленое
Да, есть экзотика вроде мяса индейки, кабана, баранины, лося, оленины, но говядина самая вкусная именно у Сергея и его #Someguys. Friends & Brewer. Не говорю уже про пиво. Если честно, я такой вкусной говядины никогда до этого не пробовал. Да и вообще - такого вкусного вяленого мяса. Это даж...

100 сайтов в портфолио по адаптивной верстке

Сегодня у меня небольшой «юбилей» адаптации сайтов под мобильные устройства! И так случайно совпало, что я занимаюсь адаптивным дизайном уже 2 года (запись была сделана в этот же день). Хотя, первые упоминания были еще в 2014.


Два c лишним года назад я немного психанул, пытаясь написать пост на мобильном телефоне и мучаясь с горизонтальной прокруткой. И решил, что просто «резинового» дизайна для моих сайтов больше не хватает. Теперь нужно сделать что-то, чтобы можно было удобно пользоваться сайтами на своем телефоне без постоянного увеличения и скроллинга.
А уже чуть позже я взял...

Главная, 1,
( 35 )