# 103: Област за фрагменти за фотошопиране - CSS-трикове

Anonim

Време е да се потопите в района на фрагментите! Тоест действителната област на съдържанието му. Вече имаме заглавката на място. Областта с фрагменти е доста популярна. Без да се задълбочавам в аналитиката, от гледането на социалните медии и от реалния живот знам, че намират много полезни неща в тази област.

Във v9 много често срещана и легитимна критика беше, че е трудно да се разглежда. Това беше силно оцветен акордеон и всеки фрагмент беше „балон връзка“ (поради липса на по-добър дескриптор), който съответстваше на основния цвят на подсекцията на този фрагмент. Още по-лошо, те бяха подравнени оправдано, което мислех, че би било подходящ начин да им дам малко пространство и да поразгледам малко, но в крайна сметка изглеждаше странно и небрежно.

Нека се откупим тук и направим областта на фрагментите по-приятна за разглеждане. Въпреки че отново голяма част от това съдържание се намира чрез търсене. И все пак, може и да го направи хубаво да разглеждате.

Веднага решаваме да не поставяме поле за търсене точно в областта на съдържанието. Имаше в миналото, но това е препроектиране и ние вземаме решението да обединим търсенето в една област. След като веднъж научите как да използвате търсенето, ще разберете как работи завинаги.

Що се отнася до дизайна, ние използваме нещо с две колони. Вляво, основните категории Snippet, всяка с уникален цвят. Време на дъгата! Разглеждаме нашата собствена галерия за вдъхновение.

В дясната колона просто ще има списък с фрагментите в тази категория. Просто, лесно за разглеждане. Подобно на връзките на долния колонтитул. Хората знаят как да сканират и използват списъци с връзки. Това е най-съвършено простият модел на дизайна, който съществува.

Забъркваме се с някои дизайнерски решения. Трябва ли връзките да съвпадат с цвета на раздела или просто да са сиви? Трябва ли да „ивицираме зебра“ на връзките с избледнела версия на основния цвят? Трябва ли да включим дата на публикуване или актуализирана дата или нито едно? Забавни и важни неща, за които да помислите, но винаги можем да вземем такива решения, щом стигнем до браузъра и работим с реални данни.