Title and button placement for a Saas product

Question

I'm working as a UX/UI designer at a startup where we have a Saas product. Currently I'm working on making improvements on the design made by a different designer.

On our pages we have a Page title with some buttons immediately next to it. Currently those buttons only have an icon with some of them showing a tooltip on hover (but not all of them). I know icon buttons are bad since most users won't know what a button does from just looking at the icon so I'm reworking them to always have an icon with some text.

Now what I'm wondering is what the best placement would be for those buttons. I did some research but was not able to find any best practices or research about this issue. I looked into some other Saas apps and content management systems and I've noticed that a lot of them have the title in the top left and the buttons in the top right. So far I've only found Wordpress having their main button right next to the title. (Though there are probably others who do this as well) Someone also suggested to maybe put the buttons underneath the title but that placement feels a bit weird since on some pages we have a description underneath the title and I also don't want to push down the content of the page.

*(small note, our web app is desktop only)

Here are some of the quick wireframes I made of how some of the other apps place their title and buttons;

And this is how we currently have it;

I'm inclined to put the buttons in the top right. I know consistency is key, so maybe it doesn't really matter where I put the buttons as long as it's the same on all pages, but I also don't just want to put the buttons in the top right just because that's what others are doing.

I think visually it might look best in the top right but I also wonder if that's maybe too far out of sight for the user since you have a title (+ sometimes a description) in the top left and then the page content underneath it taking up the full width of the page.

So I was wondering if anyone has some thoughts, findings, research that they could share about this.

Answer 1

In most cases, putting action buttons at the top right of the page works best. I don't have specific studies I can link, however many large, well-respected design systems use this pattern—likely because they have research to support its effectiveness:

• Salesforce
• Atlassian
• IBM
• Sprout Social
• Stack Overflow

I also want to challenge your opinion here:

I also don't just want to put the buttons in the top right just because that's what others are doing.

The fact that others (many, many others) do this makes it a convention that users know and intuitively understand. I get the impulse to not blindly follow the crowd, and if you have the time and budget to do your own research, you might decide it's worth the investment. If that's not the case however, it's often a safe bet to lean on convention.

Answer 2

I suggest you :

1. if your page is empty CTA under title and description can be good

You can even think about clarify your action with icon and description like this and don't use tooltip

---

2. If it's not an empty page, yes you can have your action on the right but the mouse flow is painful.

The left side nav bar is often used to display title and breadcrumb navigation like notion