Review Of HTML - UNCW Faculty And Staff Web Pages
Review of HTMLChapter 3Randy Connolly and Ricardo HoarRandy Connolly and Ricardo HoarFundamentals of Web Development 2017 Pearsonnd Ed.Fundamentals of Web Development2http://www.funwebdev.com
What Is HTML and Where Did It Come from?HTML HTML is defined as a markup language. markup is a way to indicate information about the contentthat is distinct from the content HTML has been through many versions and branches, thedetails of which might matter if you ever see old HTMLcode.Randy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
What Is HTML and Where Did It Come from?MarkupRandy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
HTML SyntaxElements and Attributes HTML documents are composed of textual content andHTML elements HTML element encompasses the element name within angle brackets (i.e., the tag) and HTML elements can also contain attributes. the content within the tag.Randy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
HTML SyntaxElements and AttributesAn empty element does not contain any text content;instead, it is an instruction to the browser to do something. In XHTML, empty elements had to be terminated by atrailing slash. In HTML5, the trailing slash in empty elements is optional.Randy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
HTML SyntaxNesting HTML ElementsRandy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
HTML SyntaxNesting HTML ElementsRandy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
HTML SyntaxNesting HTML ElementsRandy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
HTML SyntaxNesting HTML ElementsRandy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
Semantic MarkupHTML5Focus on the structure of the document, not the visualAdvantages: Maintainability Performance Accessibility (http://www.w3.org/WAI ) Search Engine OptimizationRandy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
Structure of HTML DocumentsA simple exampleRandy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
Structure of HTML DocumentsDOCTYPEDOCTYPE Short for Document Type Definition tells thebrowser what type of document it is about to process !DOCTYPE html Randy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
Structure of HTML DocumentsA slightly more complex documentRandy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
Structure of HTML DocumentsHead and BodyHTML5 does not require the use of the html , head , and body elements (but most developers continueto use them, and you should too!) html contains all the other HTML elements in thedocument (Item 2 in previous slide) head contains descriptive elements about thedocument, such (title, style sheets, JavaScript filesetc.) (Item 3) body contains content to be displayed by thebrowser (Item 4)Randy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
Structure of HTML DocumentsSome more common elements The meta element (Item 5) declares that the characterencoding for the document is UTF-8. Item 6 specifies an external CSS style sheet file with link that is used with this document. Item 7 references an external JavaScript file using script Randy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
Quick Tour of HTML ElementsA document to walk throughRandy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
Quick Tour of HTML ElementsHeadings HTML provides six levels of heading(h1 - h6) Headings are also used by the browser tocreate a document outline for the page.Randy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
Quick Tour of HTML ElementsParagraphs and Divisions p tag is a container for text and other HTMLelements div also a container element and is used to createa logical grouping of contentRandy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
Quick Tour of HTML ElementsLinks Links are an essential feature of all web pages Links use the a element (the “a” stands for anchor).Randy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
Quick Tour of HTML ElementsLinksRandy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
Quick Tour of HTML ElementsURL Relative ReferencingRelative Link TypeExampleSame directory a href "example.html" Child Directory a href "images/logo.gif" Grandchild/Descendant Directory a href "css/images/background.gif" Parent/AncestorDirectory a href "./about.html" a href "././about.html” Sibling Directory a href "./images/about.html" Root Reference a href "/images/background.gif" Randy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
Quick Tour of HTML ElementsInline Text Elements they do not disrupt the flow a abbr br cite code em mark small span strong time Randy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
Quick Tour of HTML ElementsImagesRandy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
Quick Tour of HTML ElementsCharacter EntitiesThese are special characters for symbols for which there is either no easy way to type them via a keyboard or which have a reserved meaning in HTML (like“ “)EntityDescription Nonbreakable space< > © ™ Randy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
Quick Tour of HTML ElementsLists Unordered Lists ul Ordered Lists ol Description Lists dl Randy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
Quick Tour of HTML ElementsListsRandy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
HTML5 Semantic Structure ElementsRandy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
HTML5 Semantic Structure ElementsHeader and FooterRandy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
HTML5 Semantic Structure ElementsHeader and Footer A header element isintended to usuallycontain the section’sheading (an h1– h6element), but this is notrequired. The header element canalso be used to wrap asection’s table ofcontents, a search form,or any relevant logos.Randy Connolly and Ricardo Hoar header img src "logo.gif" alt "logo" / h1 Fundamentals of WebDevelopment /h1 . /header article header h2 HTML5 Semantic StructureElements /h2 p By em RandyConnolly /em /p /header . /article Fundamentals of Web Development - 2nd Ed.
HTML5 Semantic Structure ElementsNavigation header img src "logo.gif" alt "logo" / h1 Fundamentals of Web Development /h1 nav ul li a href "index.html" Home /a /li li a href "about.html" About Us /a /li li a href "browse.html" Browse /a /li /ul /nav /header Randy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
HTML5 Semantic Structure ElementsMain, article, section main is meant to contain the main unique content ofthe document. main provides a semantic replacement for markup suchas div id "main" or div id "main-content" section is a much broader element, while the article element is to be used for blocks of content thatcould potentially be read or consumed independently ofthe other content on the page The aside element can be used for sidebars, pullquotes, groups of advertising images, or any othergrouping of nonessential elementsRandy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
HTML5 Semantic Structure ElementsFigure and Figure CaptionsRandy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
HTML5 Semantic Structure ElementsDetails and SummaryRandy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
Tools InsightWYSIWYG EditorsRandy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
Tools InsightCode EditorsRandy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
Tools InsightIntegrated Development EnvironmentsRandy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
Tools InsightCloud-Based EnvironmentsRandy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
Tools InsightCode PlaygroundsRandy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
END OF CH. 3Randy Connolly and Ricardo HoarFundamentals of Web Development - 2nd Ed.
In HTML5, the trailing slash in empty elements is optional. Elements and Attributes. Randy Connolly and Ricardo Hoar Fundamentals of Web Development - 2 nd Ed. HTML Syntax Nesting HTML Elements. Randy Connolly and Ricardo Hoar . Nonbreakable space
UNCW grades are reported on your college transcript from UNCW and you must report your attendance at UNCW to all colleges you apply to in the future Earning poor grades in UNCW courses such as “D’s” or “F’s” could impact your Financial Aid standing after high school graduation All UNCW
Intro to HTML / CSS Rachel Starry UrsinusCollege, Tech Play Day May 31, 2018 * HTML Hyper Text Markup Language * HTML is the standard language for creating web pages. What is HTML? HTML Version Year HTML 1991 HTML 2.0 1995 HTML 3.2 1997 HTML 4.01 1999 HTML5 2014 * "HyperText" uses hyperlinks: these allow you
The iends of UNCW. Fr. is a volunteer organization that formed in December 1963 to help Wilmington College (now UNCW) increase the library's holdings from 11,000 volumes to 50,000 volumes —a minimum requirement at the time for accreditation as a four-year institution. The Friends have been steadfast UNCW supporters for more 50 years.
History of HTML / CSS HTML 1.0 - 1993 - The Good Old Days - life was simple HTML 2.0 - 1995 - Some interesting layout features - abused CSS 1 - 1996 HTML 3.2 - 1997 HTML 4.0 - 1997 - Layout moving toward CSS CSS Level 2 - 1998 HTML 4.01 - 1999 - What we use today HTML has evolved a *lot* over the years - as computers and networks have gotten faster.
History of HTML / CSS HTML 1.0 - 1993 - The Good Old Days - life was simple HTML 2.0 - 1995 - Some interesting layout features - abused CSS 1 - 1996 HTML 3.2 - 1997 HTML 4.0 - 1997 - Layout moving toward CSS CSS Level 2 - 1998 HTML 4.01 - 1999 - What we use today HTML has evolved a *lot* over the years - as computers and networks have gotten faster.
HTML i About the Tutorial HTML stands for Hyper Text Markup Language, which is the most widely used language on Web to develop web pages. HTML was created by Berners-Lee in late 1991 but "HTML 2.0" was the first standard HTML specification which was published in 1995. HTML 4.01 was a major version of HTML and it was published in late 1999.
3.2 W3C: HTML 3.2 Specification 1997-01-14 4.0 W3C: HTML 4.0 Specification 1998-04-24 4.01 W3C: HTML 4.01 Specification 1999-12-24 5 WHATWG: HTML Living Standard 2014-10-28 5.1 W3C: HTML 5.1 Specification 2016-11-01 Examples Hello World Introduction HTML (Hypertext Markup Language) uses a markup system composed of elements which represent .
Why should I create a UNCW ePortfolio? UNCW ePortfolio encourages engagement in active reflection and meaning making. Students reflect on on the principles central to their academic discipline of study through their related coursework and co-curricular experiences. UNCW ePortfolio is a portable platform that is easy
