Questions tagged [html]
HTML (HyperText Markup Language) is the predominant markup language used for creating web pages. In modern web pages, HTML is used to markup the contents of the website, while CSS and Javascript are used to define the styles and behaviors respectively.
341
questions
5
votes
2
answers
954
views
Creating an accessible, animated, and responsive navigation system
I've been struggling for the past couple weeks to design the perfect navigation (menu) system for my personal website which I am designing.
First, I need a system that is completely accessible as I am ...
4
votes
5
answers
3k
views
How to make maxlength attribute accessible?
I have a form in which there are a few input fields. For one of the input field I have a length validation, for which I used maxlength="20".
The issue here is that the JAWS users don't come to know ...
0
votes
1
answer
143
views
Is it possible to delay announcement of title of a web page?
I have a web app with Single Page architecture so the <title> is updated programatically as the user navigates between client side rendered pages.
This works fine when the app is already opened. ...
1
vote
2
answers
45
views
Web based content outline - mixing roman and natural numerals
Content folks submitted a document for publishing containing outline sections having mixed roman and natural numbers.
II Favorite Ice Cream Flavor
1. frozen yogurts
1.1 vanilla
1.2 chocolate
2 ...
9
votes
3
answers
16k
views
Should a blank option always be included in <select> inputs?
For example when asking a user what pet they have and it's a required field, a Please select option is included since the pet is currently unknown:
<select required>
<option value="&...
4
votes
2
answers
4k
views
Is an English only aria-label better than no aria-label at all for non-English speakers?
We have a set of buttons that have a single icon for the content and no text content. One example, a button in the top left of a modal that has an 'X' icon which is an image file. To better ...
1
vote
1
answer
505
views
Accessibility reading order VS DOM order in a list of events
I'm trying to fix a CSS/DOM order problem on a website so it can pass an accessibility audit.
The problem is that the website is very visual, and the fixes must not change the appearance (as much as ...
0
votes
1
answer
109
views
Accessibility text of the "- Any -" option on HTML <select> element - do i need dashes/marker around the "any" option?
For the HTML element - Do I need dashes/markers around the "any" option to satisfy accessibility? If no markers, does the text have to be a sentence ? What types of text is accessible?
For ...
5
votes
1
answer
143
views
Why does "jump link" pattern not copy?
I am asking this question as a user. I have used several websites with the "jump link" feature, and after clicking on the button I go somewhere else and press Ctrl+V only to find out that ...
3
votes
1
answer
277
views
(WCAG) Should I use HTML tables for displaying singular data sets?
I'd like to display tabular data (an order summary) in a vertical table (headings in the left column, values to the right). In my use case, there is only ever one data set to display, so I'm unsure ...
1
vote
3
answers
829
views
What are some cases, if any, where a button element should act as a link?
Common practice is for links to use the a element, and buttons to use the button element. But are there any cases (even if their edge cases) where a button, via Javascript, should behave like a link?
22
votes
8
answers
9k
views
Is there any recommended control for triple options like YES / NO / NONE?
I'm designing a user opinion page where the user has three choices. For instance, if the question is "Is it suitable?" the three options could be "YES", "NO", or "NoIdea".
In this case, what control ...
6
votes
5
answers
4k
views
Best error message to display when too many users logging onto web system
I have a website that started experiencing issues when too many people are trying to log into the website at the same time (usually at the start of the business day). Are there some examples of or ...
30
votes
5
answers
7k
views
What are pros/cons of using buttons instead of plain links to download a document?
My company is using some rather bizarre download buttons associated with documents that can be downloaded:
It looks like these are abused anchor (<a>) elements which show up in a browser as ...
134
votes
10
answers
9k
views
Is Markdown Friendly Enough for Non-Technical Users?
The Problem
I love using Markdown to write questions, answers, posts, comments, etc. That being said, I am a very technical, detail-oriented, programmer type. However, I am working on a CMS of sorts ...
1
vote
1
answer
92
views
What's the best input/edit method to handle small high precision numbers?
I have an AG Grid with cells that contain very small highly precise numbers - eg 0.002957399184
I want to allow users to edit these numbers easily and accurately - basically want to avoid fiddling ...
0
votes
1
answer
211
views
Best UX for a dynamic list of actions/operations
Predominantly focused on web-based Desktop use.
When viewing a particular object in our system, let's say its a helpdesk ticket as an example. Our workflow system allows the enrolment of new ...
7
votes
3
answers
17k
views
Confused with what to use - List vs Table
So, I've been browsing for an hour now regarding what the best practice is for this and the majority of what I read is to use e table for tabular data and a list for lists, which makes sense. However, ...
51
votes
7
answers
22k
views
Why do websites not use entire width of browser?
What reasons might a website not use the entire width of the browser, like Gmail does?
For example, StackOverflow does not use the entire width — it has left and right margins. This means the ...
2
votes
2
answers
1k
views
How to make a decorative video accessible
Our clients gave us a video that is mostly B-roll so they are saying they do not need to add captions to make is ADA compliant, but I'm not sure that is true. I know for images, if it's purely ...
1
vote
1
answer
118
views
Multiple parts of a form with regular HTML between #Accessibility
I recently turned a design in to HTML and CSS to be implemented by our back-end developers. For a search result page I used two form tags. One for the search bar and one for the sidebar with filters.
...
1
vote
1
answer
822
views
How to improve UX on deeply nested form functionality in the browser?
I have this, which is horribly unstyled but shows the inputs and grouping (which is also described in terms of the HTML structure in more depth here).
Basically, you have a form for a "...
21
votes
5
answers
2k
views
Should users be allowed to copy and paste rich text into text?
I have a wiki-style application where users can create articles. Recently, some users have been complaining that our editor does not support copying rich text and formatting from applications like ...
2
votes
1
answer
684
views
Any UX implications: Smart quotes and apostrophes when pasting from Word?
I have a question that I've found very little info on and it's only lately I've begun to become more curious about it.
Our web team normally copies content from Word into a CMS to update the website. ...
184
votes
18
answers
260k
views
Why is it impossible to deselect HTML "radio" inputs?
In HTML, there are currently two types of "checkbox" style controls:
Checkbox: Allows toggling on/off, multiple values can be selected
Radio: Only one value in a group may be selected, does ...
9
votes
2
answers
5k
views
Should html links with images have both title and alt attributes?
I understand it is generally a best quality practice to have title tags for hyperlinks and alt tags for images. This is good for several reasons: additional information for low bandwidth users, ...
0
votes
1
answer
244
views
What HTML should I use for a rated theatre review? [closed]
I'm authoring a reusable widget, in HTML, that reflects a common pattern often seen in theatre reviews. The widget is quite simple, with minimal components, namely:
A star rating,
The review itself
...
0
votes
1
answer
68
views
Software that works like Google Chrome's "view page source"
I've only been using Google Chrome "CTRL+U" Tools to check my web design's responsiveness and edit styles or elements, however it started to get so freaking laggy which slows me down ...
0
votes
1
answer
51
views
Poster HTML inside a web page
There's a type of web layout called Poster HTML, quite interesting for designers (not digital poster which is another thing for static advertising displays). They are usually very graphic, without ...
1
vote
2
answers
141
views
How to do loading animations when at certain times the application is too fast for them?
I am facing a strange "catch-22" like problem, while developing an application for a mobile browser. My problem is that, some inner-app screens are fetching data from a back-end server, and ...
3
votes
3
answers
593
views
Semantic Elements and Text Formatting in HTML5
Almost every website, book, article, newspaper, etc... that contains copyrights, caveat, disclaimers, etc... displays it in small font text.
Now... I'm doing a research about Semantic Elements and ...
0
votes
3
answers
2k
views
How to make the switch from full stack dev to UI/UX developer? And, do UI/UX devs exist? [closed]
Some background info:
I am a junior .Net MVC developer who is great at nothing but good at everything. All my development experience up to this point has been full stack which is great because I ...
1
vote
1
answer
225
views
Same date for multiple Date inputs
I have a HTML Table with just two columns.
`
Order #
Date
<tr>
<td>12345</td>
<td><input type="date" id="row1"></td>
</tr>
...
-1
votes
1
answer
630
views
HTML Elements to use with Image and Text used as a link
What are the correct HTML elements instead of just a div to use when presenting an image and text just below as one link? I would like for the image and text to be presented in an a11y correct manner.
3
votes
2
answers
1k
views
Does adding a "title" attribute to the "label" element instead of the "input" harm accessibility?
I'm creating an HTML interface that has an input text field with a label attached. The label has a short name for the input and I want a more detailed description to appear as a popup for visual users,...
5
votes
1
answer
8k
views
Why does the title attribute have a delay?
In HTML the title attribute usually displays a little popup conveying information about the element. In most—if not all—browsers the popup doesn't appear immediately but after few seconds.
Why was ...
2
votes
1
answer
148
views
How should non-monospace code listings be marked up in HTML? [closed]
For marking up source code beyond small fragments embedded in normal text, the official recommendation seems to be to use the code and pre elements. And this works fine if your listings should reflect ...
2
votes
3
answers
496
views
Is it accessible to have lists without a heading, assuming previous lists do?
Assume this HTML structure:
<h2>Our latest News and Events</h2>
<ul>
<li>news item 1</li>
<li>news item 2</li>
<li>news item 3</li>
</ul&...
84
votes
12
answers
83k
views
Is there an optimal font size / line height ratio?
When styling text on web pages, both font size and line height can be set. For example, the text of this post will be displayed using a font-size of 14px and a line-height of (about) 18px, set using ...
3
votes
3
answers
6k
views
Can/Should I Label an informational span for screen readers?
I have an informational span, specifically, a span full of stars that represent a rating (star icons that can be filled or unfilled). As is, it shouldn't be visible at all to a screen reader, since ...
0
votes
2
answers
187
views
Web design practices to minimize browser refresh [closed]
The design of our website is such that whenever we make some changes in CSS & JavaScript files we require the user to clear the browser cache and get the latest version of these files from the ...
11
votes
1
answer
12k
views
Accessibility vs. read-only input fields
I have a form with some read-only fields depending on the customer role. As a rule, I use read-only fields for those inputs.
Are there problems with this approach using an assistive technology?
Are ...
2
votes
1
answer
488
views
What is the best way to add edit and delete buttons to a modal?
I have a task data visualization modal, but I need to add an option to edit or delete these tasks. Where in this modal could I insert buttons to delete or edit?
2
votes
2
answers
4k
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
1
answer
52
views
Why do some emails include a link to the same destination as the button right above them?
Can someone explain the purpose behind this practice?
Is it an accessibility issue and is this practice outdated?
For example:
"If you have trouble with the link above, copy and paste this URL ...
2
votes
1
answer
2k
views
(Accessibility) - Back button placement on the page in SPA
I am working with an SPA with Angular and the designs indicates that there is a back button and it is before the Page level heading usually the H1. For SPA, it is a general practice that we place the ...
-2
votes
2
answers
48
views
Help with <table> tag [closed]
I have the following code
<table style="width: 100%;">
<tbody>
<tr>
<td style="width: 50%; border:1px solid #ccc!important; border-color:#...
1
vote
1
answer
76
views
When making a website that is font-size responsive, are there any guidelines to what font-sizes authors blow text up to?
It seems an opinion whether or not, as web-developers, we should design websites taking into account the user increasing font-size (e.g. on Chrome: Chrome>Settings>Customise fonts). (Although it ...
1
vote
1
answer
456
views
Should I override controls so that it handle different locale's or let the browser handle it?
Similar to A good solution how to localize and let user choose language on HTML page
but I am specifically wondering about localization of control elements such as required on input or date fields.
...
5
votes
2
answers
2k
views
How to deal with extra spacing with line-height when spacing between elements should be consistent
We want to design our website so that all elements are spaced 24px apart (paragraphs, form groups, header & content, etc.) and "related" elements (label & form field) are spaced 8px apart. We ...