Hello guys im creating a site for a cat breeding company. The site is 95% users on mobile web browsers. How can I make the Information section more beautiful. Do you see any other things I could change on the page?

Profile page

1 Answer 1

  • Increase the contrast on your greys (darker text).

  • Probably don't italicize the main title.

  • Use some iconography for easier visual skimming. ♂️ Male, etc. (Ideally an icon font rather than emojis since the latter will look different on different devices.)

  • Avoid unnecessary labels for data if possible. Words like "male" and "fertile", especially when supported with icons, are self-explanatory without a category word. In other words, instead of "Fertile: Yes", just "🌱 Fertile" or "❄️ Infertile". You can always keep the information via title text or more accessible tooltip-style things, e.g. a little 🛈 that when you hover or click on it shows text like

This cat is fertile. It can contribute DNA to kittens.

  • Where you do have categories, differentiate them in the typography. That can be through bold, underline, italicize, capitalize, font choice, font size, etc. Or it can be through spacing — I particularly like to use a single width for my labels for a cleaner look. (This can contradict the above about dropping labels; you'll have to play around to find out what looks best.)

A couple of hasty mockups to get you thinking...


Not the answer you're looking for? Browse other questions tagged or ask your own question.