HTML Articles
If the internet is a LEGO Death Star, HTML is the individual bricks. Learn all there is to learn about the foundation of the worldwide web.
Articles From HTML
Filter Results
Article / Updated 09-29-2023
There are plusses and minuses of adding sound to your Web page, but if you decide adding sound is of value to your Web page visitors, HTML offers two competing ways to add it: with the <bgsound> tag and with the embed tag. The <bgsound> tag works well and has useful options for controlling sound, but it’s not supported by all browsers. This example uses the <embed> tag, which is not officially supported by the HTML standard at all, but it works in most browsers. <embed> has options for different media players, such as Windows Media Player or Apple QuickTime. Follow these steps to add sound to a Web page in a text editor: Open your Web page in Notepad. Let your Web page’s user know they can stop sound from playing in your Web page by clicking the Stop button in their browsers. Enter the <embed> tag and a link to the sound file you want to use. An example looks like this: <embed src=<i>“pathname/filename”</i>>, <i>“pathname/filename”</i> is a link to the sound file. The simplest way to be sure you have the link right is to place the sound file in the same folder as the Web page; that way the link is simply the filename. Click File→Save and reopen the file. The sound should play. Test the link right away to be sure it will work. If the sound doesn’t play, experiment to make sure you have the path right and that sound plays on your machine. To make sure you have the link right, put the file in the same folder as your Web page and simplify the link. To make sure that sound playback works on your machine, navigate to the file in Windows Explorer and click it. It should play. If not, identify and fix the files affecting sound playback on your machine.
View ArticleArticle / Updated 11-21-2019
When you're creating Web pages, you use HTML — a lot! The following sample shows the HTML formatting and codes you use to create headings and titles, lists, lines, and images as well as boldface and italicized type, not to mention how to include a link. <html> <!-- Text between angle brackets is an HTML tag and is not displayed. Most tags, such as the HTML and /HTML tags that surround the contents of a page, come in pairs; some tags, like HR, for a horizontal rule, stand alone. Comments, such as the text you're reading, are not displayed when the Web page is shown. The information between the HEAD and /HEAD tags is not displayed. The information between the BODY and /BODY tags is displayed.--> <head> <title>Enter a title, displayed at the top of the window.</title> </head> <!-- The information between the BODY and /BODY tags is displayed.--> <body> <h1>Enter the main heading, usually the same as the title.</h1> <p>Be <b>bold</b> in stating your key points. Put them in a list: </p> <ul> <li>The first item in your list</li> <li>The second item; <i>italicize</i> key words</li> </ul> <p>Improve your image by including an image. </p> <p><img src="http://www.mygifs.com/CoverImage.gif" alt="A Great HTML Resource"></p> <p>Add a link to your favorite <a href="https://www.dummies.com/">Web site</a>. Break up your page with a horizontal rule or two. </p> <hr> <p>Finally, link to <a href="page2.html">another page</a> in your own Web site.</p> <!-- And add a copyright notice.--> <p>© Wiley Publishing, 2011</p> </body> </html> All this HTML translates to a Web page that looks something like this:
View ArticleStep by Step / Updated 03-27-2016
As a leading WYSIWYG Web pages tool, CoffeeCup HTML Editor has all the important basic features that you need to build basic Web pages. Using these features, you can create and edit Web pages without seeing HTML tags, drag and drop links to other Web locations without typing the URL or pathname, cut and paste graphics into your Web page, resize graphics, and add alternate text, and create and edit tables and forms. To check for an updated version of CoffeeCup HTML Editor, go to the CoffeeCup HTML Editor site. To run CoffeeCup HTML Editor, you need a computer running Windows XP or Windows Vista. It doesn’t run on the Macintosh or Linux/Unix operating systems. After you download it, follow these steps to start CoffeeCup HTML Editor and get oriented to using it:
View Step by StepStep by Step / Updated 03-27-2016
Including lists on your Web pages is good design. Lists are interesting to look at, easy to scan, and inspire you to write short, punchy phrases. Follow these steps to create a list in Notepad:
View Step by StepArticle / Updated 03-26-2016
Using HTML lists is a great way to present information to readers on your Web pages. Lists make information on your Web page easy to parse. Here are some other reasons to use lists on your Web pages: Lists are interesting to look at: Web pros are always telling people to use lots of white space to vary the appearance of their pages so they’re not just featureless blobs of text. Lists do this; they break up text. Lists are easy to scan: People are more likely to scan text on the Web than to read it carefully. Lists make the writer get to the point: When you write a list, you may end up editing a page of boring, monotonous text down to three or four points in a bulleted list, which greatly benefits your readers. HTML and Web-page editing programs based on HTML (such as CoffeeCup) offer three kinds of lists, but only two are used much: Bulleted lists: Bulleted lists are by far the most widely used kind of list on the Web. Bulleted lists are flexible and fun, and easy to read. You start a bulleted list with the tag, which stands for unordered list. You end it with the tag. Each list item is preceded with , which stands for list item. List items don’t have to have an ending tag, though you can add one (it’s >). After your text, the browser expects to see either another tag, for the next list item, or the tag to end the list. You can convert many long blocks of text into a bulleted list and make the text shorter, easier to read, and more interesting. If you have to move existing text to the Web, consider converting parts of it to bulleted lists as a quick way to make it more Web friendly. Numbered lists: Numbered lists are very useful, but are found much less often on the Web. Numbered lists begin with for ordered list, end with , and, like bulleted lists, use the tag to mark the beginning of each list item. Any time you have a list that has an order of importance, or a sequence in time make it a numbered list. Definition lists: These lists give a term and then a definition for the term. They’re rarely used. A definition list starts with and ends with . Each term is preceded by , for definition term, and each definition is preceded by , for definition data. Use definition lists where you can, or use bold text and bulleted or numbered lists to create your own definition-type list. Lists within lists: You can insert or nest one list inside another. The nested list can be the same kind of list, or a different kind, than the list that contains it. In the limited view offered on most users’ screens, users have a hard time keeping track of where they are in the overall list if you start throwing sublists at them as well.
View ArticleArticle / Updated 03-26-2016
Including a navigation bar helps your readers find information on your site. If you are building your Web page in an HTML text editor, the coding to create a navigation bar is easy. Here’s an example of a simple text navigation bar for a small consulting business: Home | Services | Memberships | Publications | Experience | Contact me Each tab is underlined to reflect that it’s a link to that page or multipage area of the site. Note that the Home tab is not underlined. When you click the word Experience on the text menu to go to the Experience page, the text navigation bar should change to reflect where you are: Home | Services | Memberships | Publications | Experience | Contact me Follow these instructions to create a text navigation bar: Open a new, empty page in Windows Notepad, name the file and save it with .htm as the extension. For example, you might call it navbar.htm. Type the elements of your site, with a word or two for each page or area. Use the vertical bar to separate the tabs. If the vertical bar character is not accessible from your keyboard, it should be available from the Symbol or similar menu in a word processing program. (There’s no such option in Notepad.) You can copy and paste the vertical bar into Notepad. Center the navigation bar on the page by using the center attribute of the paragraph tag, like so: <p center>Home | Services | Memberships | Publications | Experience | Contact me</p> The text menu will be centered. To link the Home tab to the home page of your site, surround the word Home with the and tags. Add the href attribute like so: . The Insert Link dialog box appears. Repeat for the remaining phrases and link them to the relevant page on your site. The pages don’t have to exist yet, though of course the links won’t work until the pages are there. Whenever you create a page, the name must match the name in the text menu exactly. Copy the menu to each Web page of your site. Alternatively, you can create a new file (for any pages that don’t yet exist) and put the menu in it. As you proceed, delete the link from the tab representing the page you’re about to save.
View ArticleArticle / Updated 03-26-2016
If you're creating Web pages, you can't escape using HTML, and really, why would you want to? The Web language translates your glorious ideas into engaging Web pages. The lists here offer the basic HTML tags used most often in formatting Web pages, including links to other Web pages, inserting images on your page, and creating tables. Formatting text You need headings to organize your Web page, differing types of type to place emphasis, and lists to keep things interesting. These tags help you format them all: Headings: Top heading, Next-level heading, ... Lowest heading Bold: text Italic: text Paragraph: A paragraph of text Bulleted list: First list item Second list item Numbered list: Item #1 Item #2 Inserting links Web sites are meant to link to other sites and be linked to them. These HTML tags are the ones you need to connect in the ether: Links to external Web pages: The ...For Dummies Web page Links within a Web site, same directory: My resume Links within a page: Jump to the next line. Here is the next line. Graphics and multimedia You want graphics and multimedia on your Web page to add visual interest. These HTML tags show how to include visuals: Photos and still images: Moving images: Drawing tables Setting up tables means setting a border and making HTML tags for every row and cell: Start table with 1-pixel border: Rows and cells: Table end: First Row, First CellFirst Row, Second Cell>Second Row, First CellSecond Row, Second Cell
View ArticleArticle / Updated 03-26-2016
To help you keep all the options in markup languages in perspective, here's a quick review of how we got to where we are now. The World Wide Web was built on good old HTML, the Hypertext Markup Language, which was born out of SGML, the Standard Generalized Markup Language, which dates all the way back to 1986. XML, the eXtensible Markup Language, was also born out of SGML. XML caught on so well that it became a standard for sharing data across all kinds of documents and systems. The popularity of XML led to the evolution of HTML to XHTML. Essentially, XHTML is a more restrictive subset of SGML, one that can be read better by XML parsers because it follows the rules strictly. If you can picture the typical “odd couple,” HTML is the sloppy roommate and XHTML keeps the contents of the medicine cabinet in alphabetical order. HTML5 isn’t as strict as XHTML, but it has some grown-up features, such as better ways to present multimedia. HTML5 benefits from two new additions — CSS 3 and JavaScript. Combine the power of all three of these current web standards and you can add a lot more interactivity, animation, and even location awareness — features that are especially exciting in the mobile world. This five-minute version of the history of HTML is only part of the story of how we got to where we are now. In what many now consider a misguided effort, the makers of the first mobile web browsers created another markup language, the Wireless Markup Language (WML). Perhaps an understandable reaction to the limited options of early feature phones, WML is now quickly being discarded. And, you should note that the term Wireless Application Protocol (WAP) is used to describe everything related to the mobile web. WAP 1.0 represents the earliest attempts at mobile web design, including websites created with WML. When the mobile web evolved to WAP 2.0 in 2002, most mobile devices could display pages designed in XHTML Basic (a subset of XHTML that has no support for CSS). Since 2004, most phones can handle XHTML MP, which (mostly) supports CSS 2. C-HTML, another mobile markup language you may run into on the web, was designed to be used on NTT DOCOMO phones in Japan, but most mobile designers in Japan now predict that the iPhone’s growing popularity in Japan means that C-HTML will eventually be replaced by XHTML MP. The good news is that all the code designed for the mobile world is based on good old HTML. So if you have a background in HTML, you’re off to a great start. If you want to create a site that will work for any of the more than 6,000 devices in the market, you need a design strategy that includes all these languages and pages created and delivered to match each device.
View Article