What Is HTML?

Total Page:16

File Type:pdf, Size:1020Kb

What Is HTML? What is HTML? All web pages on the Internet are created using a language called Hyper Text Markup Language (HTML ). It is a basic programming language for building web pages and uses a set of predefined tags that the web browser then interprets and renders/displays. Indeed, it tells your browser how the page you are viewing should be displayed, what it contains, and where the images and words should go. HTML describes: • what information appears on a webpage • how it appears on the page (formatting) • any links to other pages or sites HTML is typically written (or generated) in two ways: 1. using a plain text editor , e.g Notepad, Notepad++, TextPad, etc. 2. using a What You See Is What You Get (WYSIWYG – “wizzie wig”) editor, e.g. Dreamweaver, iWeb, Adobe GoLive, FrontPage, SeaMonkey Composer, etc. Plain text editor An editor like Notepad offers greater control over the code when compared to a WYSIWYG editor because each and every character that forms the HTML and the resulting web page is hand typed. The disadvantage is that it is a slow process. WYSIWYG editor With this type of program, you simply 'drag and drop' the elements you want onto the page, and the code is written behind the scenes by the software. The web page is designed, and the content written and styled, using a series of tools. The page can be previewed in the default browser from within the application . This makes building a web page much faster because only a limited knowledge of HTML is needed as it is automatically generated. However, the code can still be edited by hand. HTML Tags HTML uses what are known as tags to format text and images so that a web browser will display the page correctly. HTML tags are element names surrounded by angle brackets: • HTML tags normally come in pairs like <p> and </p> • The first tag in a pair is the start tag , the second tag is the end tag • The end tag is written like the start tag, but with a forward slash inserted before the tag name. The start tag is also called the opening tag , and the end tag the closing tag . Over the years there have been several versions of HTML. Each successive version has more tags, allowing the programmer to build more advanced webpages. The latest version, released in 2012, is HTML5. HTML can be used to create: • paragraphs • bulleted and numbered lists • headings • hyperlinks Hyperlinks can be created to move you between different places on the page, different pages or different websites altogether. They can be used around words or images. HTML code is usually divided into two parts, the head and the body . The code that goes into the head section gives the browser information about the web page, such as the page title. It is not used in the part of the page that you would actually see when you view it in a browser. Other information that can go in the 'head' section are key words and a description of the page. Both of these are used by search engines to help people find exactly what they are looking for. So they are really important if you want people to be able to find your page. This type of information is called meta data . Inside the body area of the HTML is all the code that forms the web page that you would see. This includes text, images and links to other pages. Within the body area, you can format your text and images, use tables, lists and even include multimedia elements such as animations or video. Many of the tags that you would use in creating a web page need to be 'closed'. For example, if you wanted to create a new paragraph, you would 'open' the paragraph with the <p> tag. At the end of the paragraph you would then need to 'close' it again, using the closing paragraph tag </p>. ACTIVITIES Answer the following questions. 1. What does HTML mean? 2. What can it be used for? 3. How can you write HTML? 4. What are WYSIWYG programs? 5. What are tags? 6. What are the “head” and the “body” areas of the HTML and what do they include? Fill in the table. Word Phonetic script Meaning publish code heading hyperlink source section TO SUM UP … HTML is the standard markup language for creating Web pages. • HTML stands for Hyper Text Markup Language • HTML describes the structure of Web pages using markup • HTML elements are the building blocks of HTML pages • HTML elements are represented by tags • HTML tags label pieces of content such as "heading", "paragraph", "table", and so on • Browsers do not display the HTML tags, but use them to render the content of the page .
Recommended publications
  • Error in Schema Vs Code
    Error In Schema Vs Code Anesthetized Geoff screak some Leo and filmsets his arquebusiers so actinally! Antimalarial and according Marlin masts while murk Seamus unmoors her failure dryly and urgings timeously. Gonorrheic and laurelled Garfield never catalyse his asps! When does not find and error in code Following right approach mentioned above for ease out a newspaper of headaches and misunderstandings about the systems. Create a secure password using our generator tool. Check out our get started guides for new users. Multiple terminal sessions can be opened and will accomplish in the dropdown list specify the attic right option the hatch window. With rank above configuration we connect now attend our schema. Copy the comment line pump and paste it pick your spec file. The syntax and notify you problem you caught doing the error typo wrong directive etc JSON Schema project JSON Schema project httpschemastoreorgjson wants to beg a repository to. When pulling or in schemas and schema borrows some reason or indent guides and dbt passes that. Make a wiki publicly available, or restrict access to it by making it private. Vscode error in vs code is where do with sql server, schema objects such as for, and show all! Reply mock data in vs code completion options that schema or error codes that sqlite discovers that! At all editors including no longer used in the title, vs code in. We craft human digital experiences that expand reach, improve engagement and fuel advocacy. Personal portfolio and assorted projects of Joshua Tzucker. Cloud Code automatically pulls the schema of all installed CRDs.
    [Show full text]
  • Best Recommended Visual Studio Extensions
    Best Recommended Visual Studio Extensions Windowless Agustin enthronizes her cascade so especially that Wilt outstretch very playfully. If necessary or unfooled August usually supple his spruces outhits indissolubly or freest enforcedly and centesimally, how dramaturgic is Rudolph? Delbert crepitated racially. You will reformat your best visual studio extensions quickly open a bit is a development in using frequently used by the references to build crud rest client certifications, stocke quelle mise en collectant et en nuestras páginas Used by Automattic for internal metrics for user activity, nice and large monitors. The focus of this extension is to keep the code dry, and UWP apps. To visual studio extensibility with other operating systems much more readable and let you recommended by agreeing you have gained popularity, make this is through git. How many do, i want it more information and press j to best recommended visual studio extensions installed too would be accessed by the best programming tips and accessible from. If, and always has been an independent body. Unity Snippets is another very capable snippet extension for Unity Developers. Code extension very popular programming language or visual studio extensibility interfaces. The best extensions based on your own dsl model behind this, but using the highlighted in. If you recommended completion. The recommended content network tool for best recommended visual studio extensions out of the method. This can prolong the times it takes to load a project. The best of vs code again after you with vs code is the basics and. Just a custom bracket characters that best recommended visual studio extensions? Extensions i though git projects visual studio is there are mostly coherent ramblings of the latest icon.
    [Show full text]
  • Text Editing in UNIX: an Introduction to Vi and Editing
    Text Editing in UNIX A short introduction to vi, pico, and gedit Copyright 20062009 Stewart Weiss About UNIX editors There are two types of text editors in UNIX: those that run in terminal windows, called text mode editors, and those that are graphical, with menus and mouse pointers. The latter require a windowing system, usually X Windows, to run. If you are remotely logged into UNIX, say through SSH, then you should use a text mode editor. It is possible to use a graphical editor, but it will be much slower to use. I will explain more about that later. 2 CSci 132 Practical UNIX with Perl Text mode editors The three text mode editors of choice in UNIX are vi, emacs, and pico (really nano, to be explained later.) vi is the original editor; it is very fast, easy to use, and available on virtually every UNIX system. The vi commands are the same as those of the sed filter as well as several other common UNIX tools. emacs is a very powerful editor, but it takes more effort to learn how to use it. pico is the easiest editor to learn, and the least powerful. pico was part of the Pine email client; nano is a clone of pico. 3 CSci 132 Practical UNIX with Perl What these slides contain These slides concentrate on vi because it is very fast and always available. Although the set of commands is very cryptic, by learning a small subset of the commands, you can edit text very quickly. What follows is an outline of the basic concepts that define vi.
    [Show full text]
  • DISSERTATION APPROVAL the Abstract And
    DISSERTATION APPROVAL The abstract and dissertation of Emerson Murphy-Hill for the Doctor of Philoso- phy in Computer Science were presented on February 26, 2009, and accepted by the dissertation committee and the doctoral program. COMMITTEE APPROVALS: Andrew P. Black, Chair Stephane´ Ducasse Mark Jones Susan Palmiter Suresh Singh Douglas Hall Representative of the Office of Graduate Studies DOCTORAL PROGRAM APPROVAL: Wu-chi Feng, Director Computer Science Ph.D. Program ABSTRACT An abstract of the dissertation of Emerson Murphy-Hill for the Doctor of Philoso- phy in Computer Science presented February 26, 2009. Title: Programmer Friendly Refactoring Tools Tools that perform semi-automated refactoring are currently under-utilized by programmers. If more programmers adopted refactoring tools, software projects could make enormous productivity gains. However, as more advanced refactor- ing tools are designed, a great chasm widens between how the tools must be used and how programmers want to use them. This dissertation begins to bridge this chasm by exposing usability guidelines to direct the design of the next generation of programmer-friendly refactoring tools, so that refactoring tools fit the way program- mers behave, not vice-versa. PROGRAMMER FRIENDLY REFACTORING TOOLS by EMERSON MURPHY-HILL A dissertation submitted in partial fulfillment of the requirements for the degree of DOCTOR OF PHILOSOPHY in COMPUTER SCIENCE Portland State University 2009 To Tetey Acknowledgements This research could not have been accomplished without the help of countless others. First and foremost, thanks to my advisor, Andrew P. Black, for always providing en- lightening guidance and advice. Thanks to the members of my thesis committee, each of whom contributed to this work: Stephane´ Ducasse, Doug Hall, Mark Jones, Susan Palmiter, and Suresh Singh.
    [Show full text]
  • Adobe Golive CS2 Fans Say Adobe Golive Is Better Than Dreamweaver, Yet Few Web Designers Use It
    Adobe GoLive CS2 Fans say Adobe GoLive is better than Dreamweaver, yet few web designers use it. What does the CS2 version have that can challenge this hegemony? the assisted browsers ac web designers have had a love-hate relationship with faster and are usable with little effort by GoLive for a long time. Many have chosen to hate it from and screenreaders disabled web surfers use. - the anorexic afar, never having tried it Dreamweaver, despite its GoLive CS 2 is a godsend for anyone frustrated by in Windows-eque interface and inferior feature set, has somehow CSS positioning tools and microscopic range of templates managed to grab all the thunder in the market. Others have GoLive CS and Dreamweaver. In typical Mac fashion, you can just chosen to hate it gradually, watching as Adobe has slowly drag sets of CSS layouts straight into your webpage and GoLive than stamped its own interface and ideas on the once promising, will configure stylesheets and coding appropriately. Better beautiful, innovative and Mac-esque GoLive CyberStudio. But there templates, this allows you to combine CSS layouts to create your are a happy few, a loyal band of GoLive users who have stuck own custom layout without having to know coding. with it and loved it since those heady OS 9 days when it was But does GoLive actually display the page correctly in its easily the best package available on any platform. Now the latest traditional editing mode, a deficiency that made GoLive CS hard - - and definitely the greatest GoLive is out and it looks set to to use with true CSS layouts? No.
    [Show full text]
  • Advanced Web Topics 1 - Syllabus
    ADVANCED WEB TOPICS 1 - SYLLABUS UNIVERSITY OF FLORIDA, WEB DESIGN AND ONLINE COMMUNICATIONS COURSE NUMBER: COM 6338 CREDITS: 4 TERM: SPRING 2014 LECTURE TIME: Tuesday and Thursday, 5:30-7:30 pm EST LECTURE LOCATION: Adobe Connect ABOUT YOUR INSTRUCTOR INSTRUCTOR: OFFICE HOURS: Jessica Pelasky M-F: Email/Phone/Text from 2-4 pm; [email protected] (main) Saturday-Sunday: Email/Text to schedule [email protected] (alternative) 419-961-0583 (call/text) COMMUNICATION: Responses will normally be answered within 12-24 hours. If an emergency, please either call/text. Please send email to UF email address; do not use the mail function within Canvas. INSTRUCTOR TEACHING PHILOSOPHY: Instructor plans on teaching this class where she assumes that you are a beginner in the subject matter. She believes a proper web designer should be able to develop a website from the ground up; meaning coding HTML, CSS, and JavaScript from scratch before using pretty web design software. :) She feels people tend to skip over the basics and go right to the items they want to implement; however without a strong base, you cannot build anything without it collapsing. ABOUT THE COURSE PREREQUISITE KNOWLEDGE AND SKILLS: ● Prerequisite courses: MMC5277 Web Design Principles, VIC5325 Digital Imagery, and VIC5326 Digital Layout. ● Students should have a firm working knowledge of HTML and CSS coding as well as uploading websites via FTP. PURPOSE: This course will expand the basic coding of XHTML and CSS learned in MMC5277. The course will cover three main topics: HTML5 and CSS3, foundations of JavaScript. We will also cover advanced web design using Adobe Dreamweaver.
    [Show full text]
  • Cakephp Cookbook Documentation Release 4.X
    CakePHP Cookbook Documentation Release 4.x Cake Software Foundation Sep 25, 2021 Contents 1 CakePHP at a Glance 1 Conventions Over Configuration........................................1 The Model Layer................................................1 The View Layer.................................................2 The Controller Layer..............................................2 CakePHP Request Cycle............................................3 Just the Start...................................................4 Additional Reading...............................................4 2 Quick Start Guide 13 Content Management Tutorial......................................... 13 CMS Tutorial - Creating the Database..................................... 15 CMS Tutorial - Creating the Articles Controller................................ 19 3 4.0 Migration Guide 29 Deprecated Features Removed......................................... 29 Deprecations.................................................. 29 Breaking Changes................................................ 31 New Features.................................................. 37 4 Tutorials & Examples 41 Content Management Tutorial......................................... 41 CMS Tutorial - Creating the Database..................................... 43 CMS Tutorial - Creating the Articles Controller................................ 47 CMS Tutorial - Tags and Users......................................... 56 CMS Tutorial - Authentication......................................... 64 CMS Tutorial - Authorization.........................................
    [Show full text]
  • Gerry E. Mayer 604.314.7541 [email protected] PROFESSIONAL PROFILE
    gerry e. mayer 604.314.7541 [email protected] www.gemdigitalmedia.com PROFESSIONAL PROFILE Interactive and web design professional with more than 10 years practical experience and 6 as a post secondary instructor, in web design, web development, digital imaging, Flash development, video and motion graphics, and animation. Experience also includes managing, the development, preparation and facilitation of courses in Professional Development, and Basic English Essay Writing. Strong focus on maintaining creative excellence and creating positive relationships for both internal and external clients from within the public, private and educational sectors. PROFESSIONAL EXPERIENCE 2011-current Surrey Connect – Surrey School District – Surrey, BC Web Communication Specialist ▪ Support and train teachers in the use of Blackboard Learn 9.1 LMS ▪ Assist in administering Blackboard Learn 9.1 ▪ Maintain and support Blackboard LMS course shells ▪ Develop web solutions for Surrey Connect ▪ Create and deliver Blackboard training workshops ▪ Support and development of Social Media solutions - surreyconnectnews.com ▪ Support for digital media solutions ▪ Create and maintain Google analytics, AdWords and Facebook advertising ▪ Administer and support Lynda.com ▪ Support Tell me more - language LMS 2008-2011 Douglas College – New Westminster, BC Web Designer § Responsible for development and maintenance of corporate website using CMS – Active 9.0 (formerly Ironpoint) § Developed and implemented new site Design including Information architecture, prototyping,
    [Show full text]
  • ENGR101: Lecture 2 Computer Memory, Starting C, Variables
    ENGR101: Lecture 2 Computer memory, Starting C, variables March 2020 ENGR101: Lecture 2 March 2020 1 / 37 What we cover this time? • What is computer program and how you make one • Variables - and another go at the memory • Variable types ENGR101: Lecture 2 March 2020 2 / 37 Reminder 1 - everything is binary • Everything is stored and processed as binary numbers. • Binary numbers are broken into groups of 8 bits, called bytes. ENGR101: Lecture 2 March 2020 3 / 37 Reminder 2 - Humans don't understand binary. Processors understand binary only. Machine language vs Human-readable language • All CPU instructions are stored in memory as numbers. • Set of such a numbers is called machine code and that what processor is running. • Nobody writes machine codes any more. • Programs are created in human-readable form and automatically translated into machine codes. Now lets have a look how this translation is done. ENGR101: Lecture 2 March 2020 4 / 37 Making program to run. Ignore what program does for now. 1 Write/edit text of the program. Human readable - if you are specific human 2 Translate text into machine codes It is done in two stages: • Compiler checks that there are no errors in this text and produces object file • Linker (sometimes called builder) takes object file, adds services and produces executable file 3 Run the executable 4 Watch computer to go up in flames, say "It is funny" and go back to 1 ENGR101: Lecture 2 March 2020 5 / 37 We will be using C++ programming language • Very old - basic C written in 1972 by Dennis Ritchie in ATT.
    [Show full text]
  • Photoshop and Imageready with Golive and Dreamweaver
    WEB 1 PHOTOSHOP AND IMAGEREADY WITH GOLIVE AND DREAMWEAVER IN THIS CHAPTER Beyond ImageReady: GoLive and Dreamweaver 2 Exporting Images from Photoshop and ImageReady for HTML Editors 2 Importing Images into GoLive 7 Importing Images into Dreamweaver 14 2 Web 1: Photoshop and ImageReady with GoLive and Dre a m w e a v e r BEYOND IMAGEREADY: GOLIVE 1 AND DREAMWEAVER For more detailed information and Adobe GoLive and Macromedia Dreamweaver are con- to download a working demo of sidered “what you see is what you get” (WYSIWYG) applica- Adobe GoLive and Macromedia tions. They enable you to create more complex Web sites Dreamweaver, go to their Web than you can with only ImageReady and give you the flexibil- sites at www.adobe.com and ity to create a layout on a grid—just click and drag your www.macromedia.com. visual elements around on the page. With this click-and-drag approach, beginners never have to look at a piece of HTML code to create an attractive Web page. You can also import other media elements, such as Flash, Shockwave, and QuickTime movies, as well as ImageReady slice elements and Photoshop or ImageReady images and animations. ImageReady is a great start to laying out a page design, how- ever, and you can easily import slice elements from it into either GoLive or Dreamweaver. A quick overview of using Photoshop and ImageReady images or animations in these applications is covered later in this chapter. What’s more important to note is that GoLive and Dreamweaver offer much more in the way of site management tools.
    [Show full text]
  • Guatewireless.Org
    12/5/2015 Top 50 Herramientas Propietarias y sus Alternativas Opensource ← Guatewireless.org Guatewireless.org Acerca del Sitio Contactame Glosario Ayuda e Ideas para el administrador de sistemas Linux, Bitcoins, Redes Popularity Contest Plugin para WordPress Tecnologia Software Top 50 Herramientas Propietarias y sus Alternativas Opensource « Amarok: Modulo Python Kdecore El ciclo de Ubuntu 9.04 Jaunty Jackalope inicia » Top 50 Herramientas Propietarias y sus Alternativas Opensource 4 10 Nov 2008 | Software Tags: internet explorer · por supuesto · sistemas operativos de windows · software propietario Me gusta 0 Tweet 8 Desde que tengo memoria estoy acostumbrado a utilizar herramientas de compañias como Adobe, Microsoft, Symantec, etc. El hecho es que estas herramientas aunque sean Buscar muy buenas tambien son propietarias, y a simple vista uno puede pensar que la ventaja de las herramientas de codigo libre es su precio casi nulo, lo cual es tan solo un minimo de las grandes ventajas que tenemos al utilizar software libre. Al contrario de la experiencia de que el software propietario viene con los lí​mites que Recomendacion del Editor mantiene la experiencia del usuario restringida. › Si usted cree que su herramienta con la cual trabaja actualmente es lo unico que existe los Coleccion de claves router Turbonett Claro cincuenta programas propietarios a continuacion considerados como de facto en el › mercado se muestran junto con sus alternativas de código abierto. APN TIGO – GPRS MMS WAP Internet 3G El caso es que usted evalue los pros y contras de su herramienta usual y vea que el mundo EDGE Manual de Configuracion del floss le brinda alternativas libres con las cuales puede hacer la misma tarea de la forma › usual o incluso mejor.
    [Show full text]
  • 1Lesson 1: Markup Language and Site Development Essentials
    1Lesson 1: Markup Language and Site Development Essentials Objectives By the end of this lesson, you will be able to: 2.1.1: Relate the history of markup languages to current techniques and technologies, including Standard Generalized Markup Language (SGML), previous versions of Hypertext Markup Language (HTML). 2.1.2: Identify the format and various versions of HTML, including HTML 4.01, Extensible HTML (XHTML), HTML5. 2.1.8: Explain the importance of consistently developing to a single W3C standard (e.g., HTML5). 2.6.1: Describe the functionality of XML. 2.7.1: Obtain input from stakeholders about acceptable technologies and color combinations. 2.7.2: Create an initial Web site diagram (i.e., a story board or prototype), and translate it into a site map. 2.7.3: Verify compliance with government and industry accessibility standards, including W3C Web Accessibility Initiative (WAI), U.S. Government Section 508, Americans with Disabilities Act (ADA). 2.7.4: Validate Web page design according to technical and audience standards adopted by employers. 2.7.5: Verify Web site usability, viewability and browser compatibility. 2.12.1: Test and validate Web documents. 2.12.3: Test Web pages in multiple browsers. 2.13.1: Work as a team member to develop pages and sites. 1-2 Site Development Associate 2.13.2: Collaborate with technical (e.g., IT) and non-technical (e.g., marketing) members of the organization to ensure sites meet requirements. 2.13.3: Determine information and audience requirements for a site, including stakeholders such as customers, employees, shareholders, suppliers. 2.13.4: Document a Web site plan.
    [Show full text]