Scribd
Upload
22 views7 pages

Essential HTML Page Design Elements

Uploaded by

sandhyadevit
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
22 views7 pages

Essential HTML Page Design Elements

Uploaded by

sandhyadevit
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd

HTML

Assignment 1
HTML tags on text arrangement, style, color. Design a page which looks like the text given
below.

Assignment 1: Basic HTML Display Features


Here is an example of a horizontal rule:

To begin, we can change the

header size

and color of letters seen on the screen. The font size can be changed as
well, and actually gives more choices.

We can also change the appearance of words on the screen. This shows some differing
word types in a blocked quote.

Now is the time for all good people to come to the aid of their country.

That was also an example of a nested command.


Assignment 2
Basic HTML tags

Create a page that includes the following elements.


 Within the head section create a web page title (displayed in title bar of browser
window): My Favorite Things
 Use a color for the background for the body.
 A centered heading (use the largest heading size) of: My Favorite Things (remember to
turn off centering!)
 Include a horizontal rule underneath the heading that is colored, centered, 75% of the
screen’s width and has a size of 8.
 Include the following introductory paragraph, filling in the blanks with the appropriate
information for yourself. Use a font size of 4 and a font face of Comic Sans MS:
My name is _________ and I am a __________ at BCIPS. This web
page lists my favorite foods, favorite television shows.
 Remember to turn off the paragraph!
 Insert another blank line (a line break) after the paragraph.
 Using a heading size of 2, key the following heading: My Favorite Foods.
 Using an unordered list, include five of your favorite things to eat. Use a colored font
with a size of 4, with a font face of your choice
 Insert another blank line after the list.
 Using a heading size of 2, key the following heading: My Favorite TV Shows.
 Using an ordered list, list your top five favorite television shows. Use the same font
settings as the unordered list.
 Save the page as [Link]

Assignment 3
Create a web page including HTML image tag and anchor tag.
1. In notepad create a webpage using the following step by step guidelines. Make sure and
save your file in your HTML folder :
2. Make sure and use indentation and blank lines to keep your HTML easy to read!
3. Start your web page with an <html> tag
4. Add a heading <head> area with a <title> tag.
a. Your title should be: HTML 3 Lastname Firstname
b. Where Lastname and Firstname is YOUR Lastname and Firstname
c. Make sure and close out the head and title tags
5. You can now start the <body> section.
a. Add the following text using <H1> and </H1> tags: This Web page was
Designed by (your name)
b. Add the following text using <H2> and </H2> tags: My third HTML assignment
c. Use the <hr> to add a horizontal line
d. Insert an image to your web page.
1. Note: The following is very important. You should save your
image in the same folder as your web page.
2. You should then refer to your image with just the filename, and
NOT the entire pathname to the file.
e. Use the <hr> to add another horizontal line.
f. Enter a paragraph of text using the <p> tag.
i. Talk about things you have learned in html.
ii. Make sure the text in this paragraph is a color other than black.
iii. Add a link that takes you to your favorite webpage.
iv. Make sure and close out the <p> tag.
g. Use the <p> tag to start a new paragraph.
h. For review, add a three item ordered list.
i. Use </body> and </html> to close out your body and html tags.
Assignment 6
Create a frameset
Create a frameset like the one below.
Assignment 7
Create three web pages including your hobbies and educational qualifications.
Create your own home page Your html file should have the following:
 Proper use of <html>, <title>, <head>, <body> tags
 A couple of headers, paragraphs and maybe even a horizontal line. (Use the <h1> and </h1> tag
for a first level header; the <p> tag for a paragraph and <br /> for a line break; and the <hr> for a
horizontal line.
 An unordered list. Hint use the <ul>, </ul> and <li> tags
 An image or graphics file
 Explore your creative side

Assignment 8
Make a website
Using frames as an interface create a series of web pages on any theme of your choice. As a
minimum requirement to this assignment your webpage should…
• Consist of at least 3 frames.
• Contain at least 3 urls to internet and/or intranet sites that you can reference as
part of your job.
• Contain at least 3 references to documents/html files that you have created
• Be organized in a fashion that is logical and intuitive to you.
• Add color/textured backgrounds, add images, use different fonts, and use tables to make your site
interesting.

Common questions

Powered by AI

Creative elements like frames and colored backgrounds enhance user experience by improving the visual appeal and organization of web pages. Frames divide a page into sections, allowing simultaneous display of different content, whereas colored backgrounds can set thematic tones and increase engagement by making pages more aesthetically pleasing .

To organize an HTML webpage about personal interests, you can use headings (<h1>, <h2>), paragraphs (<p>), horizontal rules (<hr>), unordered lists (<ul> and <li> tags), and ordered lists (<ol> and <li> tags). These elements help structure the content into sections and lists, making it easier to read and visually appealing .

Using lists for content display, such as an unordered list for favorite foods and an ordered list for favorite TV shows, offers advantages like structuring information clearly, enhancing readability, and providing a logical sequence or hierarchy that guides the reader through the content .

Best practices for adding images to an HTML webpage include saving the image in the same folder as the HTML file and referring to the image by just the filename, not the entire pathname. This ensures that the image is correctly linked and avoids issues with file paths that may not match across different systems .

The basic elements necessary for creating a simple HTML webpage include using the <html> tag to start and end the document, a <head> section containing a <title> tag for the webpage's title, and a <body> section for the main content. Headers can be added using <h1>, <h2>, etc., while paragraphs and line breaks use the <p> and <br /> tags respectively. Horizontal rules can be added with the <hr> tag .

Creating a multi-page HTML website with frames requires considerations such as logical and intuitive organization for navigation, inclusion of multiple frames for diverse content display, appropriate links to both internal and external resources, and thoughtful use of styling elements like colors and fonts to maintain visual consistency and user engagement .

Text styling in HTML can be modified using font size, font face, and color attributes. Specific attributes mentioned include changing the paragraph font size to 4 and setting the font face to Comic Sans MS. Colors can be applied to text to enhance presentation, and these changes require inline styling or CSS for specification .

Horizontal rules (<hr>) can be used creatively in HTML webpages to separate content sections, enhance visual design, and add emphasis. Effective use involves setting properties such as color, alignment (e.g., centered), width (e.g., 75% of screen's width), and size (e.g., thickness of 8) to match the design theme and improve readability .

Key components for structuring text in the body of an HTML document include using headers for titles and section labels, paragraphs for blocks of text, and lists for item organization. It's essential to consistently use tags like <h1>, <p>, <ul>, and <ol>, and apply stylistic attributes such as font type and color to enhance readability and organization .

Hyperlinks in HTML webpages connect users to external and internal resources, enhancing navigability and user engagement. According to the assignments, hyperlinks should be included to connect to favorite web pages, using the <a> tag with an href attribute. Incorporating relevant links helps direct the user to further information .

You might also like