Након чудне забуне у последњем видеу о томе које заглавље смо заправо радили, овог пута ћемо заиста применити прилагођено заглавље за страницу Деалс! Ову је урадила Мег Хунт.
Као и сва заглавља, провели смо неко време гледајући оригиналне датотеке и смишљајући како ће најбоље седети на страници. Покушавамо са неколико опција, али на крају одлучујемо да је најбоље ставити у затворени оквир (за разлику од нечега попут Демосовог заглавља где се заглавље топи у обруб око садржаја.
Извозећи га, играмо се са пуно различитих графичких формата. Занимљиво је да је овај стил приближно једнак и по квалитету и по величини датотеке између ПНГ и ЈПГ. Излазимо на 2000пк ширине, што би требало да изгледа добро на било ком екрану. Погодили смо и око 150.000, што је велико, али за овакве графичке јунаке је у реду.
Почињемо с редослиједом достављања предлошка за понуде, укључујући гледање како су понуде појединачна прилагођена поља која се рандомизирају прије излаза. Провешћемо више времена на овом означавању и свему томе касније, али пошто смо у овом предлошку и припремамо ствари за заглавље, можда бисмо га и почистили.
Разматрамо неколико различитих могућности за постављање графике прилагођеног заглавља на страницу. Слика у позадини има највише смисла јер користимо семантику
за наслов и замену слике. Користимо background-size
, проверавамо cover
, али то може довести до пресека. Проверавамо садржај, али то омогућава простор споља. 100%
изводи трик, али мораћемо да направимо оквир са стилом пропорције да би то лепо функционисало. То је лако, али само направимо висину 0 и користимо проценат горњег облога да би то функционисало (подстављена кутија).
Ово је седмо прилагођено заглавље које смо урадили и свако од њих је урађено другачије. Веб дизајн, а? Какво путовање.