The Basics of HTML
If you are a photographer chances are you have a website, and chances are you manage your site. If at any point you’ve asked yourself, “What is HTML?” this article is for you. The first thing you need to know about HTML is that it’s not complicated. It may look a little foreign, but once you learn the basics of HTML it will become very easy to use.
HTML isn’t a programming language but a “Markup Language”. That means it’s just text, like what you see on the page here, only it has tags like these <></> telling the web browser what type of text you’re using. So just like you might markup a book you’re studying with a highlighter, when making web pages you use these tags to mark up the text on a page.
One of the most simple tags for marking up your page is the <p> tag. “P” is for paragraph. To properly markup a paragraph you simply put a <p> at the beginning and a </p> at the end. You may notice that the tag at the end looks a lot like the tag at the beginning. That’s because learning HTML is easy! The simple beginning tags will always look like the ending tags only the endings will have a “/” at the beginning inside the carrots <>.
Now if you understand that we’ll step it up a bit… You may want to mark up some text on your page to have it go to a different page. You know this kind of text as a link. In the web world it’s called an anchor, so it opens/starts like this <a> and ends like this </a>. If you use these tags you’ll be able to make clickable text, but you probably want your text to be more than just clickable, you probably want it to go somewhere. To reference the destination of the link you make a statement like this: href=”” with the destination in quotes. So if I want to have the destination be photography course I would put our web address in the quotes like so: href=”https://photographycourse.net”. Now we just add that info to our anchor tag <a href=”https://photographycourse.net”>, add the text that we want to be a link that describes what the page is: free digital photography courses, and it will look a little something like this <a href=”https://photographycourse.net”>free digital photography courses</a> as HTML and like this free digital photography courses on the webpage.
Self closing HTML
Not all HTML tags have a beginning and end tag. Some are much more simple. They close themselves! An image tag is a good example. There’s no text on an image, so you don’t have to “markup” any text, you just put the tag where you want your photo to go. An image tag looks like this <img src=”” alt=”” />. The slash comes at the end of the tag when it closes itself. Just like the anchor or link tag, this tag has some “attributes” that should be specified: src meaning source, or where the image is at on the web and alt, meaning alternate text, or the text to show when the image can’t be loaded. The alt text is also what’s read to people who can’t see your webpage. An example of an image tag would look like this: <img src=”https://photographycourse.net/wp-content/uploads/2011/06/html-1.jpg” alt=”HTML” /> This is the tag used for the image you see above in this article. If you were to put https://photographycourse.net/wp-content/uploads/2011/06/html-1.jpg in your browser you would see just the image, because that is where it is on our website.
What do I need to write HTML?
You don’t even need any type of fancy program to write HTML. You could write it in a simple text editor or you can write it using free online software like wordpress. In fact, a lot of the expensive programs that you get to write HTML won’t write it as clean as just using a simple text editor.
HTML Tutorial for Beginners – Introduction to HTML (video)