HTML Links and navigation

HTML Links and navigationBasharat Mahmood, Department of Computer Science,CIIT,Islamabad, Pakistan.1What is HTML?Basic Structure of HTML pageBody tag attributesText formatting tagsLists2Basharat Mahmood, Department of Computer Science, CIIT, Islamabad, Pakistan.Summary of the previous lectureOutlineHow to link between pages of your site (internal links)How to link to other sites (external)How to structure the folders on your web siteInternal document referencesLink attributesBasharat Mahmood, Department of Computer Science,CIIT,Islamabad, Pakistan.31. HTML linksThe crux of HTML is its capability to reference countless other pieces of information easily on the internetWhen you link to another page in your own web site, the link is known as an internal linkWhen you link to a different site, it is known as an external linkBasharat Mahmood, Department of Computer Science,CIIT,Islamabad, Pakistan.41.1 Internal linksThe element is used to link another documentAnything between the opening tag and the closing tag becomes part of the link that users can click in a browserBasharat Mahmood, Department of Computer Science,CIIT,Islamabad, Pakistan.51.1 Internal linksTo link another page, href attribute of opening tag of is usedthe value of the href attribute is the name of the file you are linking toFor example: Click here Basharat Mahmood, Department of Computer Science,CIIT,Islamabad, Pakistan.61.1 Internal linksBasharat Mahmood, Department of Computer Science,CIIT,Islamabad, Pakistan.71.1 Internal linksBasharat Mahmood, Department of Computer Science,CIIT,Islamabad, Pakistan.81.1 Internal linksBasharat Mahmood, Department of Computer Science,CIIT,Islamabad, Pakistan.91.2 External linksTo link the page of another website, again the href attribute of opening tag of is used the value of the href attribute is the full web address for the page you want to link to rather than just the filename Click here Basharat Mahmood, Department of Computer Science,CIIT,Islamabad, Pakistan.101.2 External links Basharat Mahmood, Department of Computer Science,CIIT,Islamabad, Pakistan.112. Directory StructuresA directory is simply another name for a folder on a web siteThe root directory (or root folder) is the main directory that holds the whole of your web siteA subdirectory is a directory that is within another directoryA parent directory is a directory that contains another directoryBasharat Mahmood, Department of Computer Science,CIIT,Islamabad, Pakistan.12Basharat Mahmood, Department of Computer Science,CIIT,Islamabad, Pakistan.13Entertainment index.html Videos videos.html Films englishfilms.html urdufilms.html Songs audio.html video.html2. Directory Structures2.1 Referencing a web pageSame Directory: When you want to link to, or include, a resource from the same directory, you can just use the name of that fileSubdirectory: sub-directory//file-nameParent directory: ../file-nameBasharat Mahmood, Department of Computer Science,CIIT,Islamabad, Pakistan.14....Basharat Mahmood, Department of Computer Science,CIIT,Islamabad, Pakistan.15Entertainment index.html Videos videos.html Films englishfilms.html urdufilms.html Songs audio.html video.html2.1 Referencing a web page3. Internal document referencesStep 1: Mark locationsStep 2: linkBasharat Mahmood, Department of Computer Science,CIIT,Islamabad, Pakistan.163. Internal document referencesBasharat Mahmood, Department of Computer Science,CIIT,Islamabad, Pakistan.173. Internal document referencesBasharat Mahmood, Department of Computer Science,CIIT,Islamabad, Pakistan.184. More attribute for accesskey: ..tabindex:.target:.title:.Basharat Mahmood, Department of Computer Science,CIIT,Islamabad, Pakistan.194. More attribute for Basharat Mahmood, Department of Computer Science,CIIT,Islamabad, Pakistan.20SummaryInternal linksExternal linksDirectory StructureInternal document referenceSome attributes of Basharat Mahmood, Department of Computer Science,CIIT,Islamabad, Pakistan.21Chapter 2, Beginning HTML, XHTML,CSS, and JavaScript, by Jon Duckett, Wiley Publishing; 2009, ISBN: 978-0-470-54070-1. 22Basharat Mahmood, Department of Computer Science, CIIT, Islamabad, Pakistan.References