Skip to Main Content or Page Contents
HTML5 & CSS 3 Tutorial
Gimp lntroduction. The Interface
Introduction to HTML & Web Design
PageContents
Introduction to HTML & Web Design
Introduction to HTML & Web Design
This free HTML programming and Web site design tutorial will provide you with all the information you require to create an exciting Web Page or Web site design, suitable for both the complete beginner and more advanced website creator. This free HTML tutorial will show you how to use HTML tags
Students of courses such as T183 & ex students of the discontinued courses T171,T170 and TT280 of the Open University ( OU ), will find many of the pages of great interest.
The OU does not go into much detail about the actual hypertext markup language code required, in course T183, the code is produced in the background by the KompoZer web editor. If you wish to create something more than a simple web page or site, then learning the actual code is essential.
Even if you are using the best Web Site Editor - Dreamweaver, you still need to learn the code.
During this tutorial You will learn
- How to program HTML elements, HTML tags & Cascading Style Sheets, CSS
- The applications you require, to do this, to view these pages, to upload the web page, or web site to a Web host.
- All about domain names & how to obtain a domain name
- Learn to improve the design and looks of a page with graphics.
- Simple and advanced techniques in using search engines.
- Page submitting and site promotion with search engines.
- Learn about web site hosting and other services that a webmaster requires.
- You will find an index to the site below, with a few details of each tutorial or information subject. You can link to these pages, or a specific subject from the Links below, or you can use the Tutorial and Information links in the left panel. This panel appears on all pages.
I hope that you find this free site useful. Please bear in mind that this site does cost money with web hosting and other overhead costs. These costs are partially offset by by sponsorship and advertising of products that are useful to students. Please help us to help you.
If you find the site useful, please
- Make your book, software, and web service purchases from this web site.
- spread the word to your fellow pupils, colleagues and friends.
- Place a link on your web page to us- See Link to us
Thanks
John McGuinn
HTML Lessons
Home This Page.
1. Required Programs to create & publish a Web Site
The required applications:
Editor
- An Editor is required to write the Web Page.
- Because an HTML document, a web page, is a only a text document a very simple text editor is required to create it such as Notepad in Windows.
- It is much betterto use a dedicated HTML & CSS editowhich is a far better choice'
- I recomend Visual Studio Code usually shortend to VS Code.Please make sure the word Code is added because there is also a differnt application called Visual Studio.
- VS Code is FREE for more information and how to download see VS Code
Browser
- A Browser is used to view the web page as you create it oand also the finished page. I you use the internet you are alraedt using a browser.
- Popular browsers are
Graphic
- A graphic program is used to create graphics and to edit photographs.
Domain Name
- A domain is the name of a web site. If possible it should be short & memorable, thinking of one that is not allready usedc can be difficult. You register the name through normally an online web hosting company. There is normally a fee, renewable every year. The Domain Name for this site is tutorials4u.com. There are many extentions besides .com
Host
- A host is a company that has large special computers that store your website on the internet. There is normally a monthly charge on a yearly contract renewable each year. Free hosts are available but the domain name usually included the hosts name plus the name you choose, not proffesional for a business site name.
FTP
An introduction into programming to create a simple web page:
Saving. Viewing in a browser. Editing
3. Page Appearance
Changing the Page Appearance, using the main heading H1 & sub headings H2, H3, H4, H5, H6
4. Colour
Learn to use colour on your pages. RGB Colour System, Colour Names. Web page Safe colours.
4a. Colour Names List
List of Colour Names.
5. Tables
Learn to use tables to arrange tabular text and graphic images on a page.
Tables look very similar to tables in Word and spreadsheet packages.
Table attributes, TABLE, TR, TD
For years tables have been used to design web pages. Now Cascading Style Sheets CSS are used to design the page layout. And tables used to display tabular data.
6. Graphics
Graphics are used both for a pages design and also as page content. Graphics can be either images or photographs
Introduction - Copyright - File Formats - Download Image Sites
7. Linking
How to link to other pages, other sites, to anchors on the same page or to anchors another page.
8 Lists
- Ordered List
- using numbers
- or the alphabet
- Unordered lists
- using default blobs
- Using your own graphics
9. Frames
How to use frames. Frames are not required in Open University courses T171,T170 and TT280.
Frames allow the user to scroll sections of a page.
They are slightly harder to achieve than a standard HTML page and not covered in this tutorial.
10. Uploading to the Web
You will learn how to get the files on your hard disk, known as the local site, to your Web site on a Web hosting service server.
12. CSS
Cascading Style sheets
How to Style and colour your page(s)
14. Site Promotion
Search engine optimization SEO, the art of obtaining a good ranking in the search engines
15 Site Design
99. Web Terminology
Jargon Buster
The Site also lists a vast amount of useful Information that can be found in the Main menu under the Software, Books & Miscellaneous headings