СергейРусков
-
Posts
49 -
Joined
-
Last visited
Content Type
Profiles
Forums
Calendar
Store
Everything posted by СергейРусков
-
Окей, так и сделаю, спасибо за наводку. Никаких особых причин делать именно так не было, просто этот плагин был на слуху. Кстати, написано, что и gulp-connect переписали, теперь его кличут gulp-webserver, как же просто жить когда нет выбора
-
Да, пардон, спать хотелось и не стал подробно расписывать. Ссылка не работает, а по памяти не буду писать, что б не соврать. Наверно я так придираюсь, потому-что сам сейчас делаю этот шаблон и себе стараюсь не позволять оплошностей. Заработало. Я немного поправил код пока сервер лежал, так что не удивляйтесь, если найдете новые баги/не увидите старых.
-
Да, пардон, спать хотелось и не стал подробно расписывать. Ссылка не работает, а по памяти не буду писать, что б не соврать. Наверно я так придираюсь, потому-что сам сейчас делаю этот шаблон и себе стараюсь не позволять оплошностей. Да, что-то с сервером, разбираюсь. Как только заработает - напишу
-
Спасибо за отзыв, но он не несет почти никакой пользы, так как очень поверхностен, по пунктам. Блоки скачут. Кто куда скачет? У меня все на месте. Отступы не продуманы. Я продумывал. Заголовки проставлены с ошибками. Какими? SEO? С этим я могу согласится, а могу поспорить, интересна Ваша аргументация. Соответствие макету никакое. Вы преувеличиваете, макет узнается с первой секунды. Если вы про накладывание картинки поверх сайта, не знаю зачем Вы потратили свое время, это не соблюдалось осознанно и об этом я написал в первом сообщении. Адаптивность еще допиливать. Что это значит? Огромный спрайт на несколько картинок. Это имеет значение? В размере он не вырос, а удобство доставляет. Даже кнопка не сверстана. У меня есть несколько версий о чем Вы, поспорю с наиболее вероятной. Если Вы о кнопке Browser в картинке баннера, то вот цитата из ТЗ: "Инфо блок содержит баннер - полностью картинка". Более того user experience говорит людям кликать в любое место баннера, так сложилось, к тому же так банально удобнее.
-
Fabrique - Задание/руководство на базе Bootstrap
СергейРусков replied to klierik's topic in Practise Templates
Частично выполнил задание, обсуждение тут. -
Доброго времени суток, частично выполнил задание предложенное на форуме. Сам сайт. Исходник тут. Там же чуть больше деталей об этом проекте, не буду повторяться. Сразу отмечу, что не придерживался ТЗ доскональна, так как это учебная верстка, а ТЗ ставило рамки и задачи не подходящие под мои цели. Специально и сразу не соблюдалась поддержка IE8, так как AngularJS давно прекратил его поддержку(все замечательно работает под IE9), так же мне не очень понравилось качество макета, поэтому раз деньги мне все равно не заплатят, я решил не грузится подгонкой пикселей . Было сделано 3 представления сайта, заместо 4, так как этого вполне достаточно, возможно я и не прав, но спорить было не с кем, а учебного интереса эта работа не представляла. Прошу обратить внимание на AngularJS, если среди вас окажется человек хорошо разбирающийся в вопросе, я буду безмерно рад любому вашего комментарию, пожалуйста, не оставайтесь равнодушным. Спасибо господину klierik за Ваш труд.
-
Говорите конкретнее, что не понятно?Файлы яваскрипта находятся в папке js. Файлы стилей в папке Scss. Слайдеры называются Swiper и Royal Slider. Как все это подключено к index.html описал выше.
-
Извините, не могу скачать. Попробуйте отсюда https://yadi.sk/d/pvwYiAmPb24Pr и, пожалуйста, отпишитесь о результате! Скачал, как я понимаю верстка без слайдера? Все есть, если Вам интересует версия которую я выложил в production она находится в папке dist, можете сразу открыть файл index.html и инспектить слайдеры. Если Вас интересует версия до минификации(я думаю так и есть), то откройте index.html лежащий в корне и после 342 и 11 строки этого файла уберите комментарий с ссылок. Там есть пометка Uncomment this when working with the source . Вы спросите "А нафига ты их комментировал?". А потому что только так будет корректно работать когнитизация файлов в Grunt, иначе после объединения несколько js файлов слайдеров и т.д. останутся ссылки на эти файлы и это приведет к ошибкам.
-
Извините, не могу скачать. Попробуйте отсюда https://yadi.sk/d/pvwYiAmPb24Pr и, пожалуйста, отпишитесь о результате!
-
Чтобы скачать архив нажмите на эту ссылку https://drive.google.com/file/d/0ByB0-zRht4XiWElHZDFIQWF0Ykk/edit?usp=sharing , наведите мышью на верхнюю часть окна браузера, и нажмите на иконку со стрелочкой вниз, Google напишет что "Файл заражен вирусом", дальше сами решайте, качать не качать, со своей стороны гарантирую - на компьютере установлен антивирус, специально вирусов подсажено не было, да и скачало уже много народу. Верхний слайдер не поддерживает touch устройства, проверенно на iPad, что противоречит ТЗ: Требуется поддержка для touch-устройств для прокрутки контента. Если не получится скачать и в этот раз - пишите, залью на другой файлообменник.Как сделаны слайдер - вопрос слишком размытый и объемный, затрудняюсь ответить.
-
Мне кажется в данном случае не оптимально делать навигацию списком, это лишнии сущности, вполне можно обойтись ссылками. UPD И еще, используйте id только для для того, чтобы повесить на них JS. Это помогает логически разделить css/js, это, кстати, есть в ТЗ Классы служат для привязки оформления, идентификаторы – скриптов.И я знаю, что очень многие по привычке используют Photoshop, но говорю от чистого сердца, Firework(тоже adobe) куда удобнее для нарезки макетов (для создания растровой графики он конечно не пойдет).
-
http://zoompf.com/blog/2012/05/html5shiv-and-serving-content-from-code-repositories - по поводу этой статьи, если верить тому что написано, то даже jQuery CDN использовать нет смысла, так как главная фишка - кеширование, сохраняет файл только на 180 сек, а он еще и не везде подключен, занятно... завтра погуглю побольше. Пижонство типо gzip не понимаю ну или просто не вижу в этом практического смысла, наверное, можно придумать какие-нибудь умные слова и доводы, но я не буду делать и без того непростую задачу сложнее Все просто, так проще дебажить, если обратите внимание я и line_comments = true оставил, мне кажется разработка должна быть удобной, а cssmin, просто, для того чтобы написать одну строку и получить сразу production.
-
Спасибо за такое глубокое изучение вопроса! Даже отсутствие html5shiv в modernizr заметили, интересно как ? По поводу списка, это провал, никак не могу систематизировать заливку на сервер черновых версий и уже протестированных, в разные директории. Спасибо за статьи, пока прочитал только бегло, но ссылку на гугловский html5shiv уже удалил Все этот маркетинг, гугл - значит хорошо, дальше даже не разбирался Сайт перезалил, проверил во всех браузерах - ссылки в порядке, лишние амперсанды убрал(именно ради таких подробностей и выложил сюда исходники ), гугл архив обновил. Всегда буду рад новым замечаниям! UPD Прочитал статью про отрицательные margin, для академических целей конечно интересно, но по моему это ужасно выталкивать элементы за пределы родительского элемента, и если положить на мою задачу (разбить список на 2 столбца), то в результате получатся 2 разных списка, а этот пункт в ТЗ обговорен отдельно: 1.1. Меню - Все как видно так и делать. Пунктов меню может быть больше -- это один список который выводится в 2 столбца. Текст пункта меню может быть длинее и распологатся в 2 строки. Обратить внимание на высоту строки в этом блоке, так как пункт в 2 строки будет выглядеть плотнее. Но все равно было интересно!
-
Все сделал, добавил проверку браузеров на поддержку pointer-events, если не поддерживается, тогда затемнения элегантно уходят влево и вправо(transition-delay: 1s, если не поддерживается transition, тогда не элегантно , при hover на .rsNav(спасибо за наводку, черновой и глупый косяк). Буду очень благодарен, если копнете поглубже. Спасибо еще раз.
-
Какой-то конфликтный характер разговора назревает, но отвечу по существу. 1. Если изменить ширину параграфа на 220px сразу как в макете не получится, наложите pixel perfect и увидите это. 2. Та часть про отступы про которую Вы писали и так уже выполнена, отступ между секциями внутри слайдера составляет 15px об это я написал 2 сообщения назад, зачем что-то еще менять?
-
Позвольте, что за ошибки ? Расскажите, мне же интересно! И главное где вы их исправили? В испекторе кода? Извините, я ничего не понял Безумно ценно!! Сегодня же займусь, пока даже не слышал об этом pointer-event.
-
Какой Вы упрямый целью этой работы и не было сдать ее кому-либо, цель верстки для начинающих найти МАКСИМАЛЬНОЕ кол-во ошибок в своей работе и устранить их, а не спорить по поводу недочета который приводит к другому недочету. Ну да бог с ним, я нашел компромисс, так же исправлены ошибки указанные Klierik'ом. http://www.tech-drive.ru/sergey/splat/
-
Спасибо за Вашу активность, что Вы по подразумеваете под словом починили? Если margin-right в Swiper слайдер(верхний), то там не совсем все так просто, надо учитывать, что все 4 колонки должны быть видны сразу после загрузки сайта, увеличивая margin мы сокращаем текстовую область, у которой оптимальная рекомендованная минимум 45 символов (надо сказать она и так меньше), что в свою очередь приводит к ухудшению читабельности текста. И, кстати, если представим, что я заказчик и поставил буквально третьим пунктов ТЗ вот такое условие ( http://htmlforum.ru/index.php?showtopic=47965 ): Соответствие макету Вёрстка должна 1:1 соответстввовать дизайну, но допускаются незначительные различия. Данные различия, как правило, возникают из-за шрифтов или при использовании технологии адаптивной разметки. В помощь прийдет инструмет PixelPerfect -- расширение для браузера. Прошу не заострять внимание на строчке про незначительные различия, так как в данном случае margin удлиняет столбцы, что видел к дальнейшему краху ( и опять же слишком мало места для текста). А так, я бы конечно многое тут поменял под свой вкус, и даже смог бы вразумительно объяснить, что и зачем, но ТЗ есть ТЗ, это все таки учебная верстка. Если у вас еще не пропало желание мне помогать прошу заострить внимание на тех вопросах которые я задал в первом сообщение. Спасибо. потому как согалсно сетки должны быть поля по краям, которые и будут занимать по 10пк. в итоге 960 и кстати, картинки такого типа: http://www.tech-drive.ru/sergey/splat/pic/royalSlider/iney.jpg должны быть не JPEG а PNG, так как первый косячит с текстом. Спасибо еще раз! Эх чувствовал, что с этой шириной что-то не чисто, переделаю Про влияние JPEG формата на края текста после компресии для меня тоже новость, очень ценно. И если у Вас будет вдруг свободные 10-15 мин буду Вам крайне благодарен, если Вы глянете наметанным глазом (можно даже двумя ), на исходники Scss и JS, наверняка, что-то сразу будет резать глаз. Спасибо.
-
Тогда pixel perfect можно скомкать и выкинуть, вообще, Вы конечно правы, я думал, что проблема в шрифте, но я попробовал Helvetic, Open Sans из google fonts и везде было примерное тоже самое что Вы видите сейчас. Зачем выкидывать, делаете идеально в хроме, в других браузерах также никогда не будет.Именно так и сделано, но если добавить марджин все пойдет коту под хвост, можно конечно поиграть letter spacing, поменять шрифт, line-height и т.д. но из того что я пробовал - это оптимально.
-
Тогда pixel perfect можно скомкать и выкинуть, вообще, Вы конечно правы, я думал, что проблема в шрифте, но я попробовал Helvetic, Open Sans из google fonts и везде было примерное тоже самое что Вы видите сейчас.
-
Извините, можно попросить скриншот и название и версию браузера, а так же операционной системы, я этот сайт проверил в Сафари, Хроме, Опере и Фаерфоксе, в последних 2 версиях этих браузеров, а так же в 8-11IE нигде ничего не слипалось, сложно править не зная на чем тестировать, и как выглядит проблема. Спасибо.
-
проверил еще раз все ссылки, привлек друзей, все отлично работает
-
Сам макет и ТЗ находятся здесь http://htmlforum.ru/index.php?showtopic=47965 . Собственно хотел обсудить там, но злые админы запретили. Так вот, хотел бы выразить благодарность Klierik'у за отличный макет, много чему научился выполняя его ТЗ. По теме, за эталонный браузер был взят Chrome. В архиве лежит grunt, если кому захочется покопаться поглубже, livereload и компиляция запускаются с помощью команды: grunt splat, минификация, контагинация и т.д. - grunt production. Момент с шириной сайта в ТЗ я не совсем понял, написано стандартная ширина сайта 960px, а в макете 940px, делал по макету. Промо слайдер это что-то с чем-то. Насколько я понял сделать его именно таким как в макете, это задача настолько сложная, что можно сказать невыполнимая. Вся сложность заключается в корректной работе слайдера при условии, что ячейки в навигационной строке имеют разную длину (в зависимости от кол-ва символов в них), я использовал Royal Slider, вот мнение автора слайдера по этой проблеме http://help.dimsemenov.com/discussions/problems/11648-thumbnails-width-different-widths . Можно конечно с помощью подбора длины слов получить приемлемый результат вроде этого http://bestfuns.url.ph/Task1/ , но это костыли, да и если прокрутить этот слайдер до конца вправо будет виден зазор между ячейкой и границей навигационной строки. Если кто знает решение, или слайдер в котором данная возможность поддерживается, поделитесь пожалуйста. Отдельно прошу придираться к JS и Scss(использование ф-ий, примесей, написание собственных, переменные и т.д.). Заранее спасибо! Сам сайт: http://www.tech-drive.ru/sergey/splat/ Исходники
-
Выполнил данный макет, обсуждение тут http://htmlforum.ru/index.php?showtopic=50147
