Login | Register

Software for Engineers

The Software for Engineers Blog is the place for conversation and discussion about the many software applications that engineers use. Here, you'll find a variety of tips, tricks, and troubleshooting techniques. You'll also find valuable information about topics such as professional certifications.

Previous in Blog: Confessions of a Photoshopaholic: Part 2   Next in Blog: Confessions of a Photoshopaholic: Part 3
Close

Comments Format:






Close

Subscribe to Discussion:

CR4 allows you to "subscribe" to a discussion
so that you can be notified of new comments to
the discussion via email.

Close

Rating Vote:







9 comments

Basic HTML: An Introduction

Posted July 29, 2009 1:21 PM by baumah
Pathfinder Tags: html tutorial learn html
User-tagged by 1 user

Making your own webpage is not as difficult as you might think. You can learn HTML with nothing more than a plain text editor (e.g., Notepad) and a web browser (e.g., Firefox). There are also plenty of websites where you can study HTML in depth. W3Schools.com is my favorite one to use. There's a "try it editor" where you can write your HTML and view the result side by side.

But let's start with some basics.

What is HTML?

HTML stands for "hypertext markup language". It's basically a way of telling a browser how to display the content on a webpage. This is done through the use of HTML tags. These HTML tags are enclosed by angular brackets and generally have a start tag and an end tag (a slash represents an end tag).

Here is a list of some of the most common HTML tags:

<html> </html> All html tags are put between these tags

<body> </body>The visible content of the webpage is displayed between these tags.

<h1> </h1> Any text that is between this tag will be displayed as a heading; 1 is the largest and 6 is the smallest.

<p> </p> This tag separates the text into paragraphs.

<b> </b> Any text that is between this tag will be displayed as bold.

<i> </i> Any text that is between this tag will be displayed in italic.

HTML is not case-sensitive. However, because other languages (such as XML) can be, it's best to use lowercase text for tags. (In case you're wondering, XML stands for "extensible markup language" and is a general-purpose specification for creating customized markup languages.)

Proofing and Troubleshooting HTML

If you're using a text editor and want to see what the HTML you just wrote will look like, save the document with a .html extension (e.g., homepage.html) and open it with a web browser. If the HTML does not display the way you want, the problem is probably either a spelling error or forgotten bracket. Organizing the tags so that they can be easily read is important - and becomes even more important with bigger web sites.

Once you get started, HTML gets even easier. Remember, too, that if you come across a web site and want to know how something is done, you can use the View Page Source feature in your browser. The HTML behind the website will be displayed.

In future blog entries, I will explain how to use tables to help organize content. I'll also discuss changing fonts and sizes, using backgrounds and colors, and adding images and links.


Interested in this topic? By joining CR4 you can "subscribe" to
this discussion and receive notification when new comments are added.
Guru
United States - Member - New Member Engineering Fields - Electrical Engineering - New Member

Join Date: Jul 2008
Posts: 683
Good Answers: 24
#1

Re: Basic HTML: An Introduction

07/29/2009 1:49 PM

Wow. I am very interested in this. I am not a very good programmer, but this may be up my alley.

I can't wait for the upcoming parts. I <3 color.... and images... YAY! <ecstatic>

Power-User
Popular Science - Weaponology - New Member Hobbies - Fishing - New Member

Join Date: Mar 2007
Location: US - NC
Posts: 233
Good Answers: 6
#2

Re: Basic HTML: An Introduction

07/29/2009 2:45 PM

Ditto ! good stuff - thanks

Guru
Popular Science - Weaponology - New Member United Kingdom - Member - New Member

Join Date: May 2007
Location: Harlow England
Posts: 10338
Good Answers: 207
#3

Re: Basic HTML: An Introduction

07/29/2009 4:18 PM

Good stuff...one day I shall have to do my own web site...how else can I take over the world?
Del

__________________
health warning: These posts may contain traces of nut.
Guru

Join Date: Mar 2007
Location: Etherville , U.K.
Posts: 9873
Good Answers: 47
#4

Re: Basic HTML: An Introduction

07/30/2009 5:10 AM

There's a "try it editor" where....

Why not just play with somebody else's html code.

Save it in notepad as whatever.html.

find the file in Windows explorer (or whatever). double click on it and it'll open up as a displayed web page. By resizing (drag the edges), you can see the notepad file and web page view of it at the same time. make changes to the notepad file (hitting save), then click refresh on the web-page view.

eager punters could have a go with this;

******

<html>
<head>
<title></title>
</head>
<body>
<!-- Put some text below this line -->
I like tinkering !!!!!!

<!-- Try what Krissy says -->
</body>
</html>
*******

Omit the *'s, save it as myguff.html in notepad. Resize the notepad view of the document (say half your screen). Find document via My Computer/Windows Explore and double-click to open as a web page (resize this too so you can still see your working document in notepad). Tweak away (and keep saving/refreshing).

__________________
...be afraid, be very afraid!
Power-User
United States - Member - Army Vet in the aviation industry Engineering Fields - Aerospace Engineering - New Member

Join Date: Mar 2008
Location: Bridgewater, Va.
Posts: 381
Good Answers: 12
#5

Re: Basic HTML: An Introduction

07/30/2009 8:51 AM

I'm an occasional web developer/author and edit/manage several web sites. In the past, I was a heavy user of Dreamweaver but have discontinued using it since Adobe bought it and mucked it up.

I recently ran across a wonderful FREE graphical html editor: Nvu

Get it here

There's also a good tutorial Here

Hooker <-- no association with the Nvu developers. I just appreciate well designed software.

Guest
#6
In reply to #5

Re: Basic HTML: An Introduction

07/30/2009 2:18 PM

www.w3schools.com is also an excellent source for many things web related, including html, xml/xsl, javascript and more...

Power-User
United States - Member - Army Vet in the aviation industry Engineering Fields - Aerospace Engineering - New Member

Join Date: Mar 2008
Location: Bridgewater, Va.
Posts: 381
Good Answers: 12
#7
In reply to #6

Re: Basic HTML: An Introduction

07/30/2009 2:23 PM

I absolutely concur. I've been a member of their forums for years...

Hooker

Power-User
India - Member - ROBOTICS Engineering Fields - Marine Engineering - New Member;I believe in integrating several disciplines of engineering.

Join Date: Jan 2008
Location: CHENNAI, INDIA
Posts: 205
Good Answers: 5
#8
In reply to #5

Re: Basic HTML: An Introduction

07/31/2009 3:05 AM

THANK YOU HOOKER

Power-User

Join Date: Jan 2008
Location: NY
Posts: 348
Good Answers: 18
#9

Re: Basic HTML: An Introduction

09/20/2009 7:30 AM

http://www.w3.org/

should have everything you need to begin developing basic html pages.

9 comments
Interested in this topic? By joining CR4 you can "subscribe" to
this discussion and receive notification when new comments are added.
Copy to Clipboard

Users who posted comments:

CUTiger (1), D.RAMAKRISHNA NAIDU (1), Del the cat (1), Guest (1), Hooker (2), Jaxy (1), Kris (1), mjb1962853 (1)

Previous in Blog: Confessions of a Photoshopaholic: Part 2   Next in Blog: Confessions of a Photoshopaholic: Part 3
You might be interested in: Publishing Software, Software Development Services, Website Development and Optimization Services