WebNewbe

User
  • Content count

    65
  • Joined

  • Last visited

  • Days Won

    2

WebNewbe last won the day on March 31 2018

WebNewbe had the most liked content!

Community Reputation

4 Обычная

1 Follower

About WebNewbe

  • Rank
    Участник

Information

  • Sex
    мужской

Recent Profile Visitors

722 profile views
  1. Здравствуйте. Я занимаюсь версткой сайтов: лендингов, интернет-магазинов, флаеров и тп. Ищу работу, для набора опыта и заработка первых денег на данной позиции. Мое портфолио: https://alex2033.github.io/sites/BlackDone/index.html https://alex2033.github.io/sites/Sandeo/index.html https://alex2033.github.io/sites/Barbershop/index.html https://alex2033.github.io/sites/Skylith/index.html https://alex2033.github.io/sites/Unicorn/index.html https://alex2033.github.io/sites/Bouncy/index.html Остальные работы вы можете посмотреть здесь: https://alex2033.github.io/ Навыки: - Знание HTML5, CSS3 - Опыт адаптивной, семантической, кроссбраузерной верстки - CSS3 анимация - знания Javascript на уровне jQuery - Использование препроцессоров LESS/SASS/Stylus + Pug - Опыт работы в Adobe Photoshop, Illustrator, Zeplin, Avocode - Именование классов по методологии БЭМ-нейминг - Gulp, npm, bower - Умение работать с сетками (bootstrap 3+, foundation, flexboxgrid) - Умение работать с фреймворками bootstrap 3, 4, foundation - Знание английского на уровне чтения документации - Навык работы с векторной графикой SVG - Умение использовать flexbox, css-grid там где это необходимо Форма связи: Email - XoxlofAlexandr@yandex.ru - преимущественно Skype - Xronaliz Также можете написать на этом сайте Благодарю за внимание и хорошего дня:)
  2. Здравствуйте. Я занимаюсь версткой сайтов: лендингов, интернет-магазинов, флаеров и тп. Ищу работу, для набора опыта и заработка первых денег на данной позиции. Мое портфолио: https://alex2033.github.io/sites/BlackDone/index.html https://alex2033.github.io/sites/Sandeo/index.html https://alex2033.github.io/sites/Barbershop/index.html https://alex2033.github.io/sites/Skylith/index.html https://alex2033.github.io/sites/Unicorn/index.html https://alex2033.github.io/sites/Bouncy/index.html Остальные работы вы можете посмотреть здесь: https://alex2033.github.io/ Навыки: - Знание HTML5, CSS3 - Опыт адаптивной, семантической, кроссбраузерной верстки - CSS3 анимация - знания Javascript на уровне jQuery - Использование препроцессоров LESS/SASS/Stylus + Pug - Опыт работы в Adobe Photoshop, Illustrator, Zeplin, Avocode - Именование классов по методологии БЭМ-нейминг - Gulp, npm, bower - Умение работать с сетками (bootstrap 3+, foundation, flexboxgrid) - Умение работать с фреймворками bootstrap 3, 4, foundation - Знание английского на уровне чтения документации - Навык работы с векторной графикой SVG - Умение использовать flexbox, css-grid там где это необходимо Форма связи: Email - XoxlofAlexandr@yandex.ru - преимущественно Skype - Xronaliz Также можете написать на этом сайте Благодарю за внимание и хорошего дня:)
  3. Не знаю насчет градиента, я делал так: данный прогресс бар делал блоком закрашивал соответственно в серый цвет, и накладывал псевдэлемент ::before, который по высоте равняется данному прогресс бару, а ширина уже от задачи, если у вас 75%, просто прописываете width: 75% ну и соответственный цвет, вот и все, по-моему довольно легки вариант) https://codepen.io/anon/pen/yjvwMR
  4. На всю жизнь хватит https://cssauthor.com/templates/ https://psdfreebies.com/psd/category/web-elements/web-templates/ https://psdrepo.com/tag/free-psd-website-templates/ http://www.pcklab.com/templates https://freebiesbug.com/psd-freebies/website-template/ http://www.os-templates.com/free-psd-templates https://colorlib.com/wp/free-psd-website-templates/ https://speckyboy.com/free-photoshop-psd-web-design-template/ https://dcrazed.com/free-photoshop-psd-website-templates/ https://dcrazed.com/best-free-blogger-templates/ https://cssauthor.com/corporate-business-web-templates/ https://freshdesignweb.com/free-travel-website-templates/ https://inscribemag.com/free-psd-website-templates/ https://www.freepik.com/ http://blazrobar.com/tag/free-psds/ http://devfloat.net/business-corporate-bootstrap-templates/ https://freedesignresources.net/category/free-templates/psd-templates/
  5. Сразу видно в чем проблема, это я про header. Вы используете float'ы, но при этом родителям не прописываете clearfix. Зайдите с браузера в режим разработчика и посмотрите, что у вашего header высота 0. <br> выкидывайте из кода вообще, я так понимаю вы начинающий верстальщик, и пока что легче отказаться насовсем от br, потом как разберетесь с ним, можете юзать. Он на самом деле довольно редко, когда нужен. Как легко центрировать элемент по горизонтали и вертикали в 2018? Смотрите, юзайте flexbox. родитель { display: flex; align-items: center; justify-content: center; } По поводу иконки, саму иконку search можно смело брать с fontawesome. Можно и запариться и нарисовать самому, но зачем? Окружающий его квадрат с закругленными бордерами пишем сами на css. Далее, футер. Никогда не называйте классы так, как называете их вы в этой работе. Почитайте на тему наименование элементов страницы, это несложно. Footer с названием margin-top это жесть:D Не знаю в чем у вас тут проблема, я поставил пару clearfix на header .container и navbar, послего чего перешел к подвалу страницы, убрал оттуда этот ужасный margin и все работало как надо.
  6. Почему в вашей навигации нет линков? Как переходить на другие страницы сайта? Добавьте в li тег a. Далее, корзина и поиск. Делайте иконками, а не изображениями, они не кликабельны, при наведении никакй реакции. Надо править. На кнопки добавьте hover эффекты. В секции about, добавьте плавность на hover и не совсем понятно, они должны быть кликабельными или нет, если да, то добавьте внутрь линк a. Вообще немного странная структура страницы. Класс футер должен быть в элементе footer, вместо div'ов на месте секций пропишите section. По поводу тега main, ознакомьтесь с ним по спецификации W3C. Сам я использую такую структуру, может и вам по душе окажется <body> <!-- WRAPPER --> <div class="wrapper"> <!-- HEADER --> <header class="header"> </header> <!-- MAIN-CONTENT --> <main class="main-content"> </main> </div> <!-- FOOTER --> <footer class="footer"> </footer> <!-- scripts --> <script src="js/scripts.min.js"></script> </body> Едем дальше, аккордеоны в секции услуг, добавьте плавности им, и желательно при повторном нажатии на элемент его закрывать, в ином случае мы можем его закрыть, только нажав на другой блок. У слайдеров стрелкам добавьте hover + cursor: pointer при наведении В секции team, тоже самое, добавляем плавность при наведении. С соц линками у вас трабл, вы лучше не тегу li присвивайте высоту и ширину, а тегу <a> лучше, так как, чтобы перейти по этим линками приходится тыкать в самоу иконку, а это не удобно Секцию с клиентами сделайте кликабельной и добавьте тут в линки target="_blank", чтобы при нажатии открывалась другая вкладка. Вашему юзеру не нужно лишний раз уходить с сайта:) В секции работ, сделайте изображения ссылками, можно добавить сюда плагин magnific-popup В общем тут везде одно, и в футере и в блогах и тд добавить ссылок, плавных hover-эффектов
  7. Приветствую. Оцените, пожалуйста, верстку. Особое внимание прошу обратить на секцию How We Work. НАсколько корректно выполнена данная верстка? https://alex2033.github.io/Orion/index.html
  8. WebNewbe

    Первая верстка

    Прежде всего нужно избавиться от горизонтального скролла Было бы неплохо добавить hover эффекты на кнопки, на изображения в секции порфтолио, на иконки соц. сетей в футере Было бы неплохо сделать логотип кликабельным. Насчет выезда содержимого header уже сказали, остается добавить, что у вас есть в хедере стрелка вниз. Зачем она? Как правило их ставят, чтобы пользователь мог на них кликнуть и последовать к следующей секции, у вас же она просто бросает в верх сайта. То есть сделайте якорь на следующую после шапки секцию Смотрите, есть еще такая тема. Если видите, что, например, у секций одинаковые отступы в макете, то почему бы им тогда сразу не прописать падинги? section {padding: 50px 0;} - это как пример
  9. Итак, изменения: 1) Было решено уменьшить высоту фиксированной панели навигации. Да не по макету, но что-то слишком она большая 2) Решена проблема с сокрытием навигации при переходе с мобильного на десктопное разрешение 3) Был баг с не совсем корректным центрированием табов в секции Works, исправлено 4) Подправил код html и css, код прошел валидацию В IE11(не в Edge) какая-то дичь творится, а именно: - в шапке сайта отцентрированный текст прилип к верху - при клике на меню при мобильном разрешении иконка гамбургера смещается в центр панели навигации
  10. не-не) Это за 5 минут сделанная страница, чтобы сюда размещать работы, позже уже сайт-портфолио полноценный буду делать. Вот сама работа, про которую тут идет речь https://alex2033.github.io/Brandi/index.html
  11. Доброго времени суток. Оцените верстку https://alex2033.github.io/Blueasy/index.html В этот раз решил поверстать без гридов, после продолжительной верстки сетками, их отсутствие принесло парочку неудобств
  12. Я согласен, мне такой метод тоже не нравится, потому что при том же каком-нибудь айпаде при горизонтальном и вертикальном отображении сайт будет себя вести не так как нужно. Просто пока что других методов не знаю. Спасибо за ссылку, обязательно ознакомлюсь
  13. Добрый вечер. Теперь адрес сайта -https://alex2033.github.io/Brandi/index.html Благодарю за отзыв, теперь по порядку: 1. Убрано 2. Убрано 3. Это скорее уже к дизайну. Старался делать его максимально похожим, увеличил высоту карты на 100px, а линия снизу задумана в макете 4. Она работает, попробуйте зайти с телефона. Я так понимаю у вас в браузере при разных разрешениях экрана не работает, потому что в js я прописал, что меню начинает свою работу при ширине менее 768px if ($(window).width() < 768) { }
  14. 1) Скроллинг карты был убран 2) Анимацию решил оставить только в шапке, ибо в том же сафари она глючит 3) Google PageSpeed: 77/mobile, 77/desktop - это достаточная скорость загрузки страницы? 4) Как считаете, стоит ли подобную верстку себе в портфолио добавлять? Достаточно ли она корректно реализована и достаточно ли данный макет сложен для портфолио?
  15. Так, проблема с адблоком решена. Оказывается он блокирует все блоки, в названии которых есть слово "banner".