Learn the difference between Absolute and Relative linking. Also see how to link to other html pages in your website folder structure. ITLS 5265 & 6265
This video is part of the Udacity course "Linux Command Line Basics". Watch the full course at https://www.udacity.com/course/ud595
This tutorial is about file paths. You'll learn how to determine the correct relative file path, and how to use absolute file paths. Sponsored by DevMountain. Get yourself career ready, check out their website: http://goo.gl/enNbQV Don't forget to tell them I sent you. Patrons can download the code here: https://www.patreon.com/posts/7248977 Follow me on social media: Twitter: https://twitter.com/QuentinWatt Facebook: https://www.facebook.com/quentinwatt Instagram: https://www.instagram.com/quentinwatt Snapchat: quentinwatt92 Become a Patron: https://www.patreon.com/QuentinWatt Subscribe to my vlog channel: https://www.youtube.com/c/Quentin Subscribe to this channel: https://www.youtube.com/QuentinWatt Please note: I do not offer web development services, private tutoring, or "assistance" on school or university projects. I am not an online support service, and I'm not interested in setting up a "start up" business with viewers.
Use absolute URLs for links to other people's sites; use relative URLs for links within your site.
This video is made for learning about difference between relative and absolute pathname in HTML tutorial Hindi. Relative Versus Absolute Pathnames An important point to remember when creating links is to make sure the correct URL is given. In order to provide a link to documents in other directories, the complete path from the current document to the linked document must be indicated. For example, a link to a file called "abc.html" located in the subdirectory "xyz" would be written as: A HREF="xyz/abc.html" PQR /A These are called relative links because the path to the file being linked to is specified relative to the location of the current file. The absolute pathname (ie., the complete URL) of the file could also be used, but relative links are more efficient in accessing a server. They also have the advantage of making documents more "portable" -- for instance, several web pages stored in a single folder on a local computer, with relative hyperlinks between each other, could be uploaded to a web server together, where the links would continue to work just as they do within a locally stored copy. The exception to this is when links are made to websites on other servers the absolute pathway must be given (ie., the complete URL). Thus the relative pathway for this page is: A HREF="lesson5.htm" Whereas the absolute pathway is: A HREF="www.tutorialshut.com/htmltutorial/lesson5.htm"
All my videoes can be seen on my homepage www.gauteferstad.com. In this tutorial we look at how to link different pages located in different folders. This is a continuation of tutorial 10, where we linked pages residing in the same folder. We are using relative links.
http://codebabes.com/courses/html-virgin/html-links-and-images Ok, now we have a few elements on our HTML page. But it's called the world wide web right? The thing that really makes the web work are links. Links to pages you like. Links to Ryan Gosling pictures. Links to pictures of babes like me. Links to all the things! You do this with the almighty A tag. By itself the A tag creates a hyperlink and you tell the link where to go with the H REF attribute. Add HREF then equals, and the link you want in quotes. You can make this an absolute link like HTTP codebabes.com or a relative link to something within your website. Let's say we had another html file in our directory, we could link to this with a relative link. So the href attribute would look like HREF equals page 2 dot html. The browser already knows the html file you're viewing is in the website directory, so it looks for page 2 dot html relative to that location, hence the name relative link. Pages full of text and links are great, but let's face it, a little boring. Time to spice things up! Let's add some images! You wouldn't be able to look at babes online all day if it weren't for images! To add an image to a website you need to use the IMG tag. Let's look at an example. Image tags are an example of a tag that doesn't have to be closed. Here is what an image tag looks like: http://codebabes.com/courses/html-virgin/html-links-and-images The SRC or source attribute lets the browser know where to find the image within your web directory, or you can specify some other image on the internet if you have it's full url, which would be called an absolute link. Let's open our site folder and add an image directory. I'll put a babelicious picture of myself in there to reference. Sometimes if people need to resize an image you can use the optional height and width attributes, if they are not included the browser will just display the image at it's full size. The alt attribute is for accessibility and let's people who are using screen readers or other tools know what the image is about. Alright, nice work, now we'll move onto html layout, hope you can still concentrate. http://codebabes.com/courses/html-virgin/html-links-and-images
HTML is a markup language used in most of the pages of the World Wide Web. HTML files are text files that, unlike completely plain text, contain additional formatting markup—sequences of characters telling web browsers what parts of text should be bold, where the headings are, or where tables, table rows and table cells start and end. HTML may be displayed by a visual web browser, a browser that reads the text of the page to the user, a braille reader that converts pages to a braille format, an email client, or a wireless device like a cellular phone. Hyperlinks: ======== Hyperlinks are the basis of navigation of the internet. They are used for everything from moving around various bookmarks in the same page, to downloading applications and jumping to web pages on other web servers. Absolute vs. Relative Links ===================== Before we get into creating a hyperlink (or link for short), we need to discuss the difference between an Absolute URL and a Relative URL. First, the Absolute URL can be used to direct the browser to any location. For example, an absolute URL might be : http://www.google.co.za/ However, when there is a need to create links to multiple objects in the same directory tree as the web page, it is a tiring procedure to repeatedly type out the entire URL of each object being linked to. It also requires more work should the web page move to a new location. This is where Relative URL's come in. They point to a path relative to the current directory of the web page. For example: home.html ./home.html ../home.html Linking to a location within a page with Anchor =================================== Sometimes specifying a link to a page isn't enough. You might want to link to a specific place within a document. The book analogue of references of this type would be saying "Third paragraph on page 32" as opposed to just saying "page 32". The anchor tag (< a >) can be used for this too. Let's assume that you want a link from document a.html to a specific location in a document b.html. Then you start by naming the interesting location in b.html. This is done by adding a < a name="some_name" > (where some_name is a string of your choice) tag at the interesting place in b.html. Now that location can be referenced to with < a href="b.html#some_name" > from document a.html. Special targets =========== _blank ===== A new blank window is opened to load the linked document into. The location in the address bar (if shown in the new window) gives the hyperlink location of the new resource requested by the user's clicking on the hyperlink. _self ==== The current frame that contains the document and the link to be clicked on is used to load the linked document; if the link is part of a document that occupies a whole window then the new document is loaded into the whole window, but in the case of a frame, the linked document is loaded into the current frame. The location won't be shown in the address bar unless the linked document was loaded into the main window as opposed to a child frame of a frameset. _parent ====== The linked document is loaded into the parent frame of the one containing the link to be clicked on; this is only important in nested framesets. If window W contains frameset F consisting of a child frame A and also a child frame B that is itself a frameset FF with "grandchildren" frames C and D (giving us Window W with three visible panes A, C and D), then clicking a hyperlink in the page in frame D with a target=_parent will load the linked document into D's parent frame, that is, into frame B, so replacing frameset FF that was previously defined as the content of frame B. Documents C and D that were the frames of this frameset FF in B will be entirely replaced and this will leave only frame A and the new document from the hyperlink left in frame B, all inside the main frameset F in window W. The location is only shown in the address bar of the window if the parent frame happened to be the window itself. _top === The linked document is loaded into the window, replacing all files currently displayed in the window in whatever frames they may be found in. The location at the top of the window, in the address/location bar is seen to point to the linked document once the hyperlink is clicked.
File Paths in HTML-Absolute and Relative Paths in this video you will learn about html file paths. basically there are 2 types of path we used in html- 1.Absolute Path- in absolute path we use full path or url on the source. 2.Relative Paths- in relative paths we use root or sub directory for giving a source. Span tagin HTML- The span element in hindi [Part-19] https://www.youtube.com/watch?v=MvMjPnB0Q8M&index=19&list=PLjzsl6AoCF8n_1SRnhxWP_vbep2mNqCpG Class Uses in HTML- HTML Class in hindi [Part-20] https://www.youtube.com/watch?v=bRE7qZt_dDo&index=20&list=PLjzsl6AoCF8n_1SRnhxWP_vbep2mNqCpG Frames & Frameset in HTML-Basic HTML in hindi [Part-22] https://www.youtube.com/watch?v=OACqjwMZDyI&index=22&list=PLjzsl6AoCF8n_1SRnhxWP_vbep2mNqCpG&t=25s Entity in HTML-Add spacial character into webpages [Part-23] https://www.youtube.com/watch?v=fgd8uq8Gqtw&index=23&list=PLjzsl6AoCF8n_1SRnhxWP_vbep2mNqCpG HTML Computer Code-Use Computer Code Elements [Part-24] https://www.youtube.com/watch?v=gKBo6d6xz3Q&index=24&list=PLjzsl6AoCF8n_1SRnhxWP_vbep2mNqCpG&t=1s