Pull to refresh
0
0
Андрей @OtherOne

User

Send message

Как правильно сортировать контент на основе оценок пользователей

Reading time5 min
Views93K


В оригинале название звучит как «How Not To Sort By Average Rating». Я подумал, что дословный перевод «Как не сортировать по усреднённому рейтингу» будет малопонятен и хуже отражает содержание статьи.

Постановка проблемы


Вы занимаетесь веб программированием. У вас есть пользователи, которые оценивают контент на вашем сайте. Вы хотите разместить высоко оцененный контент наверху, а низко оцененный — внизу. Для этого на основе пользовательских оценок вам нужно вычислить некий «рейтинг».

Неправильное решение №1

Рейтинг= (Число положительных оценок) - (Число отрицательных оценок)

Читать дальше →

Подробно о свойстве float

Reading time4 min
Views218K
Правильное использование CSS свойства float может стать непростой задачей даже для опытного верстальщика. В этой статье собраны варианты применения float, а также некоторые ошибки, с наглядными примерами.

Читать дальше →

Возьми от Firefox все для веб-разработки

Reading time4 min
Views37K
=========

Обновление от 24.03.13
Neatbeans 5.3 бесплатная IDE подходящая для верстки умеет на лету отображать набранный html в хроме через свой плагин.
Тоже самое умеет webstorm.
Куча костылей описанных ниже уже не нужны!

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

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

Со многими вы знакомы, а что есть еще, или вы твердо убеждены, что у вас всего пара рук?

Начнем с самого известного:

1.

Говорят, если бы капитан мочевидность был веб-разработчиком, он бы всем советовал ставить Firebug. Это Джастин Бибер в мире попсы, это почти половина самого firefox.
В представлениях не нуждается, самая дописанная и навороченная панель разработчика FireBug есть только в Firefox.


Ошалеть от увиденного...

62 полезных инструмента для адаптивного дизайна (Responsive web design)

Reading time14 min
Views203K
UPD. Для краткого введения в адаптивный дизайн рекомендую прочитать статью «Как сделать один сайт для всех устройств (Responsive Web Design)».

Перевод крайне ценной статьи «Responsive Web Design Techniques, Tools and Design Strategies» популярного интернет-издания для разработчиков Smashing Magazine.

Еще в январе мы опубликовали статью об адаптивном дизайне «Responsive Web Design: What It Is and How To Use It» (Адаптивный веб-дизайн: Что это такое и как им пользоваться). Адаптивный веб-дизайн продолжает привлекать к себе много внимания, но, учитывая, насколько он отличается от традиционных методов разработки сайтов, он может показаться заоблачно сложным для тех дизайнеров и разработчиков, которые его не пробовали.

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

Техники Responsive web design


1. CSS Transitions and Media Queries
CSS Transitions и Media Queries

Elliot Jay Stocks подробно рассказывает о методе сочетания CSS Media Queries и CSS transitions. Основная идея в следующем: разрабатывая адаптивный сайт с помощью Media Queries, вы постоянно изменяете ширину вашего браузера, чтобы посмотреть, как сайт ведет себя при этом. Но каждый раз, когда отрабатывает один из ваших Media Queries, виден жесткий переход между стилями (первый, например, для десктопов, второй — для планшетов). Почему бы не использовать CSS transitions для сглаживания этих жестких переходов с помощью анимации?



Читать дальше →

Немного о Microdata

Reading time3 min
Views71K
Доброго времени суток! В этой статье я бы хотел рассказать о микроданных и о словаре schema.org. Об этой замечательной технологии уже рассказывали на хабре два раза, но в них не было освещено несколько важных моментов.

Читать дальше →

HTML 5: Microdata

Reading time3 min
Views10K
image
HTML 5 продолжает удивлять нас своими возможностями. Вот еще одна.

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

Microdata & the microdata DOM API

Reading time9 min
Views12K

Введение



Одной из проблем, на решение которой был направлен HTML5, было повышение логичности (и, следовательно, машиночитаемости) разметки, о чем свидетельствует введение стандартных семантических элементов, таких как <header>, <nav> и <figure>. Это все хорошо, но иногда возникает потребность добавить определенные машиночитаемые атрибуты для элементов контента, так чтобы их можно бы использовать в каком-либо скрипте предсказуемо, даже если разметка используемая для различного контента различается между собой. Эта потребность уже удовлетворена, в определенной степени, с помощью простых и обратно совместимых Микроформатов, и с помощью более эзотерического RDFa.

В связи с этим, нет ничего удивительного, что решение этой проблемы было добавлено в спецификацию HTML5 в виде спецификации микроданных(далее Microdata), включающей в себя набор атрибутов, которые могут быть добавлены к любому элементу и связанное DOM API для обработки/агрегирования микроданных на странице.
Прочитать перевод

Видеоурок по созданию интернет-магазина на MODX Revolution + Shopkeeper. Часть 1

Reading time1 min
Views14K


Начинаю делать серию видеоуроков по созданию интернет-магазина на MODX Revolution + Shopkeeper. Пока видео без голосового сопровождения, но думаю и так будет всё понятно.
Из первой части вы узнаете как:
  • Установить и настроить MODX Revolution;
  • Создать шаблоны сайта;
  • Создать меню;
  • Создать и настроить контекст для каталога товаров;
  • Установить Shopkeeper.
Читать дальше →

Обновление по онлайн-курсам Stanford University

Reading time1 min
Views11K
Понимаю, что все заинтересованные уже получили оповещение по почте, но для тех кто не в танке — объявление: онлайн курсы от Stanford University наконец-то начинаются.

Probabilistic Graphical Models — начинается 19 марта, лекции пока не доступны.

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

Natural Language Processing — начало с 12 марта, первое задание Spamlord должно быть уже выполнено к 19 марта, так что регистрируемся.

Design and Analysis of Algorithms I — курс по проектированию и анализу алгоритмов.

Cryptography — доступны видео первой недели обучения.

Game theory — начало 19 марта, материалов на сайт пока нет, но первая порция будет доступна 10 марта.

SaaS уже начался, но для того, чтобы плодотворно учить этот курс, необходима книга (10$). Этот курс от University of California, Berkeley.

Model thinking уже идет практически целый месяц (на самом деле курс основан на материалах University of Michigan, а не Stanford).

Другие курсы в процессе доработки

Computer Science 101, Computer Vision (University of California, Berkeley), Machine Learning, Making Green Buildings, Anatomy, Computer Security

Да, все курсы переехали на платформу Coursera. Поэтому теперь эти лекции смело можно называть «Обучение от Coursera», тем более спектр университетов увеличился.

Update:

Information theory — 12 марта появится первая порция лекций, тоже самое для Human-Computer Interaction.

За апдейтом апдейт: новый виток Machine learning тоже начинается 12 марта.

Создание анимированных tooltips'ов с помощью CSS3

Reading time3 min
Views8.3K
Статьи про создание tooltips'ов уже не раз поднимались на хабре [1,2] в виду большой популярности этого элемента. Сегодня вы узнаете еще один способ как создать простые, анимированные подсказки с помощью псевдо-элементов before и after, а так же свойства transitions.

image


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

Читать дальше ...

Чёртова дюжина советов начинающим верстальщикам. Часть вторая

Reading time6 min
Views5.6K
Доброго времени суток!

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


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

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


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

3D кнопки с помощью CSS3

Reading time6 min
Views44K
Здравствуй, дорогой хабрадруг! Сегодня мы научимся создавать объемные кнопки CSS3! Они основаны на популярной PSD фриби от Orman Clark для его веб-сайта Premium Pixels. Мы постараемся создать копию этих кнопок с помощью CSS с минимальным количеством кода HTML.

Preview

Читать дальше →

Чёртова дюжина советов начинающим верстальщикам. Часть первая

Reading time6 min
Views32K
Доброго времени суток!

Введение


Я являюсь фрилансером. Раньше я не особо задумывался над тем, как и что делают верстальщики. Я делал серверную часть, а мой друг верстал и набивал контент. Совсем недавно мне захотелось попробовать «что и как». Пару дней назад мне на глаза попался материал, который мне очень понравился. Он наглядно обЪяснял, что и как нужно писать. К сожалению, сылку дать не могу, так как я не запаомнил, где располагался сей мануал, но… Казалось бы, можно это и запомнить, но я пошёл ещё одним путём — законспектировал это дело. Собственно, добро пожаловать в мою записку.
Читать дальше →

CSS кнопки с помощью псевдо-элементов

Reading time5 min
Views47K


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

В этом уроке я покажу как создать кнопку с изюминкой, используя только якорный тег и мощь CSS.

Читать дальше →

Оформляем тултипы с помощью CSS3

Reading time3 min
Views21K
image
Всем привет!
Уже несколько раз меня просили сделать обычные тултипы, которые со стрелочками такие. Все бы было хорошо: состряпал блок с круголками, взял треугольники отсюда и вуаля. Однако, не все так просто. Ведь полет фантазии дизайнеров велик. То им стрелочки с наклоном, то им рамки, то тени. Можно, конечно, все запилить на картинках, но ведь это старомодно непрактично. Хотя бы из-за кучи оберток, для того, чтобы все тянулось во все стороны.
Всё это оказалось абсолютно решаемым с помощью CSS, если включить немного фантазии.
От слов к делу.
Читать дальше →

Швеция официально признала файлообмен религией

Reading time1 min
Views7K


Правительство Швеции официально признало Церковь копимизма — религию, центральным принципом которой является свободный обмен информацией.

Копимисты (copy me) верят, что обмен информацией является священным и что ценность информации умножается, когда она распространяется. Священными символами их религии являются сочетания клавиш для копирования и вставки Ctrl+C и Ctrl+V.
Читать дальше →

Вышел Shopkeeper 2.0 beta1 для MODX Revolution

Reading time2 min
Views4K

Продолжается разработка модуля Shopkeeper для MODx Revolution. Этот модуль (и сниппет) многим уже известен и используется на MODx Evolution для создания интернет-магазинов.
Кроме переноса Шопкипера на Рево планируется полный рефакторинг кода с учетом накопленного опыта. Но уже сейчас можно использовать версию beta1 для создания простенького магазина.
Что уже готово

Оценка трудозатрат выполнения проекта по разработке ПО: практика в условиях украинской реальности

Reading time13 min
Views118K

Вступление



К написанию данной статьи меня подтолкнул не очень давно завершившийся проект. Как и в любом другом проекте, в нем были и ошибки (в том числе и при оценке), и проблемы и интересные их решения, и, несмотря ни на что, боевой дух команды, и желание сдать проект во время, и переработки и таки сдача проекта в срок, и долгожданный отпуск. Все это стоит отдельной статьи. Но главное — был бесценный опыт, на основании которого создана эта статья.
Очень часто, мы оцениваем проект и сильно ошибаемся. И вроде как из-за мелочей, которые появляются по ходу проекта, но которые, в действительности, можно было бы и обнаружить и учесть заранее.
Статья содержит простые и в тоже время полезные рекомендации и метод расчета оценок трудозатрат проектов и будет интересна руководителям проектов, архитекторам, системным аналитикам, продавцам ИТ решений и всем остальным, кто занимается оценкой работ по проектам с фиксированной ценой (fixed price projects).
В статье мы займемся только оценкой трудозатрат по работе над проектом, оценка длительности выполнения и стоимости – это совсем другая история.
В статье я описываю свой личный опыт оценки проектов, и,
конечно же, у вас могли быть другие ситуации и свои методы и
рекомендации оценивания.
Для большего понимания сути, смысла и «духа» статьи рекомендую сначала просмотреть:
  • выступление Сергея Мартыненко «Написание тестов, как вид тестирования требований»[1], на которое я буду часто ссылаться в ходе данной статьи. Важно понимать, что правильно сформулированные цели и требования – это большой и важнейший шаг к успеху проекта
  • и презентацию Сергея Бережного
    «My Story: «Путь овертаймов» [2]. По большому счету данная презентация к теме статьи не имеет, но имеет отношение к неправильно оцененным трудозатратам.

Статья содержит такие разделы:


  • Украинские реалии при выполнении проекта
  • Проблемы и их решения
  • Подготовка к оценке
  • Перечень работ для оценивания
  • Оценка работ по написанию кода
  • Цифры и коэффициенты из практики
  • Пример расчета

Читать дальше →

Исследование о мобильных интерфейсах

Reading time20 min
Views7.3K
Представляю вашему вниманию перевод статьи под названием "A Study of Trends in Mobile Design" от Alexander Dawson. Перевели в компании UXDepot специально для пользователей Хабрахабра с одобрением издания Smashing Magazine.

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



Цель этой статьи — рассказать вам о методах, которые используются на самых популярных сайтах для того, чтобы предоставить пользователям мобильных устройств удобное и (надеемся) полезное взаимодействие. Среди проанализированных сайтов много известных компаний, например Facebook и Amazon. Мы приготовили для вас настоящий экскурс в мир мобильного веб-дизайна, со статистикой и по-настоящему интересными открытиями.
Читать дальше →

Реалистичные тени при помощи CSS3 без использования изображений

Reading time7 min
Views143K
Привет, Хабр!

Хочу поделиться замечательным мастер-классом по созданию реалистичных теней для блоков на чистом CSS, найденном на просторах рунета по адресу http://mainview.ru/css/realistichnye-teni-pri-pomoshhi-css3-bez-ispolzovaniya-izobrazhenij. Естественно, для того, чтобы примеры работали как надо, необходим браузер с поддержкой CSS3.

image

Читать дальше →

Information

Rating
Does not participate
Location
Киевская обл., Украина
Date of birth
Registered
Activity