Adobe запустили Adobe Edge Tools & Services — набор сервисов и инструментов, призванный помочь разработчикам в создании веб-сайтов и приложений.

Что внутри

Ребята с webmasterworld.com решили собрать все факторы, которые учитивает Google при ранжировании сайтов. Официальным представителем было заявлено (еще на тот момент), что их более 200. Пока список выглядит так, не исключено, что некоторые пункты включают в себя несколько факторов.

Вольный перевод статьи опубликованной в Smaching Magazine графическим дизайнером из Хайдерабада (Индия), Ашишем Боджаватом.

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

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

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

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

На данный момент в базе 23586 элементов и почти тысяча UI-сэтов включающие в себя готовые решения в едином стиле. Проект создан Британской студией Double-J Design целью проекта является создание самой обширной UI базы.

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

Для начала определим наши задачи:
— по возможности использовать официальные сервисы определения статуса
— в случае их отсутствия можно прибегнуть к посторонним
— способ должен быть как можно проще, без излишков (всегда можно будет его потом расширить)
— чтобы прорисовка страницы не висла на время запроса, сделаем буфер

Рассмотрим 4 основных способа на примере ICQ, Jabber, Skype и MRA. Остальные можно сделать аналогично.

Ища на просторах сети музыкальный плеер для сайта, я наткнулся на интересный плеер под названием Speakker, написанный на jQuery.

Раньше, если мы делали div шириной и высотой 100px, добавляли padding 10px и border 10px, то получался квадрат не 100х100, а 140х140 px:



Но иногда требуется, чтобы div был фиксированной ширины при любых значениях padding и border. В CSS3 нам поможет свойство box-sizing.

В этой статье я расскажу о своем опыте разработки кросспостинга из моего Facebook в мой Livejournal (далее – ЖЖ), а также поделюсь исходными текстами, готовыми к старту на ваших аккаунтах.

Причиной написания скриптов было получение возможности поиска по своим записям – возможности, которую Facebook никак не может запустить как часть своего сервиса, а также «оживление» своего ЖЖ. Поскольку доступ к любым постам в Фейсбуке требует обязательной авторизации, поисковых роботов сервис, очевидно, не пускает. Конкретно в моем случае это неудобно: ссылки, видео и мысли, которые я публикую в соцсети, зачастую я публикую «на будущее» – и часто настает тот момент, когда эта информация становится необходимой, но ее уже практически не найти.

Также с использованием опубликованных здесь скриптов удалось перенести архив существующих записей Facebook: более 2000 архивных сообщений моего Facebook перешли в ЖЖ с соответствующими датами. То есть, если у вас еще не было ЖЖ, его можно сразу наполнить информацией за все время.

Также в статье выкладываю готовые скрипты на Perl, с использованием которых можно транслировать статусы Facebook в Livejournal, а оттуда, при наличии соответствующих настроек, в Вконтакте, Twitter и RSS, а с использованием дополнительных веб-сервисов – практически во все блог-движки.

Вступление

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

Полагаю, что я не один такой. В добавок к вышесказанному, все новостные ресурсы я предпочитаю читать через РСС-ленты, считая их самым удобным средством распространения информации. К сожалению, оба информационных гиганта — Фeйсбук и Твиттер — лишили пользователей возможности выкачивать ленты. За пару дней я собрал на коленке сервис, который устраняет этот недостаток.

Итак, милости прошу на Queryfeed.

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



Для Chrome есть отдельное приложение.

На данный момент доступно более 60 шаблонов элементов, экспорт в PDF и PNG, клавиатурные шорткаты, группировка объектов, привязка к сетке и проч.

Проект находится в стадии активной разработки и открыт для критики, помощи и предложений.

Хорошо известна старая поговорка, гласящая, что Интернет был создан для порнографии. Увеличение скорости соединения по всему миру, онлайн-вещание видеороликов, видеочаты и живое общение, оптимизация трафика, огромные хранилища и безотказный хостинг — всё это лишь следствия запросов порноиндустрии.

Согласно отчету принадлежащей Google рекламной сети DoubleClick, которая отслеживает посетителей по cookies, в числе 500 самых посещаемых сайтов сети есть десятки порнографической направленности. Xvideos, самый крупный порносайт мира, получает 4,4 миллиарда просмотров страниц в месяц, что в три раза больше, чем CNN или ESPN, и в два раза больше, чем Reddit. LiveJasmin, YouPorn, Tube8 и Pornhub — огромные веб-сайты, посещаемость которых ниже лишь гигантов уровня Google или Facebook.

Предлагаем вашему вниманию очередную подборку с ссылками на новости, интересные материалы и полезные ресурсы.

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

Привет, Хабралюди!

У меня есть хобби. Я ночами (в нерабочее время) пишу библиотеку укладки графов: vivagraph.js. Хотел поделиться с вами, узнать что думаете. Визуализировал я сеть друзей своих на «В Контакте» с использованием WebGL. Но лучше один раз увидеть, чем читать, верно?



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

На презентации Adobe CS6 в Самаре я делал доклад о том как мы в компании Parcsis используем Adobe Illustrator для создания веб- и мобильных интерфейсов. Хочу поделиться этим докладом с вами в виде слайдов с комментариями.



Когда показываешь свои работы, зачастую начинающие дизайнеры задают вопрос «А в чем это нарисовано?» Опытные дизайнеры спрашивают такое реже, так как понимают, что одно и тоже можно сделать с помощью разных графических редакторов. Тем не менее, расскажу свою историю…

Я постараюсь сделать самое полное и подробное описание возможностей Web Inspector, на русском языке.
В первой серии мы залезем в настройки, посмотрим, что умеет консоль и поиграемся с панелью «Elements».

Так как Web-Inspector не переведен на Русский, я буду сохранять оригинальные названия.


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

Предлагаем вашему вниманию очередную подборку с ссылками на новости, интересные материалы и полезные ресурсы.

Продолжая тему предыдущего поста Несколько полезных сервисов, хочу поделиться новыми ссылками.

Экспорт контента

• rss-script.ru – сервис для вставки содержимого RSS-ленты на сайт. Для его работы необходимо лишь сгенерировать скрипт на сайте и вставить его себе. Есть несколько настроек, позволяющих изменить вид содержимого
• twitterfeed.com позволяет постить содержимое RSS-ленты в Twitter, Facebook и LinkedIn. Достаточно простой сервис, нет дополнительных настроек, но есть счётчик кликов
• ifttt.com – многофункциональный сервис, позволяющий связывать различные аккаунты (описание)

Песочницы
К уже названным ранее cssdesk.com и jsfiddle.net можно добавить dabblet.com, jsbin.com (добавил Jekyll). Также есть песочница для SQL – www.sqlfiddle.com (добавил volinrok).

Шаринг фрагментами текста/кода
Для того, чтобы поделиться фрагментом текста или кода, можно использовать всем известный pastebin.com, а можно воспользоваться его альтернативами:

• gist.github.com
• pastecode.com
• tinypaste.com
• paste.ubuntu.com

Мне больше всех нравится Gist на GitHub. Во-первых, все текстовые фрагменты привязываются к вашему аккаунту; во-вторых, можно создавать несколько связанных Gist'ов; и в третьих, есть возможность комментирования.

От переводчика

С удовольствием ознакомился с этими рекомендациями и теперь предлагаю вам перевод.

Введение

Это руководство описывает правила для оформления и форматирования HTML и CSS кода. Его цель — повысить качество кода и облегчить совместную работу и поддержку инфраструктуры.

Это относится к рабочим версиям файлов использующих HTML, CSS и GSS

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

О том, как Chrome мешает мне искать XSS-уязвимости.

Почему я ищу уязвимости?

Как и многие из вас, я делаю Code Review и первое, что ищу это конечно уязвимости. Когда уязвимость найдена в коде, хорошо бы проверить есть ли она на самом деле через браузер, потому что бывают «ложные тревоги». Это те случаи, когда данные уже приходят фильтрованными и XSS невозможен. Всегда полезно иметь возможность показать разработчику атаку в действии, потому что это хороший аргумент и помогает быстрее перейти к конструктивному решению проблемы, если есть сомнения, что уязвимость таки существует. Но проверку в браузере я делаю не часто — либо проблема очевидна прямо из кода, либо верят на слово. В общем искать уязвимости — это интересно.

Начало этой истории

Друг скинул ссылки на сайт, который ещё год назад имел XSS-уязвимость, о чем я писал владельцам ресурса. Стало интересно проверить снова. Проверил — XSS есть, но вот простейшего подтверждения выполнения JS я получить не смог!..



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

Первые подозрения

Итак, стал проверять всевозможные варианты внедрения кода — но без результата. По ходу дела выяснил что и как фильтруется, какие есть проверки и прочее, но alert(1); упорно не выполнялся. По ходу дела нашелся ещё и XSRF — приятный бонус!