Как стать автором
Обновить
1
0
Сархан Гасанов @grippin

Разработчик

Отправить сообщение

Делать ли мобильную версию? 5 распространенных проблем, которые решает адаптивная верстка. Опыт Яндекса

Время на прочтение9 мин
Количество просмотров113K

C 2007 года очень быстро растёт количество используемых в мире смартфонов. В числе прочих причин резкого скачка популярности несколько лет назад покупателей привлекла способность этих устройств отображать сайты так, как они выглядели на экранах компьютеров. Но, купив смартфон и начав им пользоваться, люди отмечали, что для чтения отдельных блоков текста на относительно небольшом экране приходилось постоянно масштабировать страницу. Плюс к тому, многие элементы управления сайтов оказалось неудобно использовать. Это происходило потому, что страницы не были рассчитаны на управление с помощью прикосновений к экрану и зачастую требовали компьютерную мышь или другой манипулятор. Для решения этих проблем начали появляться отдельные версии сайтов, предназначенные исключительно для устройств с маленьким экраном. При этом пользователям оказалось не нужно знать адреса мобильных сайтов. Вместо этого сервер считывает информацию об устройстве из обращённого к нему запроса и определяет, какую версию предпочтительнее отдать посетителю.


Сайт smashingmagazine.com на различных размерах экранов


Вскоре многим стало понятно, что разработка отдельной мобильной версии — это долго и дорого в поддержке. Кроме того, это противоречит идеологии веба, который подразумевает, что размеченный документ универсален и может быть прочитан практически на любом устройстве вывода. Для решения возникшего противоречия в CSS был добавлен стандарт Media Queries. Появились новые возможности по определению особенностей устройства, в частности появилась возможность применять различное оформление страницы для произвольных размеров окна.

Читать дальше →
Всего голосов 103: ↑99 и ↓4+95
Комментарии102

UX-дизайн кнопки: советы по созданию, типы и состояния

Время на прочтение6 мин
Количество просмотров168K
Ник Бабич разработчик, UX/UI специалист написал заметку в блоге UX Planet про UX-дизайн кнопки: советы по созданию, типы и состояния. Наша команда выполнила перевод данной статьи

image

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

Советы по созданию кнопок


Кнопки должны выглядеть как кнопки

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

image
Читать дальше →
Всего голосов 13: ↑12 и ↓1+11
Комментарии19

Кнопки-призраки в UX-дизайне

Время на прочтение5 мин
Количество просмотров12K
В 2014 году главным трендом в мире UI-дизайна стали кнопки-призраки. Речь идет о прозрачных кнопках прямоугольной или квадратной формы, которые также называют «пустыми», «голыми» или «полыми», мы не могли обойти стороной этот материал и сделали адаптивный перевод статьи журнала UX Planet специально для читателей Хабрахабр.

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

image

Обычный внешний вид (слева) и внешний вид при наведении курсора (справа).

image

Обычно размер кнопок-призраков превышает размер традиционных кнопок, а размещают их в самых заметных местах, например, прямо по центру экрана. Стильный эффектный внешний вид, если все сделано правильно, привлекает внимание своим контрастом с остальной страницей, а цветовой акцент при наведении курсора придает дополнительный шарм.
Читать дальше →
Всего голосов 12: ↑8 и ↓4+4
Комментарии26

Построение Android приложений шаг за шагом, часть первая

Время на прочтение8 мин
Количество просмотров146K


В этой статье мы поговорим о проектировании архитектуры и создании мобильного приложения на основе паттерна MVP с использованием RxJava и Retrofit. Тема получилась довольно большой, поэтому подаваться будет отдельными порциями: в первой мы проектируем и создаем приложение, во второй занимаемся DI с помощью Dagger 2 и пишем тесты unit тесты, в третьей дописываем интеграционные и функциональные тесты, а также размышляем о TDD в реалиях Android разработки.
Читать дальше →
Всего голосов 32: ↑27 и ↓5+22
Комментарии48

Best practices от Google по разработке Android приложений

Время на прочтение8 мин
Количество просмотров45K
В данной статье я хотел бы вкратце рассказать про самые последние best practices от Google. Я постарался выделить самые основные моменты, чтобы читатель сразу мог понять, что именно какая-либо фича дает разработчику. Не удивляйтесь, если где-то повторяюсь. Конспектировал + добавлял от себя по ходу просмотров видео в www.youtube.com/channel/UCVHFbqXqoYvEWM1Ddxl0QDg

Также к каждому пункту приводятся все необходимые ссылки для более подробного ознакомления с конкретной best practice.
Читать дальше →
Всего голосов 32: ↑30 и ↓2+28
Комментарии18

N+2 полезные книги для бизнеса, которые обязательно стоит прочитать

Время на прочтение5 мин
Количество просмотров96K
В прошлом году я делал обзор книг, на которых реально растут люди и реально улучшаются процессы.



Тогда понадобился год, чтобы прочитать в десять раз больше бумаги и сделать выборку, которая оказалась неожиданно полезной многим. Вот результаты ещё одного года — ещё N+2 книги для бизнеса, которые реально помогают.

Читать дальше →
Всего голосов 118: ↑106 и ↓12+94
Комментарии43

Лекции Технопарка. 1 семестр. Алгоритмы и структуры данных

Время на прочтение2 мин
Количество просмотров166K
Очередной пост в рамках нашего цикла лекций Технопарка. В этот раз мы предлагаем вашему вниманию курс, посвящённый алгоритмам и структурам данных. Автор курса — Степан Мацкевич, сотрудник компании ABBYY.

Лекция 1. Основы


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


Читать дальше →
Всего голосов 52: ↑48 и ↓4+44
Комментарии14

5 способов сделать ваш сайт легче и быстрее, от David Walsh

Время на прочтение4 мин
Количество просмотров21K
Предлагаю читателям «Хабрахабра» перевод упомянутой в дайджете статьи «5 Ways to Make Your Site Smaller and Faster» из блога Девида Уэлша (David Walsh)

Исповедь: Раз в неделю я говорю, что мне искренне жаль, что я был ребенком, который проводил свой рабочий день подстригая траву и занимаясь озеленением. Почему? Потому что в конце дня, хозяева могли сказать «трава подстрижена, работа завершена». Как веб-разработчики, мы никогда не можем сказать это, или можем? Сайт всегда может быть более эффективным — всегда есть стратегии для уменшения количества байт. Всегда. До тех пор, пока мы это внутренне осознаем, и постоянно повторяем — «сайт не достаточно хорош». Чтобы ежедневно быть великим разработчиком, мы почти обречены чувствовать/ощущать, что наша работа как будто не достаточно хороша — что за негативный способ проживать наши жизни!
Читать дальше →
Всего голосов 13: ↑8 и ↓5+3
Комментарии7

N+1 полезных книг о бизнесе

Время на прочтение9 мин
Количество просмотров230K
В топике блиц-обзор книг, которые будут полезны IT-специалистам, бизнесменам и тем, кто собирается открыть своё дело. Рядом с каждой — короткие пояснения, почему и зачем стоит прочесть.

Отобраны лучшие 10% из примерно 200 прочитанных книг о маркетинге, продажах и всем связанном — самые «пробивные» вещи, которые помогут вам не тратить время на всякий шлак, а сразу начать с главного.

В конце — суммация книг, которые хабровчане рекомендуют в комментариях помимо основного списка.

Читать дальше →
Всего голосов 148: ↑137 и ↓11+126
Комментарии131

300 потрясающих бесплатных сервисов

Время на прочтение11 мин
Количество просмотров1.6M


Автор оригинальной статьи Ali Mese добавил ещё 100 новых бесплатных сервисов. Все 400 потрясающих сервисов доступны здесь. И еще подборку +500 инструментов от 10 марта 2017 г. смотрите здесь.



A. Бесплатные Веб-Сайты + Логотипы + Хостинг + Выставление Счета

  • HTML5 UP: Адаптивные шаблоны HTML5 и CSS3.
  • Bootswatch: Бесплатные темы для Bootstrap.
  • Templated: Коллекция 845 бесплатных шаблонов CSS и HTML5.
  • Wordpress.org | Wordpress.com: Бесплатное создание веб-сайта.
  • Strikingly.com Domain: Конструктор веб-сайтов.
  • Logaster: Онлайн генератор логотипов и элементов фирменного стиля (new).
  • Withoomph: Мгновенное создание логотипов (англ.).
  • Hipster Logo Generator: Генератор хипстерских логотипов.
  • Squarespace Free Logo: Можно скачать бесплатную версию в маленьком разрешении.
  • Invoice to me: Бесплатный генератор счета.
  • Free Invoice Generator: Альтернативный бесплатный генератор счета.
  • Slimvoice: Невероятно простой счет.

Читать дальше →
Всего голосов 341: ↑325 и ↓16+309
Комментарии107

Must-read книги за 2014 год по ИБ и программированию

Время на прочтение7 мин
Количество просмотров110K
Пока вся страна готовится к новому экономическому кризису, судорожно скупая всевозможные товары, продукты и недвижимость, мы предлагаем всем заняться саморазвитием, вложиться в себя. Ведь гречка с макаронами скоро будут съедены, но зато на новые харчи можно будет заработать, вложив время в самообразование. Сами понимаете, в непростые времена выгодно быть универсальным, неприхотливым и не болеющим. О последних двух качествах, возможно, поговорим отдельно, а сейчас обсудим ассортимент наиболее интересной литературы по информационной безопасности и программированию, опубликованной в 2014 году.

Безопасность


Тактика хакера: практическое руководство по тестированию на проникновение (The Hacker Playbook: Practical Guide To Penetration Testing)




Книга написана в стиле планирования футбольной игры. Здесь подробно и пошагово разобраны проблемы и трудности, с которыми сталкиваются специалисты по безопасности, тестируя системы защиты. В частности, рассматриваются атаки на различные типы сетей, обход антивирусов и взлом систем безопасности. Автор книги — Питер Ким, специалист по IT-безопасности с многолетним опытом, CEO компании Secure Planet.
Читать дальше →
Всего голосов 79: ↑60 и ↓19+41
Комментарии17

02 Ссылки для UX-специалистов

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


Читать дальше →
Всего голосов 27: ↑25 и ↓2+23
Комментарии0

Список YouTube-каналов для обучения веб-разработке

Время на прочтение2 мин
Количество просмотров218K
image


Привет, хабражители!

Представляю вам список YouTube-каналов для обучения веб-разработке. Список доступен на гитхабе, там он будет пополняться и редактироваться. В планах — создание отдельной странички для фильтрации каналов по тегам и рубрикам.

Также хочу попросить вас о небольшой услуге: если вы знаете канал, не вошедший в список — опубликуйте ссылку на него в комментариях или отправьте pull request. Сообщество будет благодарно вам.

Под катом — текущая версия списка.
Читать дальше →
Всего голосов 64: ↑59 и ↓5+54
Комментарии16

Алекс Шульц (часть 3): введение в growth hacking

Время на прочтение12 мин
Количество просмотров12K


Cтэнфордский курс CS183B: How to start a startup. Стартовал в 2012 году под руководством Питера Тиля. Осенью 2014 года прошла новая серия лекций ведущих предпринимателей и экспертов Y Combinator:


Первая часть курса
Читать дальше →
Всего голосов 16: ↑15 и ↓1+14
Комментарии0

Интервью с Чальзом Дахиггом: как сила привычки может помочь достичь своих целей

Время на прочтение7 мин
Количество просмотров29K
image

Ранее мы уже знакомили вас с переводами статей Chris Bailey, которые он писал по мере развития своего проекта a Year of Productivity — они доступны в нашем блоге в разделе «личная продуктивность».

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

Сегодня мы хотели бы поделиться одним из таких интервью – Крис беседовал с Чарльзом Дахиггом, автором знаменитой книги «Сила привычки». Чарльз считает, что формирование полезных привычек является одним из главных параметров достижения цели.

Итак, даем слово Крису!

Читать дальше →
Всего голосов 18: ↑16 и ↓2+14
Комментарии2

Выразительный JavaScript: Структуры данных: объекты и массивы

Время на прочтение22 мин
Количество просмотров149K

Содержание




Два раза меня спрашивали: «Скажите, м-р Бэббидж, а если вы введёте в машину неправильные данные, получится ли правильный ответ?». Непостижима та путаница в головах, которая приводит к таким вопросам.

Чарльз Бэббидж, «Отрывки из жизни философа» (1864)


Числа, булевские значения и строки – кирпичики, из которых строятся структуры данных. Но нельзя сделать дом из одного кирпича. Объекты позволяют нам группировать значения (в том числе и другие объекты) вместе – и строить более сложные структуры.

Написание программ, которым мы до сего момента занимались, сильно затруднял тот факт, что они работали только с простыми данными. Эта глава добавит вам в инструментарий понимание структур данных. К её концу вы будете знать достаточно для того, чтобы начать писать полезные программы.

Глава пройдётся по более-менее реалистичному примеру программирования, вводя понятия по мере необходимости. Код примеров будет строиться из функций и переменных, которые мы определяли ранее.
Читать дальше →
Всего голосов 30: ↑29 и ↓1+28
Комментарии12

Бесплатные книги по JavaScript

Время на прочтение2 мин
Количество просмотров66K

Javascript Enlightenment


Cody Lindley


Уровень знаний: средний
Тщательный обзор мировоззрения JavaScript через разбор встроенных объектов и нюансов.

Открыть

Eloquent Javascript


Marijn Haverbeke


Уровень знаний: начинающий
Вводная книга по JavaScript и программирование в целом.
Открыть

Building A JavaScript Framework


Alex Young


Уровень знаний: продвинутый
Избранные статьи из цикла«Let’s Make a Framework».
Открыть

Читать дальше →
Всего голосов 77: ↑73 и ↓4+69
Комментарии15

20 самых популярных выступлений всех времен на конференции TED

Время на прочтение3 мин
Количество просмотров354K
Привет, Хабр. Я знаю, что здесь уважают и любят выступления TED. Поэтому я не мог пройти мимо новости о том, что сайт ted.com после редизайна обновил плейлист «20 самых популярных выступлений на TED всех времен». Это яркий пример того, как путем послабления копирайта (все лекции TED находятся в открытом доступе, распространяются по лицензии CC, согласно которой разрешено все, кроме коммерческого использования) и организации краудсорсинга (все переводы выполняют волонтеры) можно добиться впечатляющих результатов…



Ранее на Хабре уже публиковался этот плейлист, но с тех пор он заметно обновился. Не изменился разве что лидер рейтинга — Кен Робинсон с выступлением «Как школы подавляют творчество».

Рейтинг составлен по количеству просмотров (в статистике учитывались данные с TED.com, Youtube, iTunes, Hulu, встроенных фреймов, количества скачиваний и т.д.)

Большинство лекций переведены на русский язык, с субтитрами или в озвучке. Не буду много писать, это нужно смотреть. Остальное под катом.
Читать дальше →
Всего голосов 117: ↑109 и ↓8+101
Комментарии22

Верстка: переход к семантической разметке — главная цель HTML

Время на прочтение3 мин
Количество просмотров25K
Первоначально технология HTML (hypertex markup language) была предназначена для описания смысловой структуры веб-документа, то есть для определения частей текста, в которых находятся различные по типу и содержанию части страницы как например заголовки, абзацы, сноски, иллюстрации, гиперссылки и так далее. Говоря академическим языком, HTML создан для семантической разметки документа.

Напомню, что семантика — это раздел языкознания изучающий отношения и способы выделения смысловых структур в речи. К примеру определение членов предолжения (подлежащее, сказуемое, дополнение, определение), изучение отношений и заложенного в них смысла (что является субъектом/объектом действия, а что уточняет их описание и т.д.).

До HTML задача семантической разметки документов решалась с помощью:
  • TeX (технологии 1978го года) для макетирования академических публикаций
  • SGML (технологии 1968го года) для более широкого спектра задач. SGML очень похож на своего потомка XML за исключением ряда правил, которые в некоторых случаях заметно усложняют чтение разметки, как например разрешение не ставить угловые скобки в тэгах.

Другими словами, если TeX был адаптирован строго под нужды макетирования университетских докладов, научных работ и тому подобного, SGML позволял создавать структуры информации подобные Реляционным Базам Данных, то есть реализоваывать ER-модели (entity-relationship).
пример ER-модели
(пример ER-модели)
пример ER-отношения
(пример ER-отношений)

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

Тим Бернерс Лии создавая Web в конце 80ых, взяв за основу SGML, упростил синтаксис, создал перечень предопределенных тэгов для макетирования веб-страницы, правила использования которых задал с помощью DTD (технология из семейства SGML которая регламентирует порядок использования тэгов — то есть перечень разрешенных атрибутов, вложенных тэгов, разрешение на текстовый контент и так далее) и мы получили HTML 1.0

Таким образом HTML основанный на SGML первоначально был призван для описания структуры документа в контексте ER-отношений ее частей, то есть определения структуры и содержания документа в терминах сходных к базам данных.

Теперь представьте ситуацию, когда в прикладной программе для того чтоб подвинуть GUI-кнопку на несколько пикселей в какую-либо сторону Вам приходится редактировать структуру базы данных. Парадоксально, но в соверменном вебе это в порядке вещей — очень часто для того чтоб визуально подвинуть какой-либо элемент (GUI-кнопку) приходится изменять HTML-структуру (базу данных)!
Читать дальше →
Всего голосов 18: ↑11 и ↓7+4
Комментарии9

Верстка без float'ов

Время на прочтение2 мин
Количество просмотров8.7K
Существует много разных способов css разметки. Некоторые базируются на абсолютном позиционировании, другие используют float'ы. Первый метод плохо поддерживает «резиновость» макета, тогда как второй это неплохой способ разметки.

Но, как и многие мощные инструменты, float'ы имеют свои изъяны. Для начала, верстка на основе float'ов не такая простая к пониманию, а также float'ы есть источником многих багов (в основном в ИЕ), что делает их не идеальным вариантом в погоне за кроссбраузерностью.

Итак, речь далее пойдет о
семантически корректном методе верстки
Всего голосов 77: ↑61 и ↓16+45
Комментарии174

Информация

В рейтинге
Не участвует
Откуда
Баку, Азербайджан, Азербайджан
Зарегистрирован
Активность