• Качественная вёрстка. Правда или миф!?

    Nekto_Habr
    @Nekto_Habr
    Чат дизайнеров: https://t.me/figma_life
    Т.е. сейчас я констатирую факт, что никакой качественной вёрстки в рунете НЕТ?

    Ура, я не один) Ну ладно, есть примеры качественной вёрстки, но их очень мало. Особенно всё становится мрачным, когда ты - дизайнер (как я).

    Не устаю это повторять: никогда не надо равняться на крупные айти-конторы в плане фронта. Даже у них, как правило, с этим всё плохо.
    Ответ написан
    Комментировать
  • Почему появляется скролл?

    FuriKuri
    @FuriKuri
    5c277dbb6db30295834038.png
    У вас в файле styles322.css стоит overflow-x: scroll у html. Будьте внимательны.
    Ответ написан
    Комментировать
  • Где хранится файл закладок в firefox android ??

    axifive
    @axifive
    Software Engineer
    Вам нужен root или кастомный recovery (TWRP или его модификации).
    Профиль со всеми данными, включая закладки, лежить по такому пути:
    /data/data/org.mozilla.firefox/files/mozilla/<рандомный_id>.default/browser.db

    Это SQLite файл, в нём вы и найдете все ваши сохраненные закладки.

    Как альтернативный вариант, можно поставить аддон стороннего менеджера закладок и синхронизировать или экспортировать через него.
    Ответ написан
    1 комментарий
  • Как не утонуть в океане информации?

    noys
    @noys
    красноглазик
    Мозг и ЖКТ очень похожи по функцианалу.

    Маю Плесецкую как-то спросили "Как вам удается сохранять такую фигуру, у вас особая диета?", на что она ответила: "Диета проста - не жрать".

    "Не съим так понадкусываю" Хохлятская поговорка.

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

    Принципы: диета, раздельное питание, разгрузочный день, рыбный день, выходные.
    Ответ написан
    Комментировать
  • Где найти свой первый заказ?

    @emiandrej
    Первых клиентов можно найти на любом сайте фриланса, главное показать, что ти правда сцец и понимаешь что нужно делать. Можно под заказом сразу дать небольшой совет.
    Ответ написан
    Комментировать
  • Где найти свой первый заказ?

    zamboga
    @zamboga
    Аналитика данных, BI-аналитика, дашборды
    Ловите из моей копилки (сортировка от балды, комментарии мои, я "заказчик")

    • Биржи фриланса СНГ
    https://work-zilla.com — легко очень быстро найти исполнителя на простую работу за 100-3000₽
    kwork.ru
    https://5bucks.ru
    radideneg.ru
    moguza.ru
    https://fl.ru/ (ад.кг) -- один из самых известных фрилансных ресурсов рунета, полно предложений (август 2018)
    https://freelance.ru/ -- сильный конкурент fl.ru, полно предложений (август 2018)
    https://www.weblancer.net/ -- норм, не очень много предложений, но много "целевых", меньше мусора (август 2018)
    https://freelansim.ru/ -- не очень много предложений (август 2018)
    https://YouDo.com -- мало предложений (август 2018)
    https://freelancehunt.com/ -- много предложений (август 2018)
    § Статистика цен https://freelancehunt.com/statistics/rates/currency/rub
    https://www.freelancejob.ru -- очень мало предложений (август 2018)
    https://yukon.to — для даркента и "сомнительных" заданий. Типа "античата"
    www.free-lance.ru -- старое название fl.ru

    • Биржи фриланса международные
    https://www.upwork.com - конкурировать невозможно, только покупать профиль с 1000+ часов, остальное $5-$15 от рабовладельцев
    www.freelancer.com
    https://www.peopleperhour.com/
    https://www.guru.com/
    fiverr.com — для простого дизайна
    https://envato.com/
    https://talent.hubstaff.com
    https://remoteok.io
    https://weworkremotely.com/
    https://www.cybercoders.com/
    https://djinni.co
    https://www.toptal.com
    https://www.linkedin.com
    https://elance.com — куплен upwork
    https://odesk.com — куплен upwork

    • Агрегаторы фриланс-бирж
    https://primelance.com
    https://www.alot.pro
    https://work-at.me/freelance_projects/list
    https://ifreework.org/projects.html
    https://joby.su/search/ff/
    ayak.ru
    https://spylance.com/spy#notices
    j-scan.ru/search_old
    ejobstracker.com
    https://play.google.com/store/apps/details?id=alot...
    https://play.google.com/store/apps/details?id=free...
    https://play.google.com/store/apps/details?id=com....
    https://itunes.apple.com/us/app/mobile-freelance/i...
    https://play.google.com/store/apps/details?id=com....
    Где искать заказы?
    Ответ написан
    12 комментариев
  • Что можете сказать о верстке (новичок)?

    dimovich85
    @dimovich85
    https://u-academy.net/
    Пройдите курсы, не пожалеете. Вот немного бесплатного контента:
    https://m.youtube.com/channel/UCY35dlJe-V5J_IqzU-XksAg
    https://m.youtube.com/channel/UCaTfYudJUVA8cV_But8KZVQ
    https://m.youtube.com/user/dmitrylavr // -> отличные курсы есть на этом канале.
    Такого рода вопросы довольно часто повторяются на Тостере, посмотрите другие ответы на похожие вопросы, там еще больше материалов.
    PS Даже html, поверьте, достаточно глубокий для того чтобы в нем потеряться. А CSS и JS развиваются с такой скоростью, что вряд-ли кто-то скажет, что я знаю всё и ничего учить мне не надо, не слушайте таких людей, они заблуждаются.
    Успехов!
    Ответ написан
    Комментировать
  • Что можете сказать о верстке (новичок)?

    Vlad_IT
    @Vlad_IT Куратор тега Вёрстка
    Front-end разработчик
    1) Не делайте отступы блокам через  , есть же padding/margin
    2) Забудьте о float: left в тех местах, для которых он не предназначен. Для создания сетки используйте flex/css grids
    3) Делайте осмысленные названия классов и идентификаторов у элементов. У вас куча container1, container2 и.т.д.
    4) Не используйте position: absolute, где не нужно явное абсолютное позиционирование (у плавающих блоков например).
    5) Соблюдайте семантику. Заголовки должны быть в h1-h6 тегах.
    6) Не забывайте добавлять атрибут alt для всех картинок img
    7) У вас на сайте везде (вроде везде) используется шрифт "Trebuchet MS", но задаете вы его для элементов каждый раз, хотя можно было задать глобально для body
    8) Блок "ГАЛЕРЕЯ" не по центру.
    9) У вас соц-иконки в футере выровнены очень странно. Иконка insta имеет очень странный отступ от левого края, который видимо предназначается для выравнивания всего блока с иконками. Сделайте контейнер
    .container {
       width: 100%;
       max-width: 1040px;
       padding: 15px;
       margin: 0 auto;
    }

    и в него кладите элементы, которые должны быть внутри сайта. У вас через странный отступ почти все отпозиционировано. Посмотрите чужие работы, как люди делают разметку. Вы пока слабо представляете, как это все происходит.
    10) Вы должны адаптировать не только под маленькие и средние экраны, но и под большие, с шириной 2560px. Не нужно делать под них широкий сайт, просто нужно делать так, чтобы на них сайт тупо не уходил влево, а был по центру.
    11) Куча повторяющегося кода в css
    .footer>.footer_img>.vk{
        margin: 5% 0 0 1%;
    	display: inline-block;
    }
    .footer>.footer_img>.twitter{
        margin: 5% 0 0 1%;
    	display: inline-block;
    }
    .footer>.footer_img>.facebook{
        margin: 5% 0 0 1%;
    	display: inline-block;
    }

    12) Освойте БЭМ (или другую методологию). Код будет чище и проще.
    13) Сайт не адаптивный абсолютно, имеется только один media запрос, и тот только для изменения шрифта у документа. Посмотрите на другие сайты, как они адаптируются.

    Это основное, но список можно продолжать долго. По коду можно судить, что вы учились по старой литературе, выбросите ее. Смотрите как верстают другие, ковыряйте макеты, читайте умные статьи и сайты, тренируйтесь часто, и все будет ок.
    Ответ написан
    3 комментария
  • Как влиться в тренд нынешней веб-разработки?

    Eridani
    @Eridani
    Мимо проходил
    Автор, у меня почти аналогичная ситуация, я этакий ретроград, и писал бы еще в блокноте до сих пор,но...ну да ладно.
    Вся эта новомодная ***, на самом деле, нужна лишь тогда, когда она необходима, когда оно реально оправдывает себя.

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

    Тот же джейд, писанины, на самом деле, получается не меньше, чем руками, а вот запутаться и переучивать себя после стольких лет - другое дело.
    Лесы, Сассы и т.п. - на любителя, мне нравится там только вложенность цсс, остальное как то и не к месту. Тем ни менее, я пока не встречал настоль объемных сайтов, где сие было бы оправдано, как писал руками, так и пишу, и ни чуть не обламывает.

    Я нисколь не говорю, что все это не нужно, я лишь крякнул свое ИМХО, мне вот это все не пригодилось и в принципе переучивать себя после стольких лет не хочется, но это запросто сделается, если того потребует случай/нужда.

    Если есть интерес к разработке, то наверное, лучше будет углубится в тот же JS, PHP, другие веб-языки.

    Что нужно верстаку? Уверенность в своих силах и в оценке проекта, а всё остальное - элементы "упрощайзеры", и нужны ли они Вам - Ваш выбор. Вышеотписавшимся они нужны, мне - нет, и все довольны :)
    Ответ написан
    3 комментария
  • Как влиться в тренд нынешней веб-разработки?

    @SuperOleg39ru
    Front-end разработчик
    Добрый день!

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

    flexbox, grid layout
    - это css из современных стандартов. Что бы знать, когда применять - вы должны знать версии старых браузеров, которые необходимо поддерживать на вашем проекте, и соответствующую поддержку этих стилей. Например, формировать элементы на flexbox на порядок удобнее, чем на float, но в IE9 вы уже использовать flexbox не можете.
    Немного о новинках в css тут.
    Поддержка браузерами тут.

    gulp, webpack и пр.
    - это инструменты, которые созданы для облегчения рутинных задач.
    Для верстки очень удобно использовать gulp - вы описываете задачи, такие как создание локального сервера, мгновенная перезагрузка страницы при изменениях, минификация ваших файлов, и прочее.
    Посмотрите отличный скринкаст от Ильи Кантора!

    препроцессоры
    - представьте, что вам чего-либо не хватает в html и css.
    Например, вы хотите разбивать большие html файлы на множество мелких, или вам нужно вставить в html динамическое содержание - для этого созданы html шаблонизаторы. Вы используете в работе синтаксис конкретного шаблонизатора, затем тот же gulp автоматически собирает эти файлы в обычный html, который понимает браузер.
    Аналогичная ситуация с css, препроцессоры позволяют разбивать файлы на мелкие, и собирать в один, доступны переменные и функции, и многое другое.
    Популярный шаблонизатор Pug
    Один из css-препроцессоров Stylus

    пакетные менеджеры
    - это удобный способ скачать конкретные библиотеки, и переносить их из проекта в проект. Статья про npm тут

    Ну и конечно статьи и подкасты:
    https://habrahabr.ru/
    jsraccoon.ru

    https://soundcloud.com/web-standards
    https://radiojs.ru/

    Конкретные статьи и ресурсы для новичка:

    frontender.info/a-baseline-for-front-end-developers
    frontender.info/a-guide-to-flexbox
    css-live.ru/articles-css/pravilnye-kontrolnye-toch...
    https://medium.com/russian/%D0%BE%D1%82-%D0%BD%D1%...
    https://medium.com/russian/%D0%BE%D1%82-%D0%BD%D1%...
    https://habrahabr.ru/company/zfort/blog/321214/
    https://frontendmasters.gitbooks.io/front-end-hand...

    Дерзайте!
    Ответ написан
    6 комментариев
  • Можно ли на js сделать динамическое добавление html?

    @rPman
    Если у вас веб-сервер отдает только статику (обычное дело для бесплатных/дешевых хостингов, да и сама статика очень эффективна и не нагружает сервер) то это нормальная практика собирать страницу на стороне клиента.

    include это частный случай шаблонизатора. Сами шаблонизаторы очень простые, фактически можно без каких либо библиотек просто использовать $('#replace_element_id').innerHTML='html text string' а саму html брать тут же из документа, разместив его например в скрытых div или как рекомендуют <script type="text/html">....</script> (будьте осторожны со скриптами внутри и валидностью верстки)

    Эта стратегия называется single page app когда абсолютно все необходимое размещено в одной странице, статике, которая загружается однократно и кешируется на клиентской стороне. Страницы веб приложения и их параметры разделяются с помощью anchor (index.html#page/arguments/etc), в этом случае будет корректна работать история браузера, разбираются они javascript простым анализом url. Никаких библиотек для этого не требуется, это стандартная фича в любом браузере.

    Если же вам нужны нестатичные данные, они загружаются с вашего веб-сервера в виде json файлов (такие файлы легко разобрать в javascript с помощью JSON.parse(text) с помощью ajax (или XMLHttpRequest если вы не хотите подключать библиотеки)
    Ответ написан
    Комментировать
  • Можно ли на js сделать динамическое добавление html?

    webirus
    @webirus
    Тыжверстальщик! Наверстай мне упущенное...
    Про pug-include уже ответили, это правильное решение.

    Поскольку хочется без сервера, есть парочка мыслей.

    В качестве эксперимента и для себя, попробуй "сварить" вот это)
    al-scvorets.github.io/wm-html-include.js
    Я помню, меня сильно затянуло, когда первый сайт сделал так, для себя)

    (выделил, как наиболее интересное решение)

    А также есть старенькая технология SSI htmlbook.ru/webserver/ssi
    В принципе, тоже само по себе рабочее.

    Нагуглил еще одно решение HTML Import, если честно не пробовал.
    https://www.html5rocks.com/en/tutorials/webcompone...
    Но судя по описанию, с вашей задачей справится.
    Ответ написан
    1 комментарий
  • Можно ли на js сделать динамическое добавление html?

    @curious-101
    Frontend developer
    pug конкретно фича которая вам нужна https://pugjs.org/language/includes.html
    Ответ написан
    Комментировать
  • Я из 2008, за что браться?

    xandri
    @xandri
    Люблю айтшечку
    По поводу IE сейчас стандарт 9+
    По поводу детального изучения стоит не забывать что "Идеальное - враг Хорошего".
    Если вы выбрали php то верстать вам особо не прийдётся и вам нужно учить язык.
    Пройдите курс Sorax CSS , для освежения знаний и усвоения некоторых новых моментов.
    В первую очередь не забывайте, вы хотите быть программистом поэтому вы должны уметь писать код.
    Если вам нравилось детально изучать Css то возможно стоит посмотреть в сторону Front-End.
    Javascript сейчас на вершине популярности и благодаря огромному комьюнити и фреймворкам уже сейчас можно писать Мобильные приложения/Игры/Десктоп приложения и тд.
    Опять же вам нравилось разбираться со стандартами и прочим и я думаю что это тоже положительный звонок для перехода на темную сторону Front-end.
    Php Версии 7+ это уже очень хороший и быстрый язык в сравнении со старыми версиями и ближайшие лет 15 он никуда не денется так как 78% всего интернета это php.

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

    Вот полезные ресурс для одноглазых моряков тыц
    Ответ написан
    3 комментария
  • Я из 2008, за что браться?

    Vlad_IT
    @Vlad_IT
    Front-end разработчик
    С таким перфекционизмом лучше идти в низкоуровневое программирование, в вебе вы будете делать задачи дольше времени, чем те, кто ее боится использовать инструменты.
    За 10 лет у вас в голове ничего не осталось , а если и осталось, то уже сильно устаревшее. Поэтому для вас тот же путь, что и для всех новичков.
    Еще нужно понимать, что веб тогда был проще чем сейчас. Тогда можно было легко быть фуллстеком, сейчас нет.
    И сейчас конкуренция сильнее, поэтому нужно уметь выделяться, не только качеством, но и скоростью (поэтому перфекционизм будет помехой).
    Статистику браузеров не надо изучать, заходите на caniuse, и смотрите, что можно юзать. Для js используйте babel.
    Ответ написан
    2 комментария
  • Я из 2008, за что браться?

    sim3x
    @sim3x
    Так а в чем проблема?
    Ну кроме того что ваши знания про хаки больше никому не требуются

    Сейчас все просто (как и во времена монополии ие5-6)
    Сейчас есть только chromium-based браузеры
    уточнение
    70+% используют движ хромиума для рендера. Рендер Blink/WebKit не сильно отличается от всех остальных


    Сейчас есть caniuse и я не понимаю о каком изучении статистики вы говорите

    Сотни ресурсов, где даже те кто слабо умеют читать, могут научиться всему
    Ответ написан