Доброго времени суток!

О том, что вы читаете

Вот оно и свершилось — перед вами продолжение советов начинающим верстальщикам. Если вы не читали первую часть, то можете сделать это прямо сейчас.
В данной части вы ознакомитесь ещё с 11 советами (именно столько в моей второй заметке их находится).
Сперва мы пройдём нововведения в визуализации, а затем пофилосовствуем на тему семантики.

Ещё немного лирики

После выхода первой части я получил огромное количество feedback'a. Если честно, я не ожидал такого желания изучить что-то новое. Да-да, быдлокодеры там тоже есть. Но сейчас не об этом…
Также, как вы можете заметить, что количество человек, добавивших мой топик в избранное достигло миллиона, достаточно велико, что не может не свидетельствовать об огромном интересе к HTML5. Итак, поехали.

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

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

Так что следующим шагом стал просмотр готовых вариантов в сети.

Поиск

Шаблоны для CMS не подходят хотя бы потому, что CMS не будет. И такие шаблоны чаще всего рассчитаны на более сложные сайты. И они не будут радовать посетителей с мобильными устройствами.

Хотя, сейчас появились шаблоны с адаптирующейся разметкой (responsive design), которые и вызвали у меня интерес. К сожалению, большинство найденных решений оказались платными, что не удивительно, учитывая объем работы, который проделывают их авторы.

09.01.2012 в «Smashing Magazine» была опубликована подборка бесплатных шрифтов.

В подборке представлены такие шрифты как: Homestead, Bree Serif, Levanderia, Valencia, Nomed Font, Carton.

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

P.S. Для того чтобы скачать шрифт установите 0 (ноль) в поле «Amount».

UPD: Smashing Magazine сново онлайн.

Вчера благотворители и краудфандеры начали собирать Яндекс.Деньги в Facebook, а сегодня в распоряжение жителей интернета поступают и вовсе универсальные кнопки и платежные формы. Их можно разместить на своих сайтах и блогах, настроив любым удобным для вас образом.

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

Внутри — сам чеклист и примеры из нашей практики.

Добрый день. Несколько дней назад появилась необходимость использовать слайд-шоу на своём сайте, но оно должно было быть нестандартным, чтоб привлекало внимание пользователей. Искал в течение дня и ничего нормального не мог найти, были более менее подходящие «слайдеры», но душа хотела клубнички. После того как я облазил весь рунет, переключился на «забугорных» друзей и… удача! Забегая наперёд хочу сказать: этот обзор сделан потому, что в рунете нет никакого упоминания про это слайд-шоу, отсюда и логика.

Как-то для личных целей мне понадобилось сделать ajax загрузку сразу нескольких файлов. Но хотелось сделать это красиво и удобно.
Для этой задачи я выбрал горячо мной любимый jquery и несколько плагинов к нему.

Валидации HTML-форм уделяют очень мало внимания. Например, даже на habrahabr.ru пока я регистрировался и входил на сайт несколько раз мне выдавалось сообщение об ошибке: то код протекции ввел неправильно, то в логине указал email вместо логина. А еще бывает пользователи ошибаются с количеством цифр в номере телефона или реквизитах организации, путают русскую букву «с» с английской, при копировании и вставке в Windows лишнии пробелы добавляются к данным.

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

Для решения данной проблемы были несколько способов: HTML5, jQuery Validate, zForms.ru и еще ряд менее известных библиотек. Но все эти способы имели свои недостатки: HTML5 поддерживается не всеми браузерами и не имеет опции не отправлять незаполненные поля, задать сообщение о несоответствии регулярному выражению, ограничить список допустимых символов для ввода в поле, возможности склеивать поля, посылать значения чекбоксов в формате csv или суммы значений.

Сегодня мы провели вебинар, посвященный пресловутому Закону о защите персональных данных (РФ). Ведущий вебинара Евгений Царев (автор более 10 исследований, 50 статей и 300 публикаций и комментариев в СМИ по информационной безопасности) рассказал о новых моментах в законодательстве, а также ответил на множество вопросов участников.

Запись и презентация в открытом доступе доступны по ссылке.

Желание просмотра iptv по wi-fi возникла одновременно с приобретением ноутбука. Поскольку мой провайдер транслирует некодированый сигнал, то нужда в приставке отпадала, и для реализации желания требовался только раутер, способный «показывать» iptv. После недолгих мучений выбор пал на ZyXEL nbg460n, который должен был удовлетворить все возникшие потребности, при этом мною, человеком неискушенным в этих вопросах, предполагалось, что iptv само собою будет раздаваться и по wi-fi, но как раз с этим возникла проблема.

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



Под катом одно из возможных решений.

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

Если вы запускаете новый сайт и заканчиваете его оформление, то есть смысл посмотреть коллекцию Subtle Patterns: отлично оформленную коллекцию фоновых текстур (паттернов) под лицензией Creative Commons Attribution 3.0 Unported. Их можно использовать без ограничений.



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

Все текстуры на сайте Subtle Patterns являются повторяющимися, то есть склеиваются в бесшовную заливку.

Вы же знаете, как это иногда бывает: погружённый в фантастический мир новых знаний, вы сидите, расслабившись, перед мануалом, и тут влетает некий истеричный субъект, мечет гром, молнии и икру. Когда удастся погасить взрыв эмоций, ситуация начнёт проясняться.
Итак, суть проблемы: есть некий компьютер/терминал в труднодоступном месте, до которого организован не очень стабильный канал связи. Если связи нет в нужный момент, этот терминал становится местом локального смерча, в вихре которого носятся все от мала до велика.
Суть задачи: организовать резервный канал связи с автопереключением на него, в случае падения основного и назад, когда основной поднимется.

В этой публикации я опишу своё решение на приснопамятном DLink DIR-320.
Я потратил много времени на тщетные поиски сначала способов и реализаций, потом прошивок и скриптов, прежде чем пришёл к ответу. Надеюсь эта информация окажется полезной.

Вышла новая версия плагина! Версия 3.5.

Представляю вашему вниманию плагин для WordPress который дает возможность создавать гибкие формы калькулятора.

Вкратце о возможности плагина:
Текстовой блок — любой текст, возможно использовать HTML;
Выпадающий список — список SELECT;
Чекбокс — список CHECKBOX;
Радио кнопки — список RADIO-BUTTONS;
Вводимое поле — текстовое поле позволяющее вводить цифровые значения;
Hidden поле — скрытое поле;
SESSION поле — результаты расчета калькулятора из массива;
Дизайн — возможность выбирать дизайн калькулятора;
Настройки — настройки калькулятора;

На одном сайте можно создавать более 1 калькулятора.

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

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

Сегодня я хочу рассмотреть вопрос выбора цвета, который, как я предполагаю, мы все связываем с определенной реакцией — например, цвет успеха, цвет неудачи, и какой выбор цвета вы ожидаете увидеть при заполнении полей регистрации, когда вы делаете всё правильно или неправильно. Какой цвет приходит вам на ум, когда вы думаете про «успех»? Какой цвет приходит вам на ум, когда вы думаете о каком-то неправильном действии?

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

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

С прошлой недели все наши пользователи могут попробовать в работе новый дизайн сайта в «боевом режиме». Создали новую версию в студии Лебедева и чуть ниже я немного расскажу об опыте работы с ними.

Нам в Эльбе довольно часто задают вопросы по типу «Я „упрощёнщик“, у меня есть электронный кошелёк в Яндекс.Деньгах, как его в доходах-расходах учитывать и перед налоговой отчитаться?».

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

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

Проверял лично и убедился в том, что исправно работает под следующими браузерами:

IE7+, Opera 10.5+, FF 3.6+, Chrome 12+ (linux), Chrome 13+ (windows), Safari 5+(win) исходя из личного опыта, предполагаю о том, что работать исправно будет во всех свежих версиях Safari, FireFox, Opera и Chrome.

С помощью CSS можно построить вот такие вот симпатичные варианты:

За 5 лет существования проекта smscoin вырос не только коллектив, но и поле деятельности нашей компании. Смс-биллинг остался основным направлением деятельности нашего проекта; но мы пошли дальше, сменив методы разработки, испробовав массу новейших технологий в активных бизнес-приложениях, развиваясь и в других, не менее интересных сферах. Именно об этих проектах и интересном опыте, полученном в процессе их разработки, и пойдет речь в серии статей, первая из которых перед вами.



Дабы оправдать наличие Django в списке тегов, замечу, что это наш первый публичный проект на Django, хоть сам фреймворк и был использован ранее во внутренних разработках.

Если вам интересно, как можно подключить на свой ресурс смс-платежи, не написав при этом ни одной строчки кода, не регистрируясь на нашем сайте, и получая все деньги вперед, то просим читать далее.