HTML Tutorial 5 – Links & Menu Bars – Website Design Tutorial

hey youtube it’s Eddie Johnson again and today I’m going to be demo you how to add menu rails and to connect text and portraits to your HTML documents so let’s get started okay so the first thing you want to do is you want to open up notepad Microsoft Notepad will maximize that and you want to type in the standard HTML calls of HTML head title compile the name this is my title close the title tag close the head tag and open the body tag now you should know this from the last seminars if you don’t get back watch them and then you should be up to date okay so the first thing you just wanted to do but including a tie is so for example if we want something to say click here to continue or something to find our click here to find out more if you exactly file save as and if you just file say that we’re going to save it to the desktop and – we’re going to save it as index.html you say that’s whatever you want make sure it’s just got fleck HTML on the end if we save it like that it’ll saved an HTML document we will minimize it get your desktop but as you see it’s there we open it up should open up in Firefox or your default browser if you’re result it’s not right click open with Internet Explorer or whatever this is my deed wait for this to load click here to find out more now if you click that nothing’s going to happen I’ve highlighted it nothing’s going to happen you can’t click it where you can click it but it’s not going to take you anywhere now if you wanted to say make it go to Google for instance you would make a tag around where you wanted to click so the label is open tag a opening href equals open speech brands and then and so we’re going to make it a neighbourhood now we’re gonna make it Google so HTTP forward slash forward lash ww-well comm code speech observes close the tag and and we wanted to only link their please click here so you close it after the “hairs-breadth” at the end of the year so everything in between those will be everything in between that so they click here will be linked now if we go back to our sheet refresh it you assure there’s a connect there you sounds that it is necessary take you to Google there we go to Google’s popped up so if we go back and now I’m going to show you how to make it linked to a local neighbourhood file for instance so index speck HTML that’s the name of this file this enter index.html and so should just link back to us so when we click click here and it should just take us nowhere it should just take us back to index dot HTML so say if you wanted by open feed HTML if “weve created” a biography enter right by or whatever the mention is died in Gmail now if we just wrote WWL calm save that and try to click it if we try and find the datum who www.google.com/ mapmaker if you want it to do join if you want it to link to a website a specific website you have to do HTTP and get on port slash forward slash you have to add that if you don’t it will merely not work so we’ll refresh it Ning it’s working back to Google again now if you want to add a attach you cannot you can have a link around anything so we’re going to add it around the whole text file save and then that intends the whole the whole thing there is all relation so wherever you click on that it should link you back to Google if you wanted say for example to if you just wanted to associate an idol for example IMG SRC equals speech ratings the epitome and you know we’re going to make it the Google image so we’ll prop we’ll copy image location paste the portrait point and that’s the portrait that’s where the idols who right-click emulate that we will paste it into travel documents as the SRC and then close that and that necessitates the image should be linked so if we go back clink freshen the Google images there and if we click the Google image it is desirable to tie-in back to Google now as you see this border around the outside now if you want to get rid of that simple enough to do any idol call and you can say we’re going to the image space border equals open communication symbol 0 close pronunciation distinguished so we have to do save and click refresh their own borders disappears but it’s still connecting you can still click it and it still take you to Google so that’s how to make it if you required more links for example we’re gonna make a menu bar so we’re gonna get rid of all this and we’re gonna have them there yep we’re gonna have a menu bar so we’re going to have it have Google and our menu barroom we’re gonna have what I was we gonna have seat which I have Yahoo HTTP yeah we’re gonna have yeah yahoo.com as a relate and right Yahoo or whatever you want um I’m going to have YouTube YouTube can be on our relations equals HTTP slash forward slash W video via YouTube calm and I have includes the speech mods there any that should stuff file save shouldn’t shouldn’t matter there you go Google if you click Google it should go to you if you click your who it’s Quantic Yahoo’s website if you click YouTube should go to youtube.com and to that it’s gone to Google you can send to that text so it sounds more like a menu prohibit by get and including and computing the center center tag so now gotta close the center tag and to close the center tag settled slice Centre record save and go back press refresh or f5 that’ s gone into the sentence that inspections more like a menu saloon and you can have for instance about us my area wherever you want thanks for watching guys more videos coming up soon please subscribe to keep updated

digital marketing

As found on YouTube

Share this article

Leave a comment

Related Posts