Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы и интересные материалы из области фронтенда.
Рубрика «html» - 60
Дайджест свежих материалов из мира фронтенда за последнюю неделю №252 (27 — 5 марта 2017)
2017-03-05 в 20:12, admin, рубрики: angular, css, ES6, html, html5, javascript, JS, React, vue, Блог компании Zfort Group, браузеры, дайджест, Разработка веб-сайтов, ссылки, фронтендСоздание картинок на CSS делает верстальщика лучше, или Чем себя занять долгими зимними вечерами
2017-03-02 в 13:30, admin, рубрики: css, html, ненормальное программирование, Разработка веб-сайтов, рисование на css, метки: рисование на css
Те, кто интересуется версткой, frontend разработкой и веб-дизайном, вероятно заметили, что в последние несколько месяцев в сети все чаще стали появляться анимированные картинки, сделанные с помощью HTML и CSS. В этой статье я постараюсь рассказать откуда это веяние появилось, в чем фишка и почему это стало так популярно среди верстальщиков (а возможно кто-то еще не слышал, может быть интересно познакомиться с таким видом деятельности).
Дайджест свежих материалов из мира фронтенда за последнюю неделю №251 (20 — 26 февраля 2017)
2017-02-26 в 20:36, admin, рубрики: angular, css, ES6, html, html5, javascript, JS, React, vue, Блог компании Zfort Group, браузеры, дайджест, Разработка веб-сайтов, ссылки, фронтендПредлагаем вашему вниманию подборку с ссылками на полезные ресурсы и интересные материалы из области фронтенда.
Emoji.prototype.length — рассказ об эмоциональных символах в Юникоде
2017-02-22 в 20:20, admin, рубрики: html, javascript, javascript html emoji, метки: javascript html emojiХабр довольно враждебно настроен к Эмодзи (здесь они просто не отображаются), считая их чем-то вроде «падонкаффского» языка. Не для серьёзных людей. Ведь и то и другое появилось примерно в одно время. И если «олбанский» йезыг быстро ушёл в небытие, то Эмодзи эволюционировали от простых точек с запятой и скобочек до полноправных символов в кодировке Юникод. Автор данной статьи предлагает посмотреть, что у этих маленьких сущьностей «под капотом» (Здесь и далее курсивом — примечания переводчика).
Оригинальная статья написана для сайта Contentful Стефаном Джудисом (Twitter, GitHub).
Эмодзи – это основа текстового общения наших дней. Без этих маленьких символов, много бесед в чатах сегодня занчивались бы неловким молчанием или недопониманием. Я всё ещё помню старые добрые времена, когда СМС-ки были крутой штукой.
Предложение пообщаться в чате без смайликов скорее всего приведёт к сообщению «Ты что шутишь?». Все быстро поняли, что юмор и сарказм (кстати, нам бы не помешало быть менее саркастичными) не просто передать, используя лишь письменные знаки. В какой-то момент возник первый Эмодзи, и они быстро стали одним из фундаментальных компонентов любой беседы в текстовом формате.
Хоть я и использую Эмодзи каждый день, я никогда не задавался вопросом, как же они работают. Очевидно, что они каким-то образом связаны с Юникодом, но я и понятия не имел, что там творится под капотом. И мне, честно говоря, было всё равно.
Всё поменялось, когда я набрёл на твит Веса Боса (Wes Bos), в котором он показал несколько JavaScript-операций над строкой, содержащей семью Эмодзи.
Как разработать кросс-платформенное приложение с помощью одной лишь разметки JSON
2017-02-20 в 11:49, admin, рубрики: html, json, Блог компании Everyday Tools, кросс-платформенность, кроссплатформенная разработка, кроссплатформенность, разработка мобильных приложений, разработка приложенийПоследние несколько месяцев я работаю над новым способом создания кросс-платформенных приложений для Android и iOS под названием Jasonette. Он позволяет написать приложение от начала до конца, используя только разметку JSON.
Если ваше приложение целиком написано через разметку JSON, с ним можно обращаться, как с любыми другими данными, а также удаленно обслуживать его по требованию из облака.
Больше нет необходимости в том, чтобы приложение было захардкорено на девайсе, Вы можете обновлять его по желанию посредством обновления разметки JSON на серверной стороне. При каждом запуске ваше приложение будет заново загружаться с сервера.
Читать полностью »
Дайджест свежих материалов из мира фронтенда за последнюю неделю №250 (13 — 19 февраля 2017)
2017-02-19 в 20:35, admin, рубрики: angular, css, ES6, html, html5, javascript, JS, React, vue, Блог компании Zfort Group, браузеры, дайджест, Разработка веб-сайтов, ссылки, фронтендПредлагаем вашему вниманию подборку с ссылками на полезные ресурсы и интересные материалы из области фронтенда.
$mol_app_bench: готовим JS бенчмарки быстро и просто
2017-02-19 в 15:28, admin, рубрики: $mol, $mol_app_bench, html, javascript, TypeScript, высокая производительностьЗдравствуйте, меня зовут Дмитрий Карловский и я… тот ещё гурман. Мне нравится готовить изысканные блюда, которые элегантно и просто решают привычные уже набившие оскомину проблемы. Можно долго рассказывать о преимуществах тех или иных подходов, удешевлении поддержки, ускорении разработки, упрощения отладки, но всё это остаётся достаточно субъективными оценками, над которыми нужно размышлять. Поэтому рано или поздно (но как правило преждевременно), всё обсуждение скатывается к более-менее измеримым величинам — скорости работы, скорости загрузки и прочим скоростям. И мало того, что нужно сделать несколько реализаций на разных технологиях, чтобы было что сравнивать, так ещё и не плохо было бы нарисовать интерфейс с понятной человеку выдачей результатов. А всё это — время, которого всегда не хватает, особенно, если делать хорошо.
Чтобы упростить разработку бенчмарков мы выделили общую их часть в отдельное приложение, которое рисует весь интерфейс от выбора тестируемых вариантов до наглядного представления результатов, а вариативная часть подключается извне и реализует довольно простой интерфейс. Всё "накликанное" состояние сохраняется в ссылке, так что им легко поделиться с другими гурманами. Кроме того, поддерживается локализация и сортировка результатов по разным критериям — настоящий пир для всех любителей быстрой еды.
Далее вы узнаете:
- Как замутить свой бенчмарк, практически не прилагая усилий.
- Как запилить что-то по сложнее, с загрузкой целых приложений в отдельных фреймах.
- Как устроен $mol_app_bench изнутри.
- Как теперь жить-то со всем этим.Читать полностью »
Знакомство с Styled components
2017-02-14 в 10:38, admin, рубрики: css, github, html, javascript, styled components, библиотека, Блог компании Everyday Tools, версткаПредлагаем вашему вниманию перевод свежей ознакомительной статьи Cаши Грифа (Sacha Greif), соавтора книги «Discover Meteor», о специфике работы с библиотекой Styled components.
«СSS – странная штука. Его основам можно обучиться за 15 минут, но на то, чтобы найти хороший способ организации стилей, могут уйти годы.
Отчасти это объясняется особенностями самого языка. В своем исходном виде CSS довольно ограничен — никаких переменных, циклов или функций. В то же время, он развязывает вам руки, обеспечивая возможность задавать стиль элементам, классам, ID или любым их комбинациям.
Читать полностью »
Как прокрастинировать эффективно: 6 полезных онлайн-сервисов
2017-02-13 в 14:41, admin, рубрики: css, gtd, html, кино с субтитрами, обучение, повышение скорости печати, прокрастинация, Скорочтение, тренировка мозга
Прокрастинация — явление, жертвой которого становятся все, даже животные не могут ему противостоять. Несколько лет назад проблему ярко описал Тим Урбан на страницах своего блога Wait But Why. И раз уж прокрастинация неизбежна, стоит постараться извлечь пользу и из неё — я составил подборку из шести онлайн-сервисов (и их альтернатив), которые помогут научиться чему-то новому, даже когда работать нет никаких сил.Читать полностью »
Новая сетка на inline-block: описание, пример использования, плюсы и минусы
2017-02-13 в 13:58, admin, рубрики: css, html, сетка для верстки на inline-block, сетка на inline-block, метки: сетка для верстки на inline-block, сетка на inline-blockДля современной верстки использование сетки не новость. Практически все html-фреймвоки используют ту или иную сетку. Я встречала 3 вида сетки:
- сетка на float;
- сетка на inline-block;
- сетка на flexbox.
Сетка на inline-block имеет свои особенности, плюсы и минусы, которые следует рассмотреть.
Читать полностью »