Start learning with our library of video tutorials taught by experts. Get started
Viewers: in countries Watching now:
This course introduces web designers to the nuts and bolts of HTML (HyperText Markup Language), the programming language used to create web pages. Author Bill Weinman explains what HTML is, how it's structured, and presents the major tags and features of the language. Discover how to format text and lists, add images and flow text around them, link to other pages and sites, embed audio and video, and create HTML forms. Additional tutorials cover the new elements in HTML5, the latest version of HTML, and prepare you to start working with Cascading Style Sheets (CSS).
As you use an HTML form, pressing the Tab key on your keyboard will typically take you from one field to the next. Let's make a working copy of forms.html, and we'll take a look at this effect. I'll rename the copy to forms-working.html, and I am going to open that in my text editor. And you'll notice here up at the top, we have the forms.css, the forms.js, and here we have our actual form. I'm going to go ahead and take a bunch of this out and just make a bunch of text fields, because that's an easier way to demonstrate this: text1, text2, text3, text4. I am going to name them over here Text 1, 2, 3, 4. And we don't need autofocus on most of these. Save that, and we'll go ahead and load this up in a browser.
Use Firefox for this, and there is our four text fields. And you'll see when I press the Tab key, there, Tab, Tab, and I can press Shift+Tab to go backwards, Shift+Tab, Shift+Tab, Shift+Tab. Usually this is exactly the behavior that you want. The tab order is exactly the same as the order the elements are entered in the script. This can be changed, however, using the tab index attribute. So if I come along here and I say tabindex--and I'm just going to do a little copy and paste here and change this to 1, 2, 3, 4, in that order, and I'll save that and reload this in the browser--and now you'll notice when I press Tab and press Tab again and Tab again, if I press Tab again I get to the button.
When I press Shift+Tab it goes back in that same new order. So as you can see, for the most part, this is not necessarily a good idea, but for those rare occasions where it makes sense to change the tab order of the elements on the page the tabindex attribute does the job nicely. Be careful, however; users tend to expect the Tab key to take them to the next element on the page, so changing this can be disconcerting.
Find answers to the most frequently asked questions about HTML Essential Training.
Here are the FAQs that matched your search "":
Sorry, there are no matches for your search ""—to search again, type in another word or phrase and click search.
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.