Questions tagged [html5]

HTML5 is a language for structuring and presenting content for the World Wide Web, a core technology of the Internet. It is the latest revision of the HTML standard and currently remains under development.

Filter by
Sorted by
Tagged with
-1
votes
0answers
34 views

How to set correctly a big title which works on desktop and mobile as well? [closed]

I'm working on webpage main title. I want to set a 100% height background image and a big title on the front of it. This is how I did: In the CSS file: body, html { height: 100%; } .bg { ...
0
votes
0answers
25 views

iOS HTML5 + fullscreen/native video player [closed]

Is it possible to utilize the "native" video player spawned from the HTML5 video element, but control over the "bouncy borders" as illustrated in these capture: https://youtu.be/tZGr_-XFGMk https://...
0
votes
2answers
82 views

Do HTML5 browsers have to be able to properly process HTML4 tags when the tags appear in HTML5 pages? [closed]

According to the post here, the HTML5 specification requires HTML5 browsers to be able to properly process HTML4 tags when they are in HTML5 pages. Unfortunately, the post doesn't very well ...
1
vote
1answer
105 views

Material design and Material UI [closed]

Since I am new to Material design, I am having some clarification 1) What is material design? Common CSS material design framework? 2) Difference between material design and material UI? Material UI ...
1
vote
1answer
71 views

Need explanation how Clear input button accessibility works

I've a text input with a clear button (looks like "x"). When clicked, this button will remove all the text from the input: The markup for this looks like: <label for="first-name">First name&...
2
votes
2answers
90 views

For Screen Readers: How to markup a group of text items to be read as one item? Should I even try?

How might I mark up the following component in accordance with WCAG 2.1 guidelines, accessibility best practices, and with as much assistive technology compatibility as possible (I don't want to ...
0
votes
0answers
27 views

Input for Duration/Time Delta

What would be the best widget for duration/time delta? The duration can take days, hours, minutes, seconds, or a combination of those. Some use cases would be the length of a song or video, playlist, ...
0
votes
1answer
55 views

Is a label-tag inside a button-tag valid and / or has any UX- / ergonomic-reasons?

I am checking an application and I found this in HTML DOM: <button type="submit"> <label>Submit</label> </button> I have never seen this before and asking myself if this is ...
1
vote
1answer
49 views

Where should keyboard focus after closing a dialog with the button opening the dialog removed?

In the UI design, each item panel contains a remove button. If clicking the remove button, a confirmation dialog would prompt. If cancel, the keyboard would focus back to the remove button. If confirm,...
0
votes
1answer
171 views

HTML5 placeholder attribute used to hold default even after value change?

I have a HTML form that is used to modify preexising values. Thus on load values are prepopulated and upon submission, a check is made so that a confirmation message could be shown upon change. We ...
0
votes
1answer
108 views

Best way to organize search form interface?

I have tab in my application where users can search Accounts. Account table has two different type of accounts, User and Staff type. User type is one that have username, password, etc. Staff only ...
0
votes
1answer
109 views

Using placeholders on input elements

I have a number of forms where users must enter phone numbers, credit card numbers, amounts, e-mail addresses and I am using placeholders for these fields in hope to guide the user on what to type in ...
0
votes
1answer
132 views

UI element names and hierarchy for web SaaS B2B application [closed]

I´m building an ReactJS based library of web elements for a SaaS B2B application. I know this is common, but I´m having lots of difficulties choosing right names for my visual hierarchy. What I call ...
2
votes
1answer
2k views

Should I use the native HTML5 date picker when available?

My application is using the Material UI style, and I need to provide a date picker to the users. I have two options: Use the native date picker when the browser supports it (e.g. on Edge, Chrome), ...
0
votes
2answers
256 views

how better place back button?

Our main goal is, to keep the ability to go back SOMEWHERE but we don’t want it to be too prominent. Where should we put that button? This is the link to the live page where this button called 'Ürün ...
34
votes
6answers
12k views

Should disabled elements be focusable for accessibility purposes?

For example, if we have a set up wizard with 3 steps, and the user is on step 1, should the user be able to focus on the control to continue to the next step, regardless of whether or not that control ...
1
vote
1answer
530 views

What are the differences between icon and button badges?

iOS style badges are overlayed atop the upper right part of the icon. It's usually red with white text. When displayed inline on a button or next to a header or link, IMHO, the badge seems to take on ...
2
votes
2answers
893 views

Is there a pattern for an HTML select box that provides existing hardcoded values but also needs to be able to take custom input?

I have a menu of reference information, like below. download bmml source – Wireframes created with Balsamiq Mockups The above fields are progressively pre-populated by the system, and user has ...
2
votes
0answers
167 views

I need horizontal scroll bar with fixed width and right side checkbox [closed]

I need horizontal scroll bar with fixed width and right side check box. Currently I truncate the text, but I need horizontal scroll without truncate. Refer my sample page is here:- https://jsfiddle....
6
votes
1answer
926 views

What is the benefit of using the HTML5 <time> tag?

I have a web application I am writing the HTML for. In the app I will be displaying a lot of dates and in HTML5 they added a <time> tag. If I wrap all of my dates and times in the <time> ...
8
votes
5answers
355 views

Which form widget for (seemingly) linear input without default value?

For answers in digital questionnaires, is there any reasonably well understood form widget between a horizontal group of radio buttons (or check boxes) and a slider gauge that lets the user input a ...
8
votes
5answers
3k views

Are Placeholders good for default values?

I read (and believe) this article that data entry tips in HTML placeholders are generally harmful and should be avoided. In-context descriptions or hints can help clarify what goes inside each ...
2
votes
3answers
274 views

Does anyone know of any examples of the use of character counter on an input field?

I am working on a project that allows users to edit objects named by clicking on it using something similar to the HTML 5 Content-editable attribute. Update: The character limit is 30 not three. ...
2
votes
2answers
496 views

when to choose one between dropdown and typeahead

I am about to design a webpage wherein I got confused between few components which suits. Here, I would like to understand what is the best scenario for choosing between typeahead and dropdown menu ...
3
votes
2answers
503 views

User Interface design for HTML based mobile applications [closed]

I'm currently working on the User Interface design for a responsive mobile app that is being coded using html. This is the first mobile app development project for me as well as my Head of Engineering ...
3
votes
1answer
593 views

How best to show a document preview

I have a fairly basic web form that gathers information such as name, address, description, yada, yada. I have to do a rewrite and so am wondering what the best practice currently is to show a ...
3
votes
3answers
4k views

Use a web framework (Bootstrap) or write my own CSS from scratch? [closed]

We are a startup building an ERP platform. It has lots of screens (10-15) and will be a browser first application. We are a team of 3 and our skillset is mostly javascript specifically Angular. We ...
1
vote
2answers
121 views

What is this input type or form setup called? [duplicate]

Couple of us arguing about this and none of us can remember what this is or would be called. Commonly seen on forms where you are moving an option from one box on the left to a box on the right and ...
0
votes
1answer
225 views

Pop up modal with alert box notification

So I have a pop-up modal which serves as subscription point and it has an email field, this email field has email validation and the error message is displayed in alert box. My question, is it a good ...
0
votes
3answers
81 views

Proper way to describe saving canvas to server?

Problem I have an app where the user draws to an HTML5 canvas, and then is presented an option to save it to the server. Currently a button that says "Save" is shown, which instructs the server to ...
2
votes
3answers
286 views

Is this a parallax effect design?

Here: http://www.ginventory.co/ I am not sure if this is also called parallax. If not, I'd like to know what is it called?
0
votes
2answers
899 views

How to make HTML-dashboards of SPA printable?

We have a SPA (Single Page Application) SaaS product (https://www.webbsc.at/home/) which displays user's financial data and analysis. Obviously it would be great if the user could print the data to ...
0
votes
1answer
121 views

Ideas for application layout using angularJS [closed]

I am converting a classic asp application that displays the status of any number of applications, can be one, can be 10+. I am using angularJS for the front end and restful web service for back end. ...
2
votes
1answer
141 views

Handling lack of support for HTML5 [closed]

I've made a client-side JS script that runs when the Register button is clicked for the current version of a site, but want to implement real-time validation on the client. How do I handle some ...
0
votes
1answer
50 views

How to manage a growing drop down on my blog

I have a blog and I add articles on it quite frequently. One caters to Short Stories and the other to Articles. Not the drop-down has become huge and is covering most of the screen. Can you please ...
58
votes
4answers
26k views

Why aren't HTML5 typed number inputs right aligned, and should they be?

As you may know, with HTML5 when an input has type="number" the field is "customized". Two little arrows are added to the field (w3school example) but the numbers are still left aligned. I saw that ...
1
vote
1answer
446 views

bootstrap auto-hint/validation on form field types [closed]

It seems that Bootstap has a 'field type' validation, that it performs automatically. Is there a way I can turn that off, OR, maybe better, pass messages to that along with making it work on plain ...
5
votes
2answers
1k views

When should a text input be auto selected?

By default in most browsers, text inputs become fully selected when you tab into them, but not when you click on them. But in some instances, applications choose to focus the text input when it ...
1
vote
2answers
449 views

Creative Methods to Allow Users to Select Chart Series

This is a very generic question, but I have a graph that will be plotting attendance data for the public schools in my district. The users would like to see this data grouped by district, High Schools,...
1
vote
3answers
155 views

How to browse a long list of artists and songs

I have a mobile app that allows you to browse lists of songs: [a][b][c][d][e] Elvis - Song 1 Elvis - Song 2 Elvis - Song 3 Ernie Wood - Song 4 You can jump to the letter to filter based on the first ...
2
votes
3answers
665 views

Better way than scrolling a long list

I have a mobile app that allows you to browse lists of songs: [a][b][c][d][e] Elvis - Song 1 Elvis - Song 2 Elvis - Song 3 Ernie Wood - Song 4 You can jump to the letter to filter based on the first ...
3
votes
4answers
6k views

Ordered Multi-select control in HTML

I'm developing a highly customisable SaaS application. It has at several places a multi select, for some cases additionally to selecting the items, the user can define an order, for other cases it is ...
28
votes
5answers
3k views

Which input control is recommended for a large value range?

I'm working on a web app that allows the user to enter a timing value in a range from 0s to 1s with a step of 200ns (yes, nanoseconds). I tried that with an input of type range (slider) but that's ...
4
votes
2answers
1k views

HTML5 small tag font size

In HTML5, the <small> tag "represents side comments such as small print...typically features disclaimers, caveats, legal restrictions, or copyrights." 1 We use this as a footnote to a table, ...
1
vote
2answers
466 views

Are browser desktop notifications better than a browser alert box?

I'm working on a project where I'd like to notify a user of an important event in the application. There are two options that I have at my disposal: Use the browser/HTML5 Desktop Notifications. These ...
4
votes
2answers
1k views

How to design UI to allow user to enter multiple sets of data

I am having some trouble figuring out how to do an interface that has these characteristics: allows user to enter several sets ("cases") of data. Minimum one, and there is no limit but say 12 is ...
1
vote
2answers
796 views

What is the best practice for images on websites? [closed]

I am using right now svg images, because it looks great at any size, but not all the browsers has support for this. So, is it better practice work with .png/.jpg?
0
votes
1answer
106 views

How to work with web designers pragmatically on my stateless browser app?

These days, lots of stuff is being done on the client. This includes full page rendering, data fetching, and much more. Right now, I am developing an API and also working on the client-side app which ...
1
vote
1answer
61 views

Linking to vs. embedding content on a web page

I'm designing a simple informational page, and I want to maximise readability and make the page as efficient as possible. Currently, I have two PDFs embedded into the page that users can scroll ...
4
votes
4answers
10k views

How to make HTML5 number input field more user friendly?

I am upgrading my website to adopt HTML5 standard. I have a field that only accepts integers from 0-99. Originally it has the following code: <input name='age' type='text' size=2 maxlength=2> ...