Rss Feed

‘HTML’ Category

  1. Basic HTML Tutorial #2 – Paragraphs

    March 19, 2011 by admin

    Don't forget to recommend this page on Facebook and follow PD on Twitter. Thank you!

    html basics notepad1 Basic HTML Tutorial #2 Paragraphs

    Welcome to second lesson in HTML! This time we’re going to talk about paragraphs and how to add them to your HTML document.

    Before you start, you might want to take a look at Lesson 1: How To Set Up A Basic Page Skeleton.

    1. Fire up your favorite editor

    2. Type in the following (or cut and paste):

    <!DOCTYPE>

    <html>

    <head>

    </head>

    <body>

    <p>This is my first paragraph</p>

    <p>This is my second paragraph</p>

    </body>

    </html>

    As you can see, we took the code from our first lesson and added few <p> and </p> tags to body of the document. Those tags, as you might have guessed, signify the beginning and the end of the paragraph.

    As a result, you should see the following in your browser:

    This is my first paragraph

    This is my second paragraph

    Things to do/homework – Go to any website, right-click and choose “View Page Source”.  Study the paragraph structure and try to implement it in your own page.

    Useful Resources: HTML Dog

    Category HTML, Tutorials | Tags: ,, | 3 Comments

  2. HTML Beginner Tutorial – How To Set Up A Basic Page Skeleton

    March 8, 2011 by admin

    html basics notepad HTML Beginner Tutorial How To Set Up A Basic Page Skeleton

    Welcome to beginner HTML lessons!

    Our first step would be to create a page skeleton – something that we could later (re)use in all of our HTML projects.

    1. Fire up your favorite editor (suggestions – Coda (Mac only), Notepad, Notepad++).

    Although you could use Dreamweaver, its not recommended since DW adds a lot of excessive code to the document.

    2. Lets create a page skeleton! Type in the following (or cut and paste):

    <!DOCTYPE>

    <html>

    <head>

    </head>

    <body>

    </body>

    </html>

    3. Save your file with .html extension and open it up in any browser.

    There might not seem to be anything yet, but you just set up a foundation for your future work. Congratulations!

    Tags used in our first HTML document

    <!doctype> – See above – started appearing only in HTML5.

    <html> – Tells the browser that this is an HTML document.

    <head> – Includes all the head elements. Elements inside <head> can include scripts, provide meta information and more.

    <body> – Defines the document’s body. This is where all the stuff that you want to see in your browser’s main window should go – text, hyperlinks, images etc.

    Note – Tag allows you to define the beginning and the end of each element. Tags could be divided into two categories: opening ones (<>) and closing ones (</>).

    For more info – see HTML Dog.

    Things to do / homework

    Go to any website, right click on the page and choose “view page source”. Now you should study what you see – you can also copy the code to your editor and make changes to it / play around.

    Did you enjoy the tutorial? What would you like to see included in the next HTML tutorial?

    Category HTML, Tutorials | Tags: ,,, | 2 Comments