Это копия, сохраненная 19 мая 2016 года.
Скачать тред: только с превью, с превью и прикрепленными файлами.
Второй вариант может долго скачиваться. Файлы будут только в живых или недавно утонувших тредах. Подробнее
Если вам полезен архив М.Двача, пожертвуйте на оплату сервера.
Здесь аноны изучают верстку, базовый фронт-енд и обсуждают все, что с этим связано. Полноценная инфа по материалам в пасте, здесь только краткая выкладка базиса и основные ссылки.
Если ты ньюфаг, то тут тебе будут рады. Но только в том случае, если ты, перед тем как что-то спросить, погуглишь хотя бы минут 5 и прочитаешь фак/пасту. В противном случае будешь послан нахуй, и абсолютно заслужено. Совершенно идиотские вопросы, нытье и прочее - аналогично. Не говорите, что мы не предупреждали.
====================
КРАТКИЙ ФАК ДЛЯ НЬЮФАГОВ И ПРОЧИХ МИМОКРОКОДИЛОВ
>Можно ли вкатиться в randomAge.
Можно.
>Можно ли вкатиться без знаний программирования/матана/функционирования гипертекст протоколов/етц.
Можно.
>С чего начать? Что учить? Куда смотреть?
Внимательно прочитать ОП-пост, затем прочеть пасту от корки до корки. Подумать, надо ли оно тебе, перечитать все еще раз. Приступать к изучению материалов по порядку.
>Есть ли работа?
Была, есть и будет, устраиваются как версталой, так и джунами фронт-ендами. Верстала без хотя бы базового знания JS сейчас как мамонт, поэтому готовьтесь учить и Javascript. В любом случае он вам понадобится, если планируете развиваться хоть куда-то. Джун фронтенд, полноценный и востребованный на рынке, а не программист на джиквери - это спец, умеющий и сайтик сложный сверстать, и страничку оживить, и приложение на нативном сваять.
>Пришел ли кто-то из нашего треда к успеху?
Да, и не один а двое, азазазза, кхм.
>Сколько времени займет обучение?
Плотно стоящий на ногах верстальщик с портфолио из 3-5 адаптивных макетов, но практически без знаний JS - 400+ часов.
Верстала с пониманием JS и портфолио - 600+ часов.
Фронт-енд джун с уверенной версткой, уверенным JS, умением в дополнительные техи/фреймворки/препроцессоры/либы/системы сборки/otherSkillName, своими пет-проджектами, в том числе наверстанным портфолио - 1000+ часов.
>Слышал что для устройства на работу нужно портфолио.
Нужно, чтобы всякие эйчары могли убедится еще до отсылки тестового что ты что-то умеешь. Верстале для портфолио достаточно запилить самостоятельно пару макетов. Джуну фронту надо либо макеты с вменяемой клиентской логикой и безупречной версткой, либо какую-то приложуху.
>Подскажите хостинг/сайт/место где все эти проекты держать?
Для сверстанных макетов без логики или с клиентской логикой хватит и гитхаба. Гуглишь бесплатный хост для страничек от гитхаба - github pages(gh-pages). Иметь профиль на гитхабе вообще - признак хорошего тона, так что в любом случае пригодится.
>Могу ли учить верстку/JS после работы по 2 часа?
Можешь но это вряд ли будет эффективно. Указанное время в таком случае можешь смело умножать на 1,3+.
>Могу ли я спросить что-то в треде?
Конечно. Но перед этим следует проделать следующие действия.
1. Подумать.
2. Погуглить.
3. Попробовать решить задачу самостоятельно.
4. Еще раз подумать.
Если решения все равно нет - спрашиваешь.
Задачу описываем четко, код показываем только в песочнице тут не экстрасенсы сидят нам нужно пощупать код, иначе никто не поможет Аноны с кодом в постах, на скринах, в архивах, сразу идут нахуй. Вас предупредили.
Дополнительно можно приложить скрины где показано, что работает/что не работает/как хотелось бы/как планировалось/етц. Плюс текстовые пояснения конечно. Оформите вопрос правильно - практически гарантированно получите грамотную и своевременную помощь.
Дальнейшая информация для ньюфагов в пасте в конце ОП-поста. Там ВСЕ расписано, в том числе самый удачный по мнению автора алгоритм изучения основ верстки, есть тонна полезных ресурсов для разработчиков начального-среднего уровня и прочая годнота.
=====================
Cразу скажу, времена, когда можно было сверстать две фиксированных странички и завалиться в хардкорный фронт-енд давно прошли. Нет, работу конечно найти можно будет. Позиция называется Markup или HTML/CSS Developer называйте как хотите хотя даже там требуется знание адаптивности и прочих ништяков, но это только старт, и ЗП там вряд ли вас сильно порадует, если конечно сможете найти такую позицию. На данный момент фронтендеру нужно учить больше, чем просто HTML/CSS. В частности необходимы продвинутые инструменты разработки, автоматизаторы, работа со скриптами, сам Js и Jquery, в перспективе что-то из Js фреймворков, MVC и прочего дерьма.
Не помешает навык натяжки оболочки на движок. Можете даже в бэкенд завалиться, если интересно. Но продуктивно это совмещать со всем тем стаком технологий, что нужны для фронт-енда, получится не у каждого, особенно на старте. Впрочем, если есть желание - попробовать можно, оно того стоит. Только есть нюанс, материалов по бэкенду здесь в пасте представлено мало, если кто-то в будущем поделится – будем рады и включим в будущие редакции.
Работу находим в конторках и крупных фирмах. Конторки/студии - основное направление деятельности. Альтернативой конторкам может стать фриланс, тут уже все опять же индивидуально, но конкуренция там больше, в начале может быть сложно, скучно и относительно дешево. Помните о портфолио, оно просто необходимо, да и за время его создания руку набьете.
Дальше представлены первичные обучающие материалы в сильно сокращенном варианте, полные списки найдете в пасте.
http://dash.generalassemb.ly/
http://learnlayout.com/
http://htmlacademy.ru/ - ультрагоднота
http://learn.javascript.ru/ - по JS на русском лютая годнота. Годнее только Флэнаган
http://www.codecademy.com/
http://codeschool.com/ - тут платно, но есть бесплатные курсы, годные вещи про jquery и git
http://htmlbook.ru/ Справочник. Каждый верстальщик пользуется им. Все непонятное смотрим там.
http://teamtreehouse.com - тут все платно, но первые две недели бесплатно, можно успеть пройти пару курсов, объясняют хорошо.
Для работы понадобятся текстовые редакторы или среды разработки, тут уж решать вам.
Текстовые редакторы:
http://brackets.io/
http://www.sublimetext.com/3
https://atom.io/
ПРИМЕРЫ ВЕРСТКИ ДЛЯ САМЫХ МАЛЕНЬКИХ:
Внизу видеокурс о том, как верстать PSD шаблон. Просто пример, чтобы посмотрели как выглядит работа и как верстают С НУЛЯ.
http://denweb.ru/put-veb-mastera_sod
Верстка по БЭМ
http://habrahabr.ru/post/203440/
Лично я все же посоветую черпать инфу по базовой верстке из интенсивов, ссылки чуть ниже. Там ребята показывают весь процесс и делают это качественно. Никаких ошибок, минимум стилизации и отсебятины.
Гайд от анона по гитхабу:
http://randomfederation.github.io/
Шпаргалка от Громова по гиту
http://nicothin.pro/page/git
Базовый интенсив за 2015 год:
http://nnmclub.to/forum/viewtopic.php?t=899131
Тот же базовый но посвежее, за 2016 год:
http://nnmclub.to/forum/viewtopic.php?t=999246
https://yadi.sk/d/3AhpPwHaq5Bwp
Продвинутый интенсив за 2015 год:
http://nnmclub.to/forum/viewtopic.php?t=900609
Дополнительные материалы к интенсивам, рекомендуются к ознакомлению.
https://github.com/tsergeytovarov/htmlacademy-basic-additional-material
Базовый JS интенсив за 2015 год:
http://nnmclub.to/forum/viewtopic.php?t=974803
https://github.com/o0/keksobooking
Макеты для верстки, тоже от академии. Все из их рассылки, поэтому лучше бы тебе на нее подписаться. Ребята вываливают кучу годноты, хоть и относительно редко.
https://mega.nz/#!CtYGSCbB!3Y6fDxxL_N_LstGFPGjHrhXbIoNqk4BzmNjjEmk2jPc
======================
Все основная инфа и материалы здесь:
Обновленная паста, она же FAQ - http://pastebin.com/ytWW0UfU
Старая паста если кому вдруг понадобится - http://pastebin.com/tvvwC7uz
Прошлый тред >>517275 (OP)
Хочу освоить вордпресс, верстку уже более-менее натягивать умею на движок.
Какие еще типовые задачи нужно уметь решать, чтобы хоть чуть-чуть фрилансить ?
Ну это по этой херне я и 2 года назад еще пыфтался натягивать. То есть ты хочешь сказать, что если ты возьмешь абсолютно рандомный свой сверстаный макет, то тебе хватит той информации, которая показана в этом видео, чтобы реализовать полный функционал?
Я, например, пытался сделать сайт для себя, и так как серверного языка не знаю никакого, решил опять связаться этой херью, ну и реалтизация всех простейших задумок растянулась на несколько недель, причем с каждым разом, когда я садился за него, запал угасал, так как я просто смотрел в эти Гет_хуйня, смотрел в разные видосы, часовые, в документацию, и все равно это гавно не хотело сотрудничать.
Хуй знает, качал рандомные макеты - с первого раза вставала вёрстка.
https://www.youtube.com/channel/UCt36CWL85NGtOgUMZ2X6x5g
советую посмотреть вот этого. там как раз про правильное натягивание верстки на водрпресс с нуля есть. очень понятно объясняет что и как. но видео длится больше часа, сложно осилить за раз.
у нас тут уже вовсю фронт идет, скриптики, формочки валидируем, ангуляр трогаем, а не только верстку учим. потому и frontend, а не markup
React - one love
задачи на learn.javascript самостоятельно бнз подглядываний решаешь? если нет, то ты не прошел. перечитывай заново каждую главу, решай задачи, через неделю возвращайся, решай, пытайся в какой-нибудь верстке применить полученные знания. гугли все непонятное.
>>523696
олсо, у js низкий порог вхождения. если ты его не можешь осилить, не сможешь осилить остальные. разве что питон еще проще для новичка.
Хз, что там простого, по мне так его освоить в разы сложнее, чем какую-нибудь джаву, одно только прототипное наследование поначалу немало клинит.
>>523696
С типизированного вообще лучше начинать было, а уже потом перекатываться на что-то ебанутое вроде JS. А вообще осваивай всё чо заинтересует, хотя бы на общем уровне знания основ языка. Общее понимание вырастет.
Двачую этого.
Мне всегда было интересно люди говорят: прошел интенсив - потом выясняется что у него затуп в какой-нибудь базовой хуйне которую там обмусолили, или вот прошел learnjs впадаю в ступор когда нужно сделать что-то. Да нихрена ты не прошел, а просто ознакомился в лучшем случае. Прошел - это когда ты усвоил весь данный материал и можешь его применять.
Еще из того же разряда выражение: знаю технология-нэйм
>>523706
Простого в нем то, что простые вещи делаются легко.
мимо-анон первый язык был с++
>мимо-анон первый язык был с++
Тоже начинал с C++, потом была Java, проблем она не вызвала. А вот JS пошёл куда труднее жабы. В тех хоть понятно было, вот класс, вот переменные, вот функции. Если надо что-то сделать, создаёшь класс с нужным функционалом, спокойно прописываешь все типы. В JS же всё через function. Смущала видимость переменных на всю функцию. Смущала возможность взять объект и добавить в него какую-то фигню, при этом не меняя самого класса.
Вообще поначалу было трудно с разбитием на сущности при использовании JS. Потом освоился правда, язык довольно мощный, да и способ мышления уже поменялся.
А если скопипастить в Atom, и открыть страницу в лисе - не работает.
Через ссылку пробовал импортировать, как отдельный пакет для атом тоже, результата ноль
http://puu.sh/o80hy/87723796c4.png
Тебе нужно подключить библиотеку - скачать себе или тянуть с внешних ресурсов.
Вот смотри, на fcc сказали что чтобы стянуть бутстрап, достаточно в начале кода написать строчку как на пике
http://puu.sh/o80qh/a5fd005311.png
Но все равно не работает
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
О, спасибо, бутстрап заработал, а для jQuery такой штуки нет?Или надо отдельно библиотеку устанавливать?
Реализованно через плагин, активные option получают класс selected. Я так понимаю нужно делать через$('select.class').is(':checked') но дико туплю и не понимаю как.
Я копипастнул в него, через settings подключил бутстрап и jQuery, но все равно не прыгает
http://puu.sh/o81MD/4c70180bdb.png
Уф, нам то ссылку дай. Или ты хочешь что бы мы перепечатали и потом разбирались.
Кхм. Codepen дают, чтобы ты написал туда свой код, нажал SAVE и кинул получившуюся ссылку сюда.
По поводу твоей проблемы: не прыгает, потому что и не должно. Скрипт добавляет элементам CSS классы, в которых должны быть прописаны все прыгания.
Раз непонятно что как и почему, может быть, лучше начать изучение с самых азов? С курсов htmlacademy, например.
Из моего города непонятно откуда взялась компания, нашедшая мое аутдейтнутое резюме и запилившая оффер. Почти сходу предложили назвать почасовой рейт. А я даже хз сколько это будет в адекватных цифрах.
Из навыков
HTML5/CSS3 на хорошем уровне
JS - тут я даже хз какой уровень. Любой функционал для сайта от анимированных меню до более менее серьезных штук напишу без проблем. Из логики посерьезнее успел написать тестовое апп с запоминанием данных, сохранением на сервак/локалСторедж, рендером на страницу по шаблонам, сортировкой. Возможностью отсмотреть картинки которые сохранил в галарейке, удалить запись и прочую такую лабуду. Разбираюсь щас с OO JS.
Дальше Grunt, Git, Less, BEM, Photoshop и т.д и т.п по списку. Английский на уровне pre-intermediate
С фреймворками типа Angular and so on не работал.
Что скажете?
Зависит от страны, от города, от опыта работы. Смотри dou (если хохол), или hh.ru (если кацап) и ищи сравнимые по требованиям позиции. Так примерно поймешь медиану своего уровня.
Спасибо так и сделаю.
Просто в нем то, что можно спиздить скрипт какого-нибудь слайдера и без особого понимания, что куда, переделать его под себя. Это просто. А реально вникать и понимать джс сложнее, чем питон или тот же пхп.
мимо еблан, выучивший пхп и перекатившийся в изучение джс/верстки
Базовый левел верстки (типа барбершоп набросать) стоит что-то типа 200рублей в час, отсюда и пляши.
Да тут вон анон с опытом устраивался недавно и считал роскошью за верстку 150р в час и говорил, что больше не дадут
Ну ты примерно возьми зп которая тебя будет устраивать и подели её на 40 часов в неделю.
Так в академии той же предлагали оценивать (брали они со статистики для ДС)
Ты так и не понял что они так наебывают людей, чтобы они у них интенсивы покупали?
30к для ДС за верстку по-моему не заоблачная ставка далеко. Или ты считаешь что надо за 15к фигачить? Только тогда если в ДС 15к то представь сколько в мухосрани какой-нибудь.
А то что наебуют - ну так курсы для того и создают, чтобы стричь бабло. Это любому ясно.
Ну, я из ДС, два. Разве 200р в час много? Это где-то 30к/мес. Я, да простит меня господь, не читайте спойлер 150/час делаю на копирайтинге, в среднем. Если он освоил галпы-хуялпы, адаптивность-хуивность, препроцессоры и прочее, то, ящитаю, вполне себе расценка. В мухосрансках пониже, конечно.
К примеру, в этом коде: http://codepen.io/anon/pen/JXOQMY
флекс к content__item распидарасит каждый айтеам на 100% ширины браузера (зачем мне флекс на айтемы, спросите вы? С флекс-колумн + жустифай сентер охуенно все встает, там еще по задумке картиночки-кнопочки сверху и прочие рюшечки).
Решение? Флекс-базис 33,3%. Хуяк, бля, и все работает нормально...
А, нет, теперь текст внутри <p> внутри этих айтемов распидарашивает на всю ширину окна. Решение? Задать <p> width:100% Логика зашкаливает просто.
Олсо, этот код, который работает напрямую в ие11, не работает, если открыть кодепен в ие11, лол.
Понятное дело, но его везде требуют. Вот приду я устраиваться на работу и скажу: "ебал я врот ваш ие, я на флексах хуячу)))". Так что-ли?
Мне очень хорошо помог codewars именно в практике js. Но до это 2 года верстал говно на jquery, так что язык немного знал.
Попробуй. Непонятные моменты можно смотреть на том же learn.javascript
Этот анон - ленивый пидор. Если так демпинговать, то и правда даже 150 рублей будет роскошью.
Не проси меньше 200, будь няшей.
Не понял. Почему у одной? Я подставил его под все цифры во всех разделах.
Желательно потому что начинать ты будешь с чисто клиентского JS, где надо понимать тонкости разметки, которой ты собираешся манипулировать. Иначе нагородишь адской хуйни, хоть и возможно работающей.
Бро, я уже все переделал и прошел его. Просто непонятно почему у меня не выходило делать по центру.
<td class="hui>1</td>
.hui {
text-align: center;
}
По идее должно же центроваться. Но нихуя.
Пик рандом
Картинка должна быть в цвете, изменять HTML нельзя. Ваши предложения?
Сколько стоит верстка сайта типа барбершоп и техномарт? Где можно посмотреть за цены, люди спрашивают сколько нужно, я ответить не могу.
Кстати, я там в конце проебал префиксы, но с ними тоже не работает.
Не, рендеринг так не работает. Фильтр будет красить всех потомков, что бы ты ни делал
Это баг?
Выше же писали - 200 в час в ДС
Или я сам должен оценить время, которое необходимо затратить на разработку и сойтись в своих оценках с заказчиком?
>Или я сам должен оценить время, которое необходимо затратить на разработку и сойтись в своих оценках с заказчиком?
Да
http://frontender.info/estimating-a-front-end-web-dev-job/
Проходил курсы codecademy, htmlacademy и freecodecamp. Пока что htmlacademy понравились больше всего. Codecademy уж очень по верхам прошлись, а FCC какие-то просто не оче, особенно когда видишь десять заданий подряд в стиле сделайте background-color: #ff0000 а теперь #00ff00 а теперь #0000ff.
Тот же вопрос. Так же нихуя не понял. Я правла посмотрел еще "сетки", но из-за этого нихуя не понял вдвойне. Надо, наверное, одноименный курс на хтмлакадеми пройти сначала.
А с фотошоп то что делать? Мне стоит начинать смотреть "сетки" ? Блять вечно то народу дохуя когда не надо, то никого нет и объяснить некому.
Проходить курс "блочная модель документа + сетки перед тем как начать просмотр?
Фотошоп нужен для экспорта графики. Можешь смотреть дальше сетки, можеть вырезать графику и заготовить заранее, а потом смотреть сетки или че там дальше идет.
Я раньше графику готовил заранее, а щас подрезаю в процессе вертски.
Делаю какой-то блок, ага, тут надо картночку, вот тогда и экспортирую.
Ты зачем такой затупан? Только сегодня тоже посмотрел фотошоп, таких вопросов не возникло.
Он задан как дз в конце вебинара. Но я бы прошел перед просмотром, потому что...Ну, может это я такой тупой, но я эти два часа просидел под лекцию Першина и мало что понял. Надо самому все пробовать.
Двачую этого. И так всю разжеванную и структурированную инфу на блюдце подают. Жаждущим вкатиться и спецификации хватит.
Я не фрилансер, но работаю 20-25 часов в неделю и норм мне.
Ну расскажи хули, сколько шел, че умеешь, какой бэкграунд.
пруф
У личных проектов тоже все страницы размечать? Пиздец. Я же не понимаю нихуя. А мини курсы на сайте не объясняют.
Ну хуй знает. Не разобрался как каталоги верстать + с формами проблемы пиздец типа вот этой залупы на пике. Я дважды просмотрел интенсив и все равно не вдуплил. Или как сортировку сделать. Неужели я один такой во всем треде тупой?
Да, барбершоп + 2 личных: один фикс, второй резиновый/адаптивный. Размечай лучше сразу.
Я тупее тебя, потому что на сетках уже нихуя не понимаю. И размечать личный проект еще не начал.
Думаю пересматривать все с нуля, так как на каком-то моменте я проебался и всё. Дальше непонятки нарастают только.
Ага, однообразные однокнопочные задания, а потом самостоятельгая работа - сварганьте портфолио на бутстрапе с такими- то функциями, и похуй что половину мы не обьясняли. Старожилы правжа говорят, когда ява пойдет - будет веселей.
Опять же, только сегодня с этим тоже разобрался. Хули тут непонятного? Две формы, одна чекбоксы, другая радиобатоны. Все блять. Про штуку под стоимостью говорится в вебинаре про сетки (2016 года), там в начале разбираются каверзные моменты. Я сначала разметил, а потом уже посмотрел этот вебинар, когда размечал просто пустую дивку оставил.
>Опять же, только сегодня с этим тоже разобрался
Ути умничка какой. Возьми с полки пирожок, покушай, умничка ты мой, хороший, заслужил. Ух молодец. Горжусь тобой. Вырастила! :33
Уруру! Какой умный мальчик! Это я его научила! Ух сообразительный, в верстке разбирается, разметить html страницу научился! Профессором наверное станет.
Саси короч)
Спасибо, мне как-то не лень эти испытания проходить, на еблю с макетами кучу времени уходит.
*лень
https://github.com/tsergeytovarov/htmlacademy-basic-additional-material
вот эти
Как делал я:
- курсы были пройдены до интенсива (так получилось, но можно проходить и после просмотра записи курс по теме урока)
- пролистал быстренько все записи вебинаров, чтобы понять что за чем идет (мне так проще понять цельную картину того, чему будут учить)
- смотрел отдельно каждый урок внимательно
- читал дополнитлеьные материалы как данные в уроке, так и по ссылке, что кинул
- делал то, что показали на уроке (по барбершопу) только сам, не подсматривая.
- далее делал подобное только на личном макете (первым брал нердс)
Благодаря тому, что в начале было пролистано, я знал: карточки каталога - покажут на той записи, формочку цены там-то.
Совет из личного опыта: не пытайтесь сделать скажем ту же разметку прям после второго урока сразу всех страниц и идеально (только будете долго ебаться). Вам все-равно придется возвращаться к тому или иному элементу (верстка по сути проходит итерациями). В последствии еще в следующих уроках тот или иной элемент может описываться.
Показана одна разметка барбершопа - на личном макете тоже попытайтесь сделать одну страницу
Лично мне сейчас проще делать не как они предлагают: сначала все разметить, потом вырезать графику, потом сделать сетку, потом оформлять детали там и т.д.
А проще сначала ознакомиться со всем макетом целиком и вырезать нужную графику, подготовить шрифты (если надо иконки) в процессе осматривания в фотошопе в уме прикидывается каким способом будешь делать тот или иной элемент. А потом тупо поэлементно (поблочно) делать макет. Грубо говоря есть шапка - вот ее и делаешь полностью. Потом переходишь к другому блоку. Мне лично так проще, чем сразу делать только одну лишь разметку но для всего макета.
Первый свой макет вы в любом случае сделаете как они описывают, а остальные можете делать тоже по частям. Тем более в продвинутом никого особо не ебет как вы будете делать, а под БЭМ такой подход (блочный) очень даже подходит.
Надеюсь, мой опус кому-то из ньюфань покажется полезным.
курю базовый по js-кун, прошел базовый и продвинутый по верстке
https://github.com/tsergeytovarov/htmlacademy-basic-additional-material
вот эти
Как делал я:
- курсы были пройдены до интенсива (так получилось, но можно проходить и после просмотра записи курс по теме урока)
- пролистал быстренько все записи вебинаров, чтобы понять что за чем идет (мне так проще понять цельную картину того, чему будут учить)
- смотрел отдельно каждый урок внимательно
- читал дополнитлеьные материалы как данные в уроке, так и по ссылке, что кинул
- делал то, что показали на уроке (по барбершопу) только сам, не подсматривая.
- далее делал подобное только на личном макете (первым брал нердс)
Благодаря тому, что в начале было пролистано, я знал: карточки каталога - покажут на той записи, формочку цены там-то.
Совет из личного опыта: не пытайтесь сделать скажем ту же разметку прям после второго урока сразу всех страниц и идеально (только будете долго ебаться). Вам все-равно придется возвращаться к тому или иному элементу (верстка по сути проходит итерациями). В последствии еще в следующих уроках тот или иной элемент может описываться.
Показана одна разметка барбершопа - на личном макете тоже попытайтесь сделать одну страницу
Лично мне сейчас проще делать не как они предлагают: сначала все разметить, потом вырезать графику, потом сделать сетку, потом оформлять детали там и т.д.
А проще сначала ознакомиться со всем макетом целиком и вырезать нужную графику, подготовить шрифты (если надо иконки) в процессе осматривания в фотошопе в уме прикидывается каким способом будешь делать тот или иной элемент. А потом тупо поэлементно (поблочно) делать макет. Грубо говоря есть шапка - вот ее и делаешь полностью. Потом переходишь к другому блоку. Мне лично так проще, чем сразу делать только одну лишь разметку но для всего макета.
Первый свой макет вы в любом случае сделаете как они описывают, а остальные можете делать тоже по частям. Тем более в продвинутом никого особо не ебет как вы будете делать, а под БЭМ такой подход (блочный) очень даже подходит.
Надеюсь, мой опус кому-то из ньюфань покажется полезным.
курю базовый по js-кун, прошел базовый и продвинутый по верстке
Перекатился из треда в /б к вам и что же я вижу, не по профессии, а только если ты кодер-погромист, где другие профессии то?
Кое-что вынес для себя.
Был тред в /б, даун, там пост "перекатывайтесь сюда, если хотите по профессии переехать в асашай". Перекатываюсь и вижу тут только кодеров-погромистов и не одной другой специальности.
Чувак, тут таких залетных как ты не любят.
http://docs.emmet.io/cheat-sheet/
ls - чтобы глянуть есть ли она в директории
rm -rf folder_name вроде чтобы удалить
также попробуй просто обновить саму папку может она уже и так удалилась раз пишет расположение недоступно
> также попробуй просто обновить саму папку может она уже и так удалилась раз пишет расположение недоступно
Действительно, спасибо.
Полное говно, рассчитанное я даже хуй знает на кого.
http://bitforest.io/
мопед не мой, просто наткнулся на просторах интернетов
Эффекты нужны, но меру-то блядь знать надо. Отличный показатель того, как ебанутый дизайнер видит свой говноделие, но ничего не смыслит в UI
У меня не получилось сделать круглый бордер градиентом ни по одному из этих способов. Единственное, что вышло - залить вообще всю картинку полупрозрачным градиентом, лол.
Зато получилось залить тестовый квадрат, лол. В общем, я сейчас удалю свой говнокод и с утра заново попробую.
В общем, сделал так:
http://codepen.io/anon/pen/QNaOVV
Не знаю, насколько это лучше, чем тупо вырезать картинки с бордером в фотошопе, но хоть работает.
Хелп, аноны. Как сделать чтобы при ховере не прыгало?
* {
box-sizing: border-box;
&::after {
box-sizing: inherit;
}
&::before {
box-sizing: inherit;
}
}
>>526401
Лол, я еще немного подумал и оказалось все проще, сделал через outline. Спасибо за помощь, мб в другой ситуации пригодится.
Ну не знаю, я бокс-сайзинг всегда прописываю, офигенная штука, которая должна быть по-дефолту, ящитаю. Особенно с флексами.
чет надоело чумаданы кидать:)
Типа в верстке не появляются новые стандарты и подходы
прошло)
а это работает как надо
https://jsfiddle.net/yfe7b4up/
?
>>526564
Анимация отрабатывает и заканчивается. Во втором случае они запускают по очереди
https://css-tricks.com/restart-css-animation/
Разве она не должна при смене класса вызываться повторно в первом случае?
>Разве она не должна при смене класса вызываться повторно в первом случае?
Прочитал
Что ж, видимо, не должна. Спасибо.
В данный момент я съебываю со своей работы и ищу себе замену.
Будешь заниматься версткой и наполнением (контент-манагер, ага) за 50к/мес (возможны доплаты за переработки). Работа абсолютно непыльная, но в придачу идет начальство, так что более, чем на полгода не рассчитывай (тебе же надо развиваться, ага). Если в самом-самом начале пути -- велкам, пиши на мыло пару слов о себе, если хоть немного честолюбив и уже что-то имеешь в запасе из скиллов -- лучше пойди на более перспективное место.
kK5Ke1evraANUSoutloJG/okPUNCTUMc,\xom
Олсо, тред не просматриваю, потому если есть впоросы -- почта.
Ты бы хоть город указал. Или удалёнка? Я бы подрядился, но ещё ничего не умею.
Тридцать четыре: (
Грустно что не попробовал раньше
Но в любом случае я ничо не теряю... 15 дней в месяц все равно свободны, могу учица
А ты хули хотел?
Итс тру
Въебывал 5 за 25. Так что у тебя еще все впереди.
Так, проебался немного с описание, добавлю
Город: дс, серая/оранжевая ветка верх, минут 15 на автобусе
Удаленка не предусмотрена.
Как развитие данную работку не ищите -- только если СОВСЕМ НЕТ скиллов, то можно здесь чуть поднять бабла, если хотите, чуть поднакачать скилл (учителей здесь нет, все самим, никто подсказывать, чо делать, не будет), благо над душой не стоят и можно делать свои проекты, и после съебывать отсюда.
50к за стандартный день с 9-18, хотите сидеть до 21 -- сидите, будет доп.оплата, но делать тут нехуй. Всем, кто ответил на почту, спасибо, я отвечу в письме еще.
>. Джуну фронту надо либо макеты с вменяемой клиентской логикой
Что такое клиентская логика?
Понял, благодарю.
Пацаны, а вот так можно username.sitenam.github.io, работать будет? Или как правильно сделать, чтобы много сайтов залить.
>username.sitenam.github.io
нет, этот домен автоматом создается
>Или как правильно сделать, чтобы много сайтов залить.
далешь в нескольких репах ветку gh-pages и у тебя будет типа:
username.github.io/project1/
username.github.io/project2/
Можно. Только index.html обязательно создать и ветку gh-pages.
Попробую, спасибо.
Подозреваю, что все там по центру. text-align центрует твою ссанную пятерку, но из за ширины ты этого не видишь. Можешь попробовать увеличить ширину этого td и посмотреть. Но вообще там этот text-align: center нахуй не уперся. Делаешь отступ паддингами и все.
И хули паддинги? Какая нибудь пизда будет менять инфу потом и все пизданется, я то и бр могу сделать и хуй забить.
Ну так, а потом не скажут, что это я хуйню сделал и весь интерфейс пизданулся?
Переполнение контентом, например.
делай ширину для обертки - будет больше возможностей управлять всем этим дерьмом, если делаешь адаптивно. Брки могут сломать тебе вид на малом разрешении если, например, перенесется слово перед бр. Получится строка из одного слова.
Я же просто спросил, это норм, если я там юзаю бр, или стоит делать размеры с оверфлов, чтобы ебанутые мани все не похерили?
Не норм. Уменьшай окно пока не перенесется крайнее слово.
http://codepen.io/kotokrad/pen/pypGoy
И вариант без бр
http://codepen.io/kotokrad/pen/dMJaPj
не понял, к чему оверфлоу
Сука, ты че, поехавший? Каким образом все пизданется при использовании паддингов? Задаешь для блока обертки этого текста нужный паддинг справа и все блять. Если кто - то потом добавляет текст - он переносится автоматически и не надо никаких бр.
Ну так учат люди, что не так?
Напомните кто пожалуйста, в каком именно уроке рассказывают, как живую карту прикрутить, я что-то найти не могу.
Не, мне просто нравится, что вы даёте советы и ещё и спорите.
Обертки с паддингами, для каждого блока это просто топ кек
> заказчик орет
Манька, плиз.
Во-первых, текст слоганов/описаний/заголовков/хуй-знает-как-это-по-русски-называется не переносят рандомным образом никогда. Его переносят после определенных слов, чтобы остался "ритм" предложения, и чтобы оно не начиналось с предлога, например.
Во-вторых
>задаешь для блока обертки этого текста нужный паддинг справа
Нужный это какой лол? При одном тексте он будет один, при другом совершенно другой. Как во втором случае с этой картинки >>527213
ты решишь это паддингом? Никак.
99% операция с пересоном текста делаются через брки.
Конкретно в этом примере надо учитывать, что дизайнеры - долбоебы. Да, можно ебнуть перенос и пусть ебутся, как хотят. Но вообще достаточно задать паддинги, чтобы текст не прилипал к краям. "Скрупулезно" все равно не влазит в ширину текстового блока с паддингами и перенесется.
другой анон
Ну так и в верстке для каждой задачи можно придумать кучу способов решения разной степени паршивости.
И в чем проблема обертки с паддингами? Ты же, наверное, оборачиваешь текст в абзацы, вот им и задай. Явно же более универсальное решение, чем бр везде хуярить
Красненьким - паддинги, слева-справа пикселей 10, и сверху-снизу пикселей 30. "Скрупулезно" и другое длинное слово автоматически переносится на новую строку.
Логического смысла в переносе строки "для вашего сайта" нет, пусть дизайнер идет нахуй, текст и так красиво встанет. И ничего не поедет, даже если сеошные дебилы, например, захотят прям в этот блок захуячить статью с ключевиками на 1000 символом..
анон, я в прошлом треде тебе уже скидывал готовый говнокод, лови ссылку снова:
https://jsfiddle.net/oszis113/wn996b42/
Ну и вообще элементы не выделяются в принципе.
Ага, уже разобрался, спасибо.
Громов говорил что если блоки явно одинаковые должны быть и это никакая не концепция - он берет стили из первого появления и применяет ко всем остальным. (это про размер и отступы шрифтов, размеры блоков и т.д.).
Верстка хуйня, ее за год спокойно освоит даже умственно отсталый.
Время, проведенное с удовольствием, не является потраченным.
А потом ты переходишь на следующий слайд и видишь что слова там переносятся уже за пределы паддинга сделаного ИМЕННО для первого слайда.
Блять, верстаю щас макет мухосранского дизайнера и там пиздец, высота у всех шрифтов разная, где-то вообще ее нет, размеров шрифтов штук 10 вообще нахуй.
Ну, не знаю... Вместо игр,и фильмов будетучеба...
За вчера пять разделов в академии прошел, мне понравилось, интересно, и дается легко. У меня склад ума аналитический, математику в школе любил. Айкью высокий. Альтернатива только на вышку идти... Но это пять лет ради корочек... К 40 годкам..
Бля ну че ты как диб)))) Зайди в аську проверь хуле
А я после вышки вот изучаю. Причем вышка техническая. Просто то, что преподавали не особо нравится
Думал, что будет норм. Тем более знакомый, который учился до меня сказал, мол будет дохрена программирования (что ему не нравилось). На деле - дохуя математики (что не нравилось мне в свою очередь)
Ну и да, фронтенду как таковому я хз даже где найти чтобы обучали. Так что в любом случае будет то, что тебе не нравится, если пойдешь на вышку
Бля, я на листовках, когда в школе учился, 150 в час получал. Что-то у меня разрыв шаблона.
Ясен хуй на некоторых днищеработах можно поднимать больше чем верстала, но у версталы есть рост, а на днищеработе его нет.
По-моему это как раз та сфера, куда приходят самоучками. Ну или максимум курсы типа хтмлакадеми. На ютубе смотрел видеоуроки на одном русскоязычном канале, автор в комментах сказал, что учится на веб девелопера. Видимо не в РФ. Но не рекомендует убивать время на такое официальное обучение.
>>527589
Ну потому что я ж типа умный, илита, пойду вузик закончу и буду в офисе за 100 к сидеть.
Ну, так думают, в основном, мамки юных абитуриентов.
Кстати есть вообще вузы в рф где можно выйти йоба-погромистом с изучением актуальных и прибыльных языков а не всякого древнего говна мамонта?
А нельзя просто после изменения в коде нажать ctrl + s и обновить свою страничку в браузере?
Может, ВШЭ какая-нибудь.
Тут ты прав. Да и версталой гораздо интереснее, чем стоять как еблан с бумажками на улице.
>>527589
Не, у меня немного другая ситуация. Хотелось чтобы было больше ооп, алгоритмов, шаблонов проектирования, архитектуры и т.д. и т.п.
На деле: интегральные исчисления, матан, дифуры, матфизика, прикладные задачи матфизики, механика сплошных сред и т.д. и т.п. Из программирования: основы на с++, подсчет формул на фортране и спецкурс по 1с (лол), и более-менее норм - это курс по реляционным БД и компьютерная графика (рисовали объектики - вершиной изучения материала был анимированный трехмерный бокальчик с вином, кек). Из верстки был html таблицами (лол). Все остальной одна сплошная ебучая математика. (из нее мне кстати нравилась мат логика, дискретка и первая часть тервера где больше комбинаторики чем тервера и то мне оно нравилось так как я любитель покерка)
https://chrome.google.com/webstore/detail/livepage/pilnojpmdoofaelbinaeodfpjheijkbh я заебался уже вбрасывать это почти в каждый тредж.
1) Ставишь
2) Включаешь
3) жмешь ктрл + ы в саблайме
4) ??????????????
5) PROFIT!
Лол, как раз не поступил на айти-специальность по той причине, что там гора всякой математики. Может, я просто неосилятор-гуманитарий и вообще не прав, но по-моему она там нужна куда меньше. А больше надо уделять внимания практике современных языков, работе с реальными проектами, которые действительно заказываются в этом грешном мире и т.п
Перечитай плз мое сообщение.
Спасибо огромное.
> Напомните кто пожалуйста, в каком именно уроке рассказывают, как живую карту прикрутить, я что-то найти не могу.
Все еще не могу найти, лол. может я удалил случайно, в каком уроке это было?
дополнительные материалы к интенсиву из шапки смотри
В гугле рассказывают обо всем. За то время, пока ты ждал здесь ответа, мог бы три раза во всем сам разобраться.
https://www.youtube.com/watch?v=zk65S52Bv7s&feature=youtu.be&ab_channel=ЕвгенийЛитвиненко
А зачем там гул, что он делает? И чтто за редактор у етбя?
Я хоть и неофит, но вот эти пару ссылок посмотри, спрайты быстро пилить, там и координаты все. А авакод - убергодная хуйня для верстки.
http://spritegen.website-performance.org/
https://avocode.com/
и еще, если кто заметил что я что то неправильно делал, дайте знать
и вопрос по поводу, сколько времени мне еще аутировать перед тем как не стыдно будет откликаться на вакансии ?
А также сколь времени матерый верстала будет делать то же самое ?
ide: https://www.jetbrains.com/webstorm/
ты про галп я так понял ?
sass компилит, компасовские либы подключает и es6 => в 5 транспилит, точнее будет когда я буду скрипты прикручивать, картинки там оптимизирует автопрефиксер и т.д
ну короче я ж не html код пишу а использую шаблонизатор http://jade-lang.com/
то же самое с http://sass-lang.com/
а за ссылки спасибо, я щупал авокод летом прошлого года, он не умел line-height показывать и еще были какие то косяки со шрифтами
можно и в саблайм наверное, я его не юзаю а автопрефиксер как ? ща глянул на packagecontrol.io там есть, но он их в моем коде делает а не на выхлопном
Бляяять, хуй с ними с флексами, как можно еще это сделать, сойдет любой спосоБ, похуй уже, аноны, помогите!
Сделал короче на флоатах, похуй, если кто на флексах сможет, напишите.
Я бы тупо обертками запилил. А внутри уже определял количество картинок, довольно удобно за счет флексовского стретча по умолчанию. Можно в обертку хоть одну, хоть четыре заебашить, выбрал ширину и готово.
Интересно, давно юзаю флексы, но не знал про эту фишку с сочетанием column, wrap и недостаточного размера контейнера. Спасибо.
Для одной страницы main-catalog для другой inner-catalog, например.
мимо-диванный-знаток-бэм
Сделай. Или ты абстрактно выдумал?
В любом случае модификатор должен описывать свойство которым элемент или блок отличаются.
ну скажем размером:
card--small
или по классическому БЭМ
card_size_small
А ну правда еще добавлю что видел и версии типа таких. Например:
card--preview (ну то есть в зависимости от назначения)
Но тут в обычный БЭМ у которого обычно _ключ_значение не перепишешь наверное, по крайней мере я не могу быстро придумать
Короче на примере было бы проще
Я гуглил, пробовал <meta name="viewport" content="width=device-width, initial-scale=1.0"> но по сути никакого толка, чет вообще нихуя понять не могу.
https://marlengromov.github.io/nerds/
>>527855
>>527860
> абстрактно выдумал?
Да.
Как бы блок каталог, на одной странице он просто как блок с надписью, а на других у него всплывающий список и типа иконка возле надписи.
Вот на главной он просто catalog, a на другой странице его иначе как-то нужно подписать, я до этого всему прописывал классы, чтобы анб были, но как-то программист говорит, типа можно ли в боди прописывать класс, а потом через .нейм-боди .хуйня-нейм стилизовать, говорит гемор ему, что потом разные шаблоны при программировании, а я обычно писал .каталог_нейм-боди. Вот я не знаю, правильно ли я делал или нет?
Нихуя не понял про каталоги твои. По идее блок каталог содержит в себе товары а не просто блок с надписью
Короче не въезжаю я че тебе надо, сорян (походу надо пойти проспаться)
А вот про metaname скрин тебе
Ну проблему решил быстро конечно, но оцените насколько это костыли. Вставляю свг инлайн в jade-файле с помощью unclude. Даю обёртку класс и через него даю свойства свг. Нормально?
Благодарю, а откуда скрин?
Хорошо. Почему тогда я напрямую через редактор установил зелёный цвет, в первом варианте сработало, во втором нет. Так с иконкой которую дают в макете интенсива и со скачаной с интернета. Уже и stroke прописывал.
Не помогает пик, боди 900, а задал сперва столько же, потом больше, один хуй все пидорасит, что не так?
Лол, а если неадаптивный?
Чет проебался я, проверил - правда наследуется. Залей на кодпен, понятнее будет
Спасибо. Ну конечно же сравнив я заметил что там "предустановлено" значение филл. А то что оно не меняется так должно быть? Прям как константа.
Ну так оно действуют как все правила ксс. Если у тебя где-то наверху написано одно правило, а потом на самом элементе другое, то именно ближнее будет работать.
текст тогда будет пропадать, алё
Эхехе ты захотел, конечно как ты хочешь НЕЛЬЗЯ, это просто не логично. justify только к тексту можно применять, явно не к li, nav и тому подобное..
Какого хуя last-child у nav а не у li nav? Во-вторых хуй знает как тебе помочь. Тут либо паддингами отбивать (может не совпасть, либо установить фиксированую ширину у li, тобишь в твоём случае width родителя делим на 7.
Хватит свойств для этого блока? Или всю страницу в песочницу хуярить?
Да я уже погуглил, там же написано: "Данное свойство носит черновой характер и при валидации документа на CSS3 выдает ошибку."; Не хотеть верстать невалидно. Неужели нет способа, чтобы пофиксить это? Я просмотрел базовый, вроде не было таких ситуаций
пример на скрине туповат. Думаешь будут настолько длинные слова, что выйдут за границу блока? Обычный текст нормально перенесется по слову. Ну а шоб наверняка - >>527969
Да даже не конкретно для этого примера хочется сделать, а в общем научиться и понять, чтобы в будущем использовать, если вдруг придется. Ну, в ляюбом случае, спасибо за участие.
Что, собственно, нужно? Не хочешь делать адаптив - удали мета-тег viewport, тогда мобильный браузер при необходимости включит зум и всё будет выглядеть стандартно херово. Но лучше, чем было.
Вот что без viewport >>527606, нихуя не нормально, а барбершоп нормально показывает, я нихуя понять не могу.
Это нормальное поведение для не адаптивной страницы. Браузер по-твоему сам должен скукоживать фиксированную страницу под разрешение телефона?
Скинь тогда уж ссылку на барбершоп.
Сорян, туплю. Мб на телефоне пробелы между инлайн-блоками шире, из-за этого всё едет. Попробуй их удалить
Завтра буду ебать размеры и падинги.
Вот эта хуйня помогла <meta name="viewport" content="width=device-width, initial-scale=1.0">, но другое пизданулость.
Это понятно.
>Задачу описываем четко, код показываем только в песочнице тут не экстрасенсы сидят нам нужно пощупать код, иначе никто не поможет Аноны с кодом в постах, на скринах, в архивах, сразу идут нахуй. Вас предупредили.
http://codepen.io/
https://jsfiddle.net/
100% вариант - залей страницу на gh-pages
Мы тебе ванги или что? Скинь пример кода, где у тебя маргины не работают. И верстай на флексах.
Вот такая элементарная хрень: https://jsfiddle.net/aypzt6fs/
Скорее всего я туплю, но не могу допереть никак. Вот здесь по-моему идентичная вещь, но работает: https://htmlacademy.ru/courses/44/run/18
Флексы или display table. В интенсиве про это есть
Я хотел было сказать, что ты тупой, но я просто не выспался и злой, поэтому извини, хоть я этого и не сказал.
В общем, суть такова: ты задал display: inline-block КОНТЕЙНЕРУ своих ЖЕЛАЕМЫХ инлайн-блоков. И потом ЕМУ задаешь маргин. А внутри НЕГО у тебя обычные ссылки, которые ты вообще никак не стилизуешь. Вот для наглядности, добавил второй блок в твой же фиддл (и подкрасил его): https://jsfiddle.net/aypzt6fs/1/
А вот как это должно быть:
https://jsfiddle.net/aypzt6fs/4/
И это, на будущее. Классы-айдишники всяким инпутам, ссылкам, баттонам и прочей хуйне пиши самым первым атрибутом, а то заебывает среди этих "href=", "type=text" и т.п. искать класс.
Да не за что. Ты по теории не загоняйся слишком, лучше верстай. Хотя бы барбершоп с нуля, например.
А, ну делай, потом залей на гп-пейджес и скинь сюда, авось кто и обосрет подметит косяки.
Я когда верстал нердс и седону, аж блевать хотел. Такие-то кривые макеты, риалли. Я уж было подумал, что верстка - это не мое, но потом накачал йоба-макетов с просторов интернетов - и пошло-поехало.
Ты про эти кнопочки? Я их инлайнами и запилил в свое время, пикрелейтед.
Сейчас смотрю, и понимаю, какое же это топорное говно, которое нахуй съедет при попытке сменить размеры враппера, например. Только флексы, только хардкор.
Олсо, проиграл со своей псевдо-бэм разметки. А ведь прошло всего пару месяцев.
Ну у тебя там еще какой-то псевдокласс прилеплен, с бэкграунд позишном, я хз как ими пользоваться пока что.
Это говно методика, на самом деле. Сейчас я бы так ни за что не стал делать, препроцессоры и прочие шняги в помощь.
Просто как пример того, что на инлайнблоках вполне можно заверстать.
Я всю седону (базовую, неадаптивную) на инлайнблоках сверстал, ох и заебался же я. Но было забавно, конечно.
Да в принципе всему, что связано с собственно версткой.
scss, немножко лесс, ну БЭМ-хуем, само собой, флексы, адаптивность в сочетании с резиной, grunt, gulp и все, что к ним прилагается (постцсс плагины, блочная модель верстки и т.п.), свгшки даже сам порисовал.
Единственное, что я не юзал - jade, ну и ретинизацию изображений (тут не столько лень или нежелание, сколько тот факт, что готовые ретинизированные изображения шли только к седоне, а меня уже белвать тянуло от этого голубого ГОРОДКА В АРИЗОНЕ). А, еще фреймворки только мимоходом глянул. На бутстрапе, в принципе, сверстал один лендинг, не понравилось. Фоундейшены и прочее не стал даже пробовать.
Добавлю, что за все это время я сверстал буквально 5 макетов. Из них один - адаптивная седона (на ней я все и освоил, тащем-то. Т.е. вообще все). Дальше идет очень легко и красиво.
У тебя был кто-нибудь с кем можно посоветоваться или все сам? А то у меня уже куча вопросов, как решать не знаю.
У тебя же есть двач, здесь все твои друзья!
Ну тогда держи в догонку еще один тупой вопрос от меня. Короче не работает почему-то маргин опять же. Нужно отступ, который на пике показан сделать. Здесь вроде как с контейнерами все правильно ну я надеюсь. Работает если только маргин прописать элементам из верхнего блока.
https://jsfiddle.net/rLy88cue/2/
Черт, мне казалось что клирфикс работал, сейчас убрал этот пробел и вся сетка съехала к хуям. Из этого судя по всему и другая проблема вытекала. Спасибо большое, буду дальше строить. Сам бы хуй додумался.
В инспектор в браузере смотри когда не понятно что-то. Конкретно в этом случае, если бы сработал там бы в разметке появился :after элемент в конце блока
Никто ж не мешает писать файлы .sass рядом с .scss, если не собираешься изменять код бутстрапа, что само по себе плохо
У тебя клеарфикс не работал, но тебе уже и так ответили.
А еще присоединюсь - юзай кодепен, фиддл неудобная шняга.
http://codepen.io/anon/pen/aNqvbP?editors=1100
Вот именно, codepen удобнее
Вроде как нужно сначало логику в cms сделать, а потом тему-дизайн делать. Посмотри как сделать сайт за 5 минут на вордпресс, таких видео как грибов после дождя.
Только это и прибавляет.
Я не устал, зачем?
Да у меня уже поздно, но да, на сегодня однозначно хватит.
Вот только работать она будет, если высота флекс-контейнера прописана явно. Если высоту не задавать, то работать не будет.
Еще есть вариант вставить еще блок с отдельной иконкой для мобильника и десктопа и в стилях убирать один и показывать другой. Что делать?
По сути это и есть слайдер, только вертикальный. Если ты можешь запилить горизонтальный, то сможешь и вертикальный. Если нет, просто прикрути fullpage.js за 2 минуты.
>что я, в принципе, могу уже сверстать что угодно
А вот с этого проиграл.
Кстати, это же детище твиттера. Зашел на твиттер, просмотрел бегло код и не обнаружил никаких признаков того, что они сами его используют.
Там нечего учить, это просто набор готовых компонентов. Заходишь в доки, копипастишь что тебе нужно и всё.
Разобрался
Насчет номера два сомневаюсь что правильно ибо вобще сообразить во что обернуть стоимость.
Я сам конечно кьюфаг, но почему бы справа всё это описание товара не обернуть в тег <section>? Алсо если я ошибаюсь, то поясните за <section>
Так меня это и волнует, как в таком случае этот макет размечать? справа <section> слева тоже?
Есть вообще где-то годная статья для самых маленьких о семантических тегах с подробным разжевыванием и примерами?
Буду благодарен.
И сразу еще один наитупейший вопрос. Как разметить
>есть в наличии артикул:dexter ae
Я так понимаю для артикула нужен будет отдельный класс. можно ли сделать типа
<p class="lol">есть в наличии артикул:dexter ae</p>
А потом в классе потставить отступ слева и изменить цвет? Или как? Туплю пиздец.
а что плохого?
я предлагаю пикрелейтед. Чужой код в scss, и пусть таким и остается, а свой в sass пиши, если тебе так удобно а это очень удобно
Ну да, одна, не то имел в виду. Соси.
В css ничего сверхъестественного нет:
.logo {
width: 368px;
margin: 0 auto;
outline: 1px solid;
margin-bottom: 80px;
}
При этом если смотреть сам контейнер (пик два), то у него другая высота, файрфокс даже дробную (208,5px) показать может.
Сорри, что тут текст бросаю, кодпен почему-то не захотел привязываться к учетке гитхаба.
Почему? А value тоже надо было?
Ну да, что-то я засыпаю. Value нужны если будешь через Js получать их значения.
сам верстаю недавно (месяца 2), решил не ждать пока выучу все и стал напрашиваться на собеседования как только моя верстка перестала вести себя неадекватно в браузерах, многие отказывают сразу же, кто-то после просмотра выполненного тестового задания, на пару собеседований таки удалось пробиться, после которых тоже отказы. писал парочке вебстудий на имейл с просьбой о стажировке (неоплачиваемой), игнор
Тут много кто на работу устроился, но это как правило люди что-то действительно умеющие. Причем это касается не только вертски, но и JS. Учись дальше.
Ну а хули ты хотел, пока не выучишь хотя бы джиквери и базовый джс + интеграция с несколькими цмсками - хуй тебя куда возьмут
Тут каждый второй как ты, думают ЩАС ЗА 2 МЕСЯЦА ВЕРСТКУ ВЫУЧУ И ПОЙДУ ДЕЛАТЬ БАБКИ
Ебашь адаптивную седону же, твои фикс. страницы нахуй не нужны никому, и еще пару сайтов где ты сам на джсе всякой йобы нахуячил.
хуле тебе понятно, вася блять.
Не уверен что до конца понял принцип взаимодействия с дополнительными библиотечками.
Щас их ведь никто вручную не ставит правда? Все юзают пакетные менеджеры.
Я npm пользую, он все складывает в node_modules. На интенсивах не раз упоминали что node_modules надо бы добавить в .gitignore, что впринципе, логично, забивать репо лишним весом типа плагинов к таскраннерам, коих может быть овердохуя, и которые к тому же могут обновляться - не лучший вариант.
Меня интересует вот какой момент. Что делать с библиотеками, которые необходимы для функционирования сайта? Простейший пример что без лишних выдумок объяснений - тот же нормалайз. Его тоже швыряет в node_modules. Если, допустим, я хочу чтобы мой проект нормально отображался на gh-pages без особых фиксов типа в продакшене, то мне придется либо вытаскивать его отдельно, что есть гемор и отказ от профитов npmавтоматом не обновится и т.д., либо пердолитья с точечным игнорированием папки node-modules, что тоже выглядит слегка стремно.
Прошу помочь в разъяснении как лучше это сделать, и как это принято делать.
И правильно ли я понимаю что совет отрезать node_modules через .gitignore основывается на делении версии на девелопмент и продакшн. То есть продакшен они потом все равно перелопачивают, подключая нужные библиотеки отдельно.
Как вариант - ставить жс библиотеки, шрифты, css и прочее через bower он для этого и создан. А через npm - только библиотеки/инструменты для разработки.
Также, если используешь галп (не знаю, есть ли такое для гранта), вместо того, чтобы ссылаться на файлы в bower_components, можно вытаскивать их с помощью main-bower-files.
Не слушай этого >>529926, bower умер. В твоем примере с gh-pages можно сделать так: локально ставишь либо, таском для gulp собираешь билд, пушишь на гитхаб и вуаля. В таске уже можешь прописать, мол сходи возьми нормалайз из node_modules и запердоль в общий css и положи туда. Как-то так, если я верно понял вопрос.
Расскажи почему бовер умер или дай линк на статью - интересно.
Алсо, к твоему ответу для >>529910 добавлю, что ставить клиентские либы через npm принято с флагом -S (--save), чтобы сохранять в dependencies вместо -D для devDependencies.
любитель бовера
>Расскажи почему бовер умер или дай линк на статью - интересно.
https://twitter.com/nachocoloma/status/663622545162280960
Спасибо
Почему ты думаешь что он тролль? Такая себе хохлореальность у него, не как что-то плохое.
Да просто почитай, что пишет этот уёбок.
Алсо, ты кто? Небось abc? Если да, то ты даун, т.к. он тоже даун.
>Небось abc?
Лол нет, abc стартапер из бульбингема, ему 14, не суди его строго, няша.
Расскажи что тебя так не устроило в показаниях нашего хохлодруга
раз пять в разных местах на протяжении последних 10 лет. точно не помню где. результат плавал от 120 до 131.
А див у нас уже нечто отдельное от html? 0_О
Ну это понятно, так я маргин задал для всех элементов сразу, не буду же я отдельно каждому прописывать. Вот так:
.products-item {
display: inline-block;
vertical-align: top;
margin-right: 75px;
margin-bottom: 80px;
}
.product-item:nth-child(2n) {
margin-right: 0;
}
уберет у каждого четного(второго) правый маргин
Завтра первый рабочий день в конторе. Сказали, что нужно использовать Bootstrap, но я раньше верстал только традиционным способом, блоками с использованием каноничного css.
Почитал на оф. сайте о колонках Bootstrap.
Интересно, а что делать, когда какой-то блок вмещается в нецелое количество единичных колонок Bootstrap?
Можно ли выставлять (менять) ширину Bootstrap-колонки?
Что делать, если нужно больше 12 колонок?
На webref есть хороший, годный туториал для самых маленьких. Сам сверстал (сугубо из интереса) адаптивный макет по этой маленькой справочке.
Величина колонок настраивается, можно ебануть 24, например.
Ах, да, забыл про платиновые вопросы.
Как устраивался, что знаешь, сколько учил, сколько платят, какой город?
Я уж думал самому спрашивать придется.
тоже интересно послушать. оп, поделись
Ну если так интересно...
>Как устраивался
Рассылал резюме куда только можно включая на оператора линии, но это не то вот и пригласили
>что знаешь
Всего по чуть-чуть: джава, php, C++, javascript-html-css, python
>сколько учил
Сколько хотел, столько и учил, просто ради удовольствия. Я мог бы сидеть дома и сычевать на зарплате родителей, но как-то неловко
>сколько платят
обещали сто долларов в месяц, может и больше.
>обещали сто долларов в месяц, может и больше
Лол, ты чем там заниматься вообще будешь? Картинки на сайт заливать?
Я бы за сотку бачей даже отвечать им на письмо поленился.
Да нету никакого портфолио у меня кроме личного бложика на бесплатном хостинге куда я сбрасываю всякие свои эксперименты.
Собеседование проводила девочка-эйчарочка, которая не могла произнести названия технологий, с которыми нужно работать.
Зато сразу огласила, что придется разгребать сначала много проектов.
Если он может в HTML/CSS плюс JS, да еще и с примесью серверных языков, то просить меньше 3-4 сотен - себя неуважать.
Не поломойкой нанимается.
Это если он действительно что-то умеет, а не просто поковырял и дропнул все вышеперечисленные техи. Тогда он не умеет нихуя.
город?
сам когда ходил на собеседования, то сразу разговаривал с директорами и начальниками отделов - даже блять завидую, что опчику попалась hr дама
Город не скажу, стесняюсь.
Я не ОП.
>сразу разговаривал с директорами и начальниками отделов
Так даже лучше чем с эйчарочками. Обычно они могут много рассказать, после наглого вопроса "А как правильно?". HR-дама ничего не скажет.
Просто там небольшая фирма, десяток девочек-сеошниц-дизайнеров-администраторов и пара кодеров.
ну как-как, спрашиваешь, как строится сетка? Ну как-как, вот классы беру из бутстрапа, вот так и строится. И так во всём.
Какой же я тупой и чего я повелся на то, что даже полный даун может вкатиться. Даже в базовых курсах ничего не получается.
Я тоже так думаю, но выпилиться духа не хватает.
Усидчивость, внимательность, умение гуглить, интерес к данной деятельности, логика (у меня этот пункт много чего включает и довольно широк). Это вроде как все, что необходимо.
После этого наткнулся на такую делему: стоит ли убирать авто-закрывание у таких тегов как <li>, где закрывание тега не обязательное (Если после элемента следует <li> или он последний у родителя).
Так вот, как часто вам встречаются такие моменты, где нужно обязательно закрывать этот тег?
Может стоит просто забить и поставить обратно авто-закрывание для <li>?
С логикой плохо, когда глянешь чей-то код, то понимаешь как все просто оказывается, но сам я не могу решений придумывать.
Ну если интерес есть, то значит надо тренироваться в решении задач по каждой конкретной теме - со временем начнет получаться. Так же запоминать чужие решения (со временем накопится такая себе база знаний и будешь понимать - что это штуку можно сделать так, а вот эту - вот так)
Можешь кстати в свободное время еще задачки на логику всякие порешать.
Надо расшевелить мозг, он натренируется. Естественно, все это при нормальном режиме.
Естественно я запоминаю, но не пользоваться же помощью постоянно. Да и курс скоро закончится, надо будет макеты верстать, хуй знает как справляться. Я вот тоже думал как-то мозги тренировать, может в шахматы начать задротить, лол.
Многовато значений у слова omit. Немогу подобрать нужное для данного контекста.
Я читал код-гайд от гугл, там писалось, что нежелательно ставить, но вот почему - не написано.
Не опускать опциональные закрывалки. Чего тут непонятного то? Так код логичнее выглядит, защита от дурага.
После гугл-гайда, у меня просто возники сомнения на счет этого слова.
Но да, соглашусь, защита от самого себя, наверное, лучше, чем непонятные прихоти от гугла.
Спрайты помогают уменьшить количество запросов на сервер, что положительно влияет на скорость загрузки сайта. Но так было в версии http 1.1
Как обстоят дела с версией http 2.0 - много слухов ходят... Если есть знатоки, просьба пояснить за 2.0
Не сделать 90% колонку...
Действительно, спасибо. С помощью spritegen и imageoptim удалось из 8 отдельных иконок слепить один спрайт, при этом я хуй знает как конечно, но оптимизатору удалось ужать спрайт до 3кб. И это притом, что уже пережатые иконки в отдельных файлах все вместе весили где-то 5кб.
>Где мне найти шаблон интернет магазина
>Можно это сделать с помощью гугла?
Дно задавания вопросов пробито
Я про натягивание шаблона на модэкс.
Миксины вставляют готовые куски кода. Функции, как и в программировании, возвращают значение.
За сотку в месяц? Надеюсь это стажировка или работа 1 через 3. Если так дальше пойдёт то переименовываемся в ДНО-тред ибо даже уборщицы получают больше.
Качаешь книгу Снука и все будет точно по методологии
На codeschool по отзывам есть неплохой вводный курс. И он, как ни странно, полностью free.
А вообще советую параллельно спросить в JS треде в программаче. Там есть чисто ангулярщики, которые на нем сидят уже оче долго. Они наверняка что-то дельное посоветуют.
Мне бы хоть 20к получать, для моей мухосрани хватит.
тестовое задание на удаленку в Москве с очень приличной зарплатой для верстака
Ставлю свое левое яйцо, что вся верстка в этой компании строится на бутстрапе.
Олсо, "поддержка" ие8 вполне может вылиться в красивую сеточку на флексах с полифилами под ие9 и кривеньким фоллбеком на ие8.
Хотя на бутстрапе проще, там даже думать не надо. Знай себе хуячь кучи дивов с роуами и колэсэмами.
ты лишился яйца, на сайте компании бутстрапа нет, что радует, так как криворуких долбоебов, не умеющих на нем писать, дохуя. за одним таким ебланом сейчас переверстываю шаблоны, кстати. ебучую дивянку исправляю, уменьшая количество вложенных блоков.
олсо, по поводу твоей поддержки, нахер надо подрубать полифилл под все ие, потому что там ебаных багов с флексбоксами много, недавно ананасий вкидывал найденные баги в ие11. проще уж написать gracefull degradation под ie9-8 на дивах + html5.
как говорит один мой знакомый фронтенд, работающий в сфере уже больше 5 лет, до флексов еще далеко.
>уменьшая количество вложенных блоков
Пилю много вложеных блоков вложенных в блоки потому что не знаю как иначе
Откуда вы все понимаете, как писать правильно?
Ну хорошо тогда, запили отчетик, если пройдешь. Это если ты собеседуешься, конечно.
Я и есть тот ананасий, если что. И мне нравятся флексы. С ие10-11 можно мириться, я вот приловчился верстать на флексах вообще без минхейта (от него в ишаке все распидарашивает) и с жестким задаванием флекс-базиза (в процентах, офк) наряду с флекс-гроу, если оно требуется.
Хоть убей не пойму, зачем поддержить древнее говно мамонта в лице ие9, про восьмой вообще промолчу. Это к цитате твоего знакомого. Потому и "далеко", что долбоебы продолжают поддерживать дерьмо, которое используют только в уебищных госконторах. Даже у моей бабки стоит яндексбраузер, который отображает и флексы, и свг, и все прочее.
И в догонку - где ты нашел такую вакансию? Почте везде требуется или человек-оркестр, или джун-джаваскриптер, умеющий верстать. А просто версталы никому не требуются а жаль, я бы уже сейчас побежал искать работу, а так сижу и пилю учебные рекурсии на JS, лол
Или это мне придется много маленьких полосок разных цветов одну за другой ставить? Или вообще блять спрайтами/векторами?
у меня раньше такая же проблема была, примерно год назад. потом я прошел курсы html-academy на сайте и добил это их же интенсивами. например, если раньше если нужно было обнулить поток, верстал отдельный пустой блок с классом clearfix. сейчас так не делаю, но в коде, который переверстываю, вижу подобные пустые блоки почти везде, где не надо. а где надо, их нет.
>>531595
мне проще писать на блоках и инлайн-блоках + float, которые поддерживаются, чем писать на флексах ,которые еще не вошли в стандарт, а потом добавлять поддержку в ишаках, пердолинга больше. ну и IE-9 еще не говно мамонта, в нем большая часть верстки отображается так, как надо + нативный js очень хорошо работает. а вот IE-8 да, то еще говнецо, которое бесплатно поддерживают только полнейшие долбоебы.
>Потому и "далеко", что долбоебы продолжают поддерживать дерьмо
это никак не связано. флексы поддерживаются новыми браузерами, они входят в стандарт, но не поддерживаются старыми, на которых сидит еще достаточно большое количество человек. потому на них и мало пишут, что многие юзеры еще не пересели на современные браузеры, а не потому, что мало кодеров пишут на флексах. спрос рождает предложение, а не наоборот. когда люди перестанут сидеть на IE и старых версиях браузеров, тогда все начнут использовать флексы, а сейчас юзая флексы и отказываясь от поддержки IE можно потерять аудиторию. это только на фронтенд-сосаке все кукарекают про флексы, ибо нет еще тут у людей опыта работы и понимания той же верстки как профессии.
>>531599
просто упомянул в резюме на hh, что готов к проектной, постоянной и удаленной работе по всей россии + пораскидал резюме во многие компании, которые и близко не в моем регионе. расчитывал на удаленную работу с возможностью переезда, так и писал.
>>531637
много-много box-shadow одна под одной.
Просто пиздец. Так и думал, что либо градиентом, либо тенью придется.
Да это все понятно. Но вот посмотреть статистику - даже ие10 там на дне. Да и просто логически подумать: ие8-9-10 используют разве что африканские бомжи и секретутки (которым СБ не позволяет другие браузеры ставить). А они нихрена не ЦА любого сайта, в принципе, кроме социалочек и ютубчиков (тут да, не спорю, важна поддержка вообще всего). Так то любая домохозяйка сидит на каком-нибудь клоне хромога. В общем, я могу сверстать все, что я сверстал на флексах, через флоаты/инлайнблоки/бутстрап-грид, но мне приятнее на флексах. Столько костылей отсекается, это же просто рай. Одна справедливая гибкая центровка чего только стоит, мм.
> просто
Понятно, молодец. надо тоже попробовать, я в верстке уже достиг предела, в принципе. Разве что СВГ рисовать не научился
>>531637
Начнем с того, что это явно рак мозга дизайнера. Вырезай с макета всю эту разноцветную полосочку и вставляй через псведоэлементы.
Ну а если хочется изъебнуться, то можно нарисовать СВГ-объект с заливкой по группам.
> вставляй
Ну и на правую transform: scaleY(-1) кажется так должно перевернуть по горизонтали, не помню соответственно.
>многие юзеры еще не пересели на современные браузеры
Browser usage сам загуглишь?
мимо фронтендер
Я те больше скажу, был на собеседовании в конторке, в которой мне задали вопрос "А как вы будете поддерживать ИЕ6??"
Я сказал что не буду, и ушел.
Проектов, в том числе уже окаменевших, все еще хватает, но это не значит что надо страдать хуйней, особенно людям которые учатся. Они этого говна еще наедятся когда устроятся на работу.
А надо было сказать "на табличной верстке" и завысить ожидаемую зарплату в 2 раза. Интересно, они нашли своего раба?
>А как вы будете поддерживать ИЕ6
совсем ополоумели, ироды
Explorer 619,7780.0%
http://www.liveinternet.ru/stat/ru/browsers.html?slice=ru;period=month;page=3
Аноны, у меня от этого говна бошка взрывается. Я уже готов их имгами блять в хтмле нахуярить.
Помогите, молю, иначе я все.
Какие полосочки? Залей код в песочницу и нормально поясни что ты хочешь сделать.
https://codepen.io/sashaslow/pen/ONvWqm
Нужно, чтоб линии перед и за заголовком были как на макете.
Блять оп-хуй, я же специально сидел блять скринил для ньюфагов и нищебродов, а он не закинул в шапку даже https://yadi.sk/d/Ka-aU3poqa8bM
мискузи
Бери самый обычный ноут. Я в центре скупки б.у ноут взял за 10к рублей. хватает за глаза.
У родни есть асер с норм начинкой, но дисплей просто пиздец блядь, углы охуеть, цвет пиздец.
Спасибо тебе, дружище.
добра тебе
По лесс только примеси?
обосрался
Это копия, сохраненная 19 мая 2016 года.
Скачать тред: только с превью, с превью и прикрепленными файлами.
Второй вариант может долго скачиваться. Файлы будут только в живых или недавно утонувших тредах. Подробнее
Если вам полезен архив М.Двача, пожертвуйте на оплату сервера.