Join the Webstudio community

Updated last year

Link VS Button Solution

At a glance
I had an idea to solve the confusion between links and buttons.

We could introduce a "link button" component, which is basically a link with pre-made button stylings.

Then we can rename the button component under forms to "submit button"
Attachment
image.png
T
O
M
24 comments
Thanks for the suggestion!

A couple issues with this. We aren't limiting the Button to Forms like Webflow does. There are a lot of valid uses for a button. "Submit" is just one button type.

We also don't want to mislead people by calling links buttons. The root of the problem is that users have been incorrectly trained to think that buttons are links. We want to correct that misunderstanding, not conform to it.

The solution we have is to add component descriptions to the top of the settings panel, like Figma has.
yeah, this will lead to even more confusion
confusion is really not on our side, its webflow's bad naming
I want to make a separate video "Link Or Button"
and politely tell user that webflow tought you a wrong thing
but yeah, we need to also add better tooltips and descriptions
and most likely will still find confused users
Specifically the problem with "Link Button" so is that a link or a button?
What you really want is a Link that looks like a button, so first of all it would be Button Link and then its still gonna confuse people what is it.

"Button-like Link" is the closest thing I can think of but as a component name its pretty terrible
Additionally it means that this component would be purely about styling, which shouldn't be the case if we creat a component.
ok, I guess it's a no then
Open to more suggestions now that you understand the nuance of this problem!

WYT about a little notification message in the Settings for buttons? @Oleg Isonen
Buttons are basically advanced components that should only be used by devs who know how to use them. Outside of our Form & Radix components, you need to know some JS to properly use a button. So a hint may be warranted to help out those beginners who keep getting confused by buttons vs links.
Attachment
Screenshot_2023-11-17_at_10.18.05_AM.png
I like putting that there because they'll definitely see it when they go to style the button.
Attachment
Screenshot_2023-11-17_at_10.28.00_AM.png
Dismissible so it doesn't annoy the experienced devs
you need to know some JS to properly use a button.

Not quite, once we have interactions you can use them visually
Buttons are basically advanced components

Wouldn't call them advanced. They are not more advanced than links
description seems good to me
btw we could have a command that turns a link into button-like link by setting a bunch of css
"Convert button to link" context menu option?
That could be done, but essentially these menu options are commands, and can be also accessed over search
I've created a to-do for both these things with these notes that I will get to after our CMS/monetization launch πŸ‘
Add a reply
Sign up and join the conversation on Discord