Задать вопрос
  • Ошибки 499 в одном браузере, как найти что вызывает?

    блокировщик рекламы вызывает
    Ответ написан
    Комментировать
  • Ошибки 499 в одном браузере, как найти что вызывает?

    @Lord_Dantes
    Сверху справа расширение которое вырубает рекламу и черпает ваш js код :)
    Ответ написан
    Комментировать
  • Как сделать интерактивную карту?

    @grinat
    Ответ написан
    Комментировать
  • Как сделать интерактивную карту?

    SmthTo
    @SmthTo Куратор тега CSS
    Все перепёлки мира будут оплакивать мою смерть.
    SVG и только SVG.

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

    Кроме того, блоки на HTML не могут иметь произвольную форму, а только прямоугольную (clip-path не в счёт, с ним ещё сложнее будет реализовать), что вызовет проблемы при совмещении нескольких объектов произвольной формы вместе. Точнее, будет проблема с зоной взаимодействия этих объектов при наведении мышки из-за наложения прямоугольников.

    Все такие интерактивные карты делают с помощью SVG, что как бы намекает.

    https://medium.com/@mattcroak718/creating-an-inter...

    Я делал такую карту с помощью Boxy SVG:
    https://boxy-svg.com

    Можно делать в Inkscape, там тоже есть режим просмотр кода разметки.
    Ответ написан
    Комментировать
  • Какие есть курсы для обучения, платный treehouse или альтернативы?

    @maxtrelle
    1. MIT Open Courseware

    MIT’s Open Courseware предлагает 2100 курсов разнообразной тематики, в том числе Electrical Engineering и Computer Science. Бесплатные ресурсы включают онлайн-учебники, экзамены, мультимедийный контент, задания, проекты и примеры — все из фактических курсов MIT последнего десятилетия или около того.

    2. Coursera

    Coursera запущена в апреле и уже преодолела отметку в 1 миллион студентов. Сейчас включает более 200 курсов из 33 университетов. Если вы еще не слышали о Coursera – это стартап в сфере онлайн-образования, основанный профессорами Стенфордского университета, который позволяет пройти полный интерактивный курс университета, который преподается настоящим профессором в одной из лучших школ мира. Бесплатно.

    3. Udacity

    Udacity – бесплатный сервис, в настоящее включает 14 классов, где «Вы обучаетесь, решая сложные проблемы… со всемирно известными преподавателями университетов». Курсы охватывают темы, которые не только учат вас писать код, но и дают хорошие познания в математике, физике и даже в том «Как построить стартап».

    4. Google Code University

    Это Google и это код – достаточно солидный бесплатный ресурс и, очевидно, хороший вариант, если вы заинтересованы в разработке под Андроид. Также специализируется на некоторых продвинутых темах, например, распределенных системах и веб-безопасности.

    5. Mozilla Developer Network

    Mozilla собрала большую коллекцию ресурсов для обучения веб-технологиям.

    6. HTML5 Rocks

    Ресурс включает много бесплатной информации о HTML5, включая статьи и руководства.

    7. The Code Player

    The Code Player – ресурс с пошаговыми видео-руководствами, которые показывают как крутые вещи создаются с нуля. Это возможность смотреть из-за плеча программиста когда он работает. Проект обучает HTML5, CSS3, Javascript и др. Находится в состоянии альфа.

    8. Codecademy

    Codecademy – популярный бесплатный сайт, который вносит игровую составляющую в процесс обучения, если вы обучаетесь вместе с друзьями. Ориентирован на веб-технологии. Codecademy также запустил проект CodeYear.
    Говорят, что ресурс приобрел большую популярность после твита мэра Нью-Йорка в начале это года, где он сообщил, что собирается использовать это сайт для обучения программированию в 2012 году.

    9. Khan Academy

    Khan Academy предлагает множество курсов, которые охватывают не только программирование, но и другие темы. Например, математику (много курсов разных направлений), науку, финансы и экономику, и др.

    10. General Assembly

    General Assembly использует другой подход, предлагая платные livestream-сессии на темы вроде «Быстрое прототипирование: от Каркаса до HTML» – вы покупаете электронный билет, получаете пароль и подключаетесь livestream-у, когда он проходит.

    11. PeepCode

    PeepCode охватывает множество языков программирования, предоставляя загружаемые (платные) скринкасты уроков.

    12. Eloquent JavaScript

    Eloquent JavaScript, на самом деле, – книга, которая предоставляет введение в JavaScript и программирование в целом. Книга существует в 2 форматах. Она опубликована в электронном виде, который включает интерактивные примеры и механизм для взаимодействия с примерами кода (можно запустить код или открыть его в консоли разработчика). Также книгу можно купить в бумажном виде на Амазоне. Есть перевод на французский (бумажная версия) и немецкий (электронная).

    13. Ruby Koans

    The Koans проведет вас по долгому пути к просвещению в изучении Ruby (не Ruby-on-Rails). Целью является изучить язык Ruby, синтаксис, структуры и некоторые распространенные функции и библиотеки.

    14. Learn Code The Hard Way

    Learn Code The Hard Way стартовал как проект для обучения Python в виде онлайн книги-учебника, но вскоре были добавлены материалы для изучения Ruby, C, SQL, Regex.

    15. Stack Overflow

    Хоть он технически и не содержит «туториалов», но имеет тонны (легко искомой) информации, которая может здорово помочь. Также, если вы на чем-то застряли (и на ресурсе еще нету ответа), сообщество очень хорошо отвечает на вопросы.

    16. Coder Dojo

    Coder Dojos – площадки, где молодые люди собираются вместе учиться программировать. Dojos организовываются добровольцами. Если вы преподаватель или просто хотите поделиться знаниями, вам стоит присмотреться к этому ресурсу.

    17. O’Reilly

    Кроме множества-множества книг, публикуемых O’Reilly, компания также предлагает (платные) онлайн-курсы для разных языков программирования.

    18. Scratch

    Опять же, если вы хотите помочь кому-то в обучении, Scratch – бесплатное ПО, разработанное MIT Media Lab, которое поможет вам в этом.

    19. Apple Developer

    Ресурс для заинтересованных в разработке ПО для продуктов Apple.

    20. Android Developer

    Сайт Google для андроид-разработчиков продолжает улучшаться и содержит множество разделов с рекомендациями для разработчиков и дизайнеров. Также доступно видео с Google I/O.

    21. Mobiletuts+

    Mobiletuts+ – ресурс со статьями и руководствами для разработчиков мобильных приложений. Охватывает разработку нативных приложений c использованием iOS SDK, Android SDK/NDK и Windows Phone 7 SDK, кросс-платформенную разработку при помощи таких инструментов как Titanium Mobile и PhoneGap, техники для построения веб-сайтов, доступных с мобильных устройств, и веб-приложений на HTML 5, CSS, JavaScript.
    Имеет площадку для онлайн-обучения разработчиков и дизайнеров (платно).

    22. Udemy

    Udemy предлагает курсы (некоторые бесплатные, некоторые платные) по самым разнообразным темам. Среди инструкторов – Марк Цукерберг и Марисса Майер.

    23. Code School

    Code School предлагает курсы по веб-технологиям с видео-уроками, заданиями запрограммировать решение какой-то задачи и скринкастами. Большинство курсов платные, есть несколько бесплатных.

    24. Bloc

    Bloc обещает сделать из вас «веб-разработчика за 12 недель». За солидное вознаграждение Bloc назначит ментора, который будет обучать вас на протяжении отведенного времени. (Стоимость – $5000 за 12 недель).

    25. Treehouse

    Treehouse насчитывает свыше 600 видео-уроков (по веб-дизайну, веб-разработке и разработке под IOS), которые можно просматривать за ежемесячную плату. Также есть премиум подписки, которые предлагают больше возможностей.

    26. Programr

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

    27. Processing

    Processing – язык программирования с открытым исходным кодом и среда разработки, созданные, чтобы научить (людей, которые никогда не программировали) базовым навыкам программирования, используя визуальный фидбек.

    Язык основан на Java, но использует упрощенный синтаксис и графическую программную модель.

    Используется для программирования графики. Очень быстро превратился в инструмент для создания профессиональных работ. Тут можно посмотреть видео работ, которые были созданы с помощью Processing.

    28. Pluralsight

    Pluralsight имеет богатую библиотеку онлайн курсов для .NET разработчиков. Также есть курсы для множества других языков и технологий (всего около 360 курсов). Доступ осуществляется за платной ежемесячной подпиской. Имеется бесплатный триал на 10 дней (правда, до 200 минут видео и с другими ограничениями).

    29. LearnStreet

    LearnStret – ресурс для изучения Javascript, Python, Ruby. Курсы интерактивные – изучение проходит в виде написания кода и немедленного получения результата. Имеются теория, упражнения, подсказки и видео.

    30. codenamecrud.ru
    Ответ написан
    Комментировать
  • Какие у вас любимые плагины слайдеров?

    In4in
    @In4in
    °•× JavaScript Developer ^_^ ו°
    kenwheeler.github.io/slick

    Цитируя самих его создателей:


    Fully responsive. Scales with its container.
    Separate settings per breakpoint
    Uses CSS3 when available. Fully functional when not.
    Swipe enabled. Or disabled, if you prefer.
    Desktop mouse dragging
    Infinite looping.
    Fully accessible with arrow key navigation
    Add, remove, filter & unfilter slides
    Autoplay, dots, arrows, callbacks, etc...


    Особенно он мне нравится именно за настройку адаптивности.
    Ответ написан
    Комментировать
  • Какие у вас любимые плагины слайдеров?

    wielski
    @wielski
    ✔ Совет: Вам помогли? Отметьте ответы решением.
    wd.dizaina.net/scripts/peppermint

    IE7+, кроссбраузерность, расширяемость.
    Ответ написан
    Комментировать
  • Какие есть обучающие ресурсы по фронтенд разработке?

    edward04
    @edward04
    Начинающий ninja frontend
    https://www.youtube.com/channel/UC7enHM_oJRYJOnyJr...
    https://www.youtube.com/channel/UCZeU17nbVfzczAkJV...
    https://www.youtube.com/channel/UCHHw70vvbfyM6xJQo...
    https://www.youtube.com/channel/UCIIt69f5D44s2cdb9...
    tohtml.it/post/74511047203/markup-process

    По нему скучаю искренне и иногда сижу на подоконнику с лате и смотрю на капли дождя, стекающие по стеклу:
    https://www.youtube.com/channel/UCdnFX7mzgup9moXG2...
    Это для общего развития:

    https://stepic.org/course/%D0%90%D0%BD%D0%B0%D0%BB...

    Похожий вопрос:
    Какие задачи нужно уметь выполнять на JS начинающему?

    Ваша библия:
    https://developer.mozilla.org
    Можно докинуть еще:
    webref.ru
    htmlbook.ru
    Просто случайная ссыль
    https://docs.google.com/document/d/1kehaJKKRo7zxYp...
    Еще одна:
    https://github.com/ihorzenich/html5checklist
    Еще какая то штука
    https://github.com/dypsilon/frontend-dev-bookmarks
    Лучшие практики тостеровцев
    Как вы начинаете вёрстку сайта?
    Инструменты
    fredsarmento.me/frontend-tools

    После пары часов выпускания пара из ушей, включить на всю громкость и хоть как то отвлечься от этой жизни
    https://www.youtube.com/channel/UCY0C6A3t3RTUN3BB6...

    На freecodecamp.com неплохо алгоритмы можно потренить

    Ну и конечно
    learn.javascript.ru

    PS
    еще это
    Какие ресурсы с новостями по web-разработки вы знаете?

    PSPS
    Не отвечаю за качество контента под ссылками, может кое что уже outdated.

    https://vk.com/video79753760_171233585

    Удачи, брат
    Ответ написан
    4 комментария
  • Какие ресурсы с новостями по web-разработки вы знаете?

    edward04
    @edward04
    Начинающий ninja frontend
    smashingmagazing.com
    html5rocks.com
    сайт mdn
    блоги типа Пола Айриша и других ниндзя
    code.tutsplus.com/articles/33-developers-you-must-...

    dmitry.baranovskiy.com

    https://www.digitalocean.com/company/blog/20-devel...

    addyosmani.com/blog

    https://github.com/mr-mig/ru-it-chats

    css-live.ru

    www.webmonkey.com
    frontendfront.com

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

    Извините за бомб пукан, просто реально тостер превращается во что-то вроде : какая буква идет после г в алфавите.

    берете и гуглите, нет на русском - пишите по английски, не знаете буржуйский- есть гугл транслэйт.

    PS Извиняюсь за ошибки -писал в порыве гнева.
    Ответ написан
    16 комментариев
  • Как правильно верстать такие сайты?

    @test13r
    В данном случае использовались изображение формата jpg, размером 2640 x 1440 и весом 1.53 МБ, которое воспринимается как фон, но по факту фоном не является :)
    Поверх него векторный слой svg с размечеными областями (в качестве редактора можно юзать Inkscape). Собственно вся магия реализована при помощи JS баблиотеки Raphaël.
    Комплект на проверку оказывается не сложный: файлы изображения и svg от дизайнера, остальная работа за фронтенд девелопером.
    Ответ написан
    Комментировать
  • Как новичку найти клиентов на upwork и на что рассчитывать?

    Punkie
    @Punkie
    Почитайте блог: jff.name . В своё время он мне очень помог. И автор у него отзывчивый - всегда подскажет.
    Ответ написан
    1 комментарий
  • Адаптивная вёрстка - как побороть боль?

    @c030f5da
    Не хочу быть КЭПом, но все проблемы в вёрстке начинаются с дизайна. Адаптивная вёрстка может быть только у адаптивного дизайна, иначе это уже три макета, а не адаптивность. При хорошем подходе к дизайну, верстать по сути приходится только мобильную версию - остальные разворачиваются из оной чутьли не автоматически.
    Ответ написан
    7 комментариев
  • Где посмотреть примеры качественного кода вёрстки сайтов, лендингов, веб-приложений?

    paulradzkov
    @paulradzkov
    Дизайнер, верстальщик, начальник отдела UI
    Первый путь.
    На Гитхабе поискать по ключевым словам (BEM, SMACSS, OOPCSS) — найдутся бойлерплейты и стартеркиты, которые по определению должны быть хорошего качества.

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

    Второй путь.
    Искать в Гугле людей, которые пишут про BEM, SMACSS, OOPCSS и прочих крутых фронтендеров. Искать их профили на гитхабе, изучать их проекты. Если они пишут про методологии, то они явно их используют в работе.
    Ответ написан
    Комментировать
  • Работа без высшего образования, это реально?

    @FoxInSox
    Почему вы все так спешите начать работать? Да еще и вместо обучения (каким бы оно ни было).

    - У вас еще впереди лет 30-40 работы, большую часть жизни вам придется работать. Вероятность того, что вы все эти 30 лет будете работать в удовольствие далеко не 100%.
    - Начиная работать на 2-3 года раньше вам не дает сильных преимуществ в перспективе. В практически любой работе гораздо более важна эффективность, а не просто сколько времени вы проработали на определенной должности. Т.е. проработав, например, 5 лет, всегда найдутся люди с меньшим опытом которую делают вашу работу эффективнее (быстрее, качественнее)
    - годы обучения в ВУЗе для очень многих людей являются самыми счастливыми, а во многих случаях даже формируют фундамент всей оставшейся жизни: друзья, хобби, знакомства, связи, какие-то ключевые события. Сидя 8 часов в офисе в день на работе или в квартире на фрилансе вы все это упустите скорей всего.
    - во время учебы у вас есть масса времени попробовать поработать в разных местах и сферах: backend, frontend, мобильная разработка, дизайн, попробовать заняться научной деятельностью, попробовать что либо вообще не связанное с IT. После нескольких лет работы вы только будете мечтать о таком, но времени и возможности сменить радикально сферу работы вы не сможете просто.

    ps ну нахрена вам деньги в 17 лет? Машину купить? Бабу свою свозить в Европу? iMac за 100 тысяч купить? Это все вещи которые не стоят вашего времени как минимум 17 лет точно.
    Ответ написан
    6 комментариев
  • Как верстать блоки непрямоугольной формы?

    Petroveg
    @Petroveg
    Миром правят маленькие с#@&ки
    linear-gradient() с наклоном (прямо в самом элементе) — IE 9+
    border у псевдоэлементов — IE 7+
    transform:skew() (также лучше у псевдоэлементов) — IE 9+
    transform:skew() (у самого элемента, а внутренний элемент скосить в обратную сторону) — IE 9+
    SVG (можно фоном, можно напрямую) — IE 9+

    Update: по подсказке lioklio
    transform:rotate() (у псевдоэлементов с увеличенной шириной и обрезкой в одном из предков) — IE 9+
    Ответ написан
    6 комментариев