Tag Info

New answers tagged

0

I'm a little uncertain with the question. Are you talking about the "label" being too cluttered or the information displayed? I deal with label issue constantly. Ultimately this is where user testing comes in. If users want long, ungainly labels - well, there it is. I try to find comprehensive words that explain it well, use roll-overs that show the ...


3

It sounds like your customer is, like everyone else I know in finance, very much hooked on Excel. It might seem horribly cluttered to you, but this person is likely used to working with giant workbooks containing lots of sheets (accessed by tabs). They rarely want to learn a new workflow, so don't break your head trying to force other solutions on them. ...


0

Tabs placed at the very top of the page won't be very visible. They work best when they are in the upper middle of the page and belong to something. That something is your page title. It basically defines what the page is about, and then using tabs you can categorise the information on that page.


0

Cognitive difficulty -> UI element looks like one area but actually has two different functions. Thus it behaves differently depending on where you click. Yes, there is a risk. However many UI's have a learning curve that balances discoverability, minimising real estate, efficiency, clarity. So with appropriate (a) affordances (b) learning curve (c) low ...


0

From my own experience I can say that clicking it on desktop isn't a problem for the majority of today's users. It even creates a great UX because it's obvious that the small button belongs to the button in which it is situated. However, on mobile websites this can be frustrating as most elderly have large fingers with which they can't touch small things ...


0

I'd take this approach: Put the actual, editable options in TAB 1 Put a clone of the options in TAB 2 but make it read-only, and add a label stating "You can change these options in TAB 1" (you also could put there a link to TAB 1!) You happen to realize those same options are relevant in TAB 3 too ? Put another read-only clone there too, no tweaking ...


0

If you end up putting the shared options on both tabs, you could: Style them differently (for example put them in a box with a black border or with a coloured background). Put them at the bottom of the tab, after a horizontal rule separator. This would make them stand out from the other options, and the colour especially may help remind the user that ...


1

You should use a "more" button to provide additional menu options. You should also really look at your navigation structure and figure out why you need so many options! 8-10 seems overly excessive. Apple: The iOS Human Interface Guidelines call out a minimum button size of 44x44 pixels, which equates to roughly 7mm. Pushing a left/right button onto the ...


0

On Android the design guidelines specify a navigation drawer for your situation, if you use fragments instead of activities there will not be a performance issue. If you are really dead set against navigation drawer, then I would just go with the standard on iOS, which is no more than 5 tabs, with the fifth tab being a more tab if necessary. (I would use ...


0

I would go for the scrolling tab bar, assuming you can swish left or right, with 10 items this would allow the user to access menu items more quickly than pressing right 3 times to get to the 10th item.


0

The decision might depend on two things: How large is the content behind each tab and How important is it to make the user notice each of the sections. If the content behind every section is very large the user probably won't notice each of the sections in the version without tabs. This is because not everyone will scroll down to finish reading this ...


0

Split test it. You know what they say about opinions, right? ;) Make two variations. Run a test for a few days and see which one converts better.


1

Bootstrap has quite an elegant method for handling this sort of UI using tabs for the primary heading and 'pill's for the secondary - http://getbootstrap.com/components/#nav-tabs. download bmml source – Wireframes created with Balsamiq Mockups I've found that this helps group the content well and reinforces the content hierarchy while not ...


0

The general reason for a tabbed interface is to show other options or menus that may not be active at the time, but are available. By showing the menu and replacing the inactive tabs with a sub-menu you're breaking this convention. With that in mind, I would suggest option 5 is the most obvious in functionality terms, I don't think it is a great user ...


0

For me, option 1 is the best. It's clean, simple and understandable. For what it's worth, the Microsoft Ribbon example your referencing is one the worst UI's out there. I really wouldn't use it as a reference. Keep the interface simple, avoid clutter.


0

I would suggest an Expandable List View in addition to tabs: So, you'd use the tabs to let the user select the section, and represent the subsections with group headers in an ExpandableListView. Now, if your data does not lend itself to this kind of segmentation, I'd suggest a section landing page, or default to one and let the user change it in the ...


1

For the main sections you could use a spinner navigation in the Action Bar. So the active/visible section would display as a spinner rather than a static title. The sub sections would make sense to remain as tabs as you have mocked up. This pattern is seen in many apps including a few Google ones. Spinners ...


13

Marco Zehe, Mozilla accessibility QA engineer and evangelist, provided some advice in an article about implementing tabs in web apps with WAI-ARIA. He advocates cursor keys for moving focus between tabs in a set and then spacebar to activate the focused tab, which is consistent with the native desktop experience. Left and Right arrow keys should move ...



Top 50 recent answers are included