VirtualMV/HTML/Basic
| Internet & Web Development ( Introduction | Advanced ) | ||
|---|---|---|
| Overview | Personal Learning Environment | What is HTML? | Web authoring | Resources | Help Desk |  |
| Creating a basic web site | HTML editor | Basic tags | Head tag | Linking pages | Formating and lines | Lists | Tables | Special characters | Page icon | |
| Multimedia | graphics and images | Connected media | Audio | Video | Image map | |
| Cascading style sheets | Inline, embedded, linked | Language | Example | |
| Web page layout | Tables | CSS | iFrame | Frames | Other | Responsive | |
| Framework | Tours of Hawke's Bay | |
| Forms | Example | mailto | Add Google | |
| Misc | ||
Overview
So what is HTML? If you use a computer or a mobile device (like a iPad, tablet, or smartphone) to search the internet, you will need to use a program called a Web Browser (this can be called different things like: Safari if you use an Apple computer, Internet Explorer from Microsoft, or Chrome from Google) ... but just how does the browser know what to display? We need to send the Browser some instructions that it can present your ideas on the screen, so basically ...
- The instructions need to make sense to the Browser ... so we use a language called HTML.
- We need to save the instructions into a file ...this is a web page. And if you have more than one linked web page you have a web site!
- This means you need some way to link the pages... on a web page you have text that you can click to go to another page .. this is HyperText.
- Something has to read the instructions and display them on a screen... this is a web browser.
- The instructions have to be stored somewhere .. this can be on your local hard drive or on the stored on the internet.
|
By the end of this page you will be able to:
|
What is Hypertext Markup Language (HTML)?
- In 1991 Tim Berners-Lee of CERN released the hypertext system, which allowed:
- Pages and formatting to be contained in a simple text file
- links to be made from page to page, and
- images to be included in pages.
- A language that describes the structure and content of a page or document used on the World Wide Web. A web page needs to be read by many devices, from smart phones to very large computers, and many different operating systems, including Microsoft Windows, Apple Mac, Linux. So we need to use a basic format that they all can read. The simplest is made up of the letters on your keyboard which in a computer is represented in a coding system called the American Standard Code for Information Interchange (ASCII for short!). So, a web page is a plain ASCII text file with formatting instructions, called tags, inserted.
- Here is an ASCII text drawing:
(@ @)
--o00-(_)-00o--
Kilroy was here
- A tag is a formatting command which the browser must interpret to create your web page, and generally takes the form
<tag> ... </tag>.
- For example, to tell a browser you have a heading and a paragraph:
<h1>Heading</h1> <p>paragraph</p>
Basic HTML Page
A basic Web page could look like this and have the following tags:
<!DOCTYPE html> <html> <head> <title>My first page</title> </head> <body> <p>Hello world</p> </body> </html>
- Special tag for HTML 5
- <!DOCTYPE html>
The first tag on a Web page is used to identify the type of HTML used. For HTML 5 <!DOCTYPE html> is the tag (similar to the <?xml.. ?> tag used in XML), for earlier versions you can either ignore the tag entirely or for XHTML it looked like
- <!DOCTYPE html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">- <html> ... </html>
The first tag on a Web page and the last tag (known as the root element), and tells the browser that it is an HTML document. - Each html page is divided into
- heading information (meta-information) and is not displayed on the web page
<head> ... </head> - the actual information to be displayed on the web page between
<body> ... </body>
- heading information (meta-information) and is not displayed on the web page
- In the head area is the title you see at the top of your browser, ( not on your actual Web Page), as well as Meta tags containing information to help Search Engines find your pages. The title is also used by most browsers when saving the user’s "hotlist," also called "bookmarks" or "favourites". Because of this, the title should be descriptive.
A Web browser
And in order for the page to display on the screen of a device we need a program that understands the HTML code and "renders" it for the device, this is the web browser. The most well known web browsers are Google Chrome, Internet Explorer, Firefox and Apple Safari(Usage share of web browsers, 2013)[1]
References
- ↑ Usage share of web browsers. (2013, November 4). In Wikipedia, The Free Encyclopedia. Retrieved 07:44, November 4, 2013, from http://en.wikipedia.org/w/index.php?title=Usage_share_of_web_browsers
|
virtualMV | Superquick wiki guide | Please give me some feedback |
VirtualMV/HTML/Basic. (2024). In WikiEducator/VirtualMV wiki. Retrieved April 20, 2024, from http:https://wikieducator.org/VirtualMV/HTML/Basic (zotero)
|
