1 / 9

CSCI 1101 Intro to Computers

Explore the key concepts of HTML, including hypertext and markup language. Discover the maximum number of elements a web page can have and learn about the design considerations for creating impactful web pages. Compare the bottom-up and top-down approaches for developing HTML documents.

fjefferson
Download Presentation

CSCI 1101 Intro to Computers

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. CSCI 1101 Intro to Computers 7.1 Learning HTML

  2. Introduction • Web pages are written using HTML • Two key concepts of HTML are: • Hypertext (links Web pages together) and • Markup (embeds special tags in Web pages to structure and format them) • HTML = Hyper Text Markup Language

  3. A Web page, regardless of how complex it looks, can have a maximum of eleven elements. They are: text, hyperlinks, color, lists, images, image maps, sound, video, forms, frames, and tables Limits on web page content

  4. Design of Web pages • A Web page is content and design. • The design should enhance content presentation. • Page design is related to the goal of the page whether it is to sell a product or convey information. • When designing a Web page, Web authors should take advantage of HTML power such as links, colors, etc.

  5. What is a Markup language? • HTML Markup language uses tags • HTML tags convert Web page design into an actual Web page that can be viewed in a browser • HTML tags surround page content to format it

  6. How are html files displayed? • Web browsers render (interpret) HTML tags and display their results • Each web browser has it's own peculiarities and personality • An experienced web author knows to test their pages in a variety of web browsers

  7. What is a markup tag? • The generic format of an HTML tag is<tag_name> content goes here </tag_name> • HTML tags are categorized as • One-sided tags • Tags that do not require a "closing" tag • Two-sided tags • Matched pair tags - the closing tag uses the </ format. • Many HTML tags have attributes to provide finer control of the tag formatting results

  8. Bottom-up approach: write HTML code in a text editor, and then view the Web page in a browser Steps: Open a text editor Enter text and tags Save file as xxx.html Open the file in a browser to view the Web page Repeat above steps if you need to debug the page Top-down approach: build the Web page elements using an HTML editor, and then view the HTML code later Steps: Open an HTML editor Add HTML elements using the editor’s GUI Save the automatically generated HTML code in a file as xxx.html Exit the editor and view the page Methods of developing HTML documents

  9. Bottom-up Advantages Can use any text editor Allows complete control over page elements Disadvantages Requires understanding and knowing HTML code Elaborate designs can be time consuming Top-down Advantages Quick and easy to get started Elaborate designs easy to create Disadvantages Requires HTML editor software Errors can be difficult to trace and find Easy to create a page without any understanding of what is truly required Advantages and disadvantages for each

More Related