• HTML
• CSS
• JavaScript

HTML is language we focused on learning as it truly is the most important code to know. This language of code is used for the content on the website. CSS is used for the design and JavaScript is used for interactivity on the website. Throughout the course, we learned about headings, paragraphs, lists, and links which are the most common to run into. No matter what we are trying to write, everything is put into angle brackets <>. This allows the language to be read and the information to be formated the way we need. To end, simply add a slash inbetween the angle brackets like this </>. 

Headings

Headings are used to help separate information and give a hierarchy to certain important text displayed. There are six levels of headings:

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

People will commonly use Headings 1 – 4, but 5 and 6 are rarely used. When writing headings in HTML, the code used is as simple as <h1> to idenitfy what is going to be the heading and </h1> to end the heading.

Parapgraphs

Paragraphs are pretty self explanitory as to what their function is. When there are long blocks of text and information being displayed, they are put into paragraphs. So as you are reading this section, it’s in a paragraph form. To put text into this format, simply put <p> before the text, and to close the paragraph, </p>.

Lists

Lists are used to display certain information in a list format. When using HTML there are two types of lists: Unordered Lists, and Ordered Lists. The difference between these lists reflect their names. Information that does not need to be put in any particular order would use an unordered list format like this:

• eggs
• milk
• flour
• sugar

For unordered lists, you use <ul> and </ul> to indicate this.

For information that needs to be put in a certain order, like a size chart for example, would use the order list format which would look like the following:

1. Small
2. Medium
3. Large
4. X-Large

For ordered lists, you use <ol> and </ol> to indicate this.

Each item apart of the list must be identified to be formated correctly. For each item apart of either list you would add <li> and </li> before and after each item. This allows the system to identify which items are apart of a list.

Links

Links are used to redirect the person to another website, or a certain point on the website they are on.  Unlike the other codes used, links require a little bit of more work for them to work. 

To have a website linked to text, you have to start off the code with <a href=””>. The ‘a’ stands for anchor and ‘href’ stands for hypertext referance. Inbetween the quotations, you would add the website like you’d like to redirect your viewer to. You then place the word(s) you’d like to link the website to and close off the line of code with </a>. Now when the person on the website clicks on the words in blue, they will be redirected to the website replacing the original site. NOTE if you’d like the webiste you be opened in a different tab, you simply just have to add taeget=”_blank” after the link. It should look something like this: <a href=”link here” target=”_blank”>. 

Another helpful link used on websites are ones that redirect you to something alread existing on the same page. A common place you’ll find these links are at the very bottom of the page bringing you back to the top.

Like me!

To achieve this, identify where you’d like the person to be directed to and add <id=”name here”>. You can add anything you want in the ‘name here’ section, but keeping it simple works best, so calling it either the section name or top/bottom works best. Next you’ll go to the text you want to link and add the following like of code beofre: <a href=”# matching name here”>. Then follow with the words, and closing the link with </a>. The hashtag is used to call back on the id made earlier. All together the line should look something like this:

<a href=”top”>Like me!</a>

Conclusion 

Even though these may seem very basic skills learned with the HTML language, these are the fundimental skills you can use to addapt to whatever you are working on. I feel like learning the language of HTML is very important because you learn how text and format work on a website which can allow you to manipulate it freely. As mentioned earlier about links taking you to other websites, since you finished with this post, mine as well check out my graphic design portfolio!!

Check out my Graphic Design Portfolio