Coding Progression

Grade Mastered Code Syntax Description
6th <p> Makes text appear on your web page.
6th <img src="[insert file name here]" alt="[insert image desription here]" style="width:[width in pixels]px; height:[height in pixels]px;"/> After you input a file name and description, if the image is in the right folder, then an image appears on the page (self-closing)
6th <li> Makes a list item inside of either and unordered list or an ordered list.
6th <ul> Makes makes an unordered list (bullet points), and makes a list of the items you put into the list items.
6th <ol> Makes an ordered list (numbered list), and uses the list items you put inside this element.
7th background:[background elements]; (CSS) This controls the background properties. You can put all your background elements into this one element for more concise code.
7th border:[background elements]; (CSS) This controls the border properties. You can put all your border elements into this one element for more concise code.
7th <div id="[ID]"> This makes different sections on your web page.
7th <center> This makes text centered on you web page.
7th <strong> This makes text inside of it appear bold on your page.
8th <article> This piece of code is so nice, because it is a standalone element to make content that can be used seperatly from the main content.
8th <figcaption> A caption that is easy to insert, and depending on how you set in in the css, it can look pretty good.
8th <figure> This tage is also pretty cool, it is kind of similar to the article tag. It defines and standalone element by itself.
8th Flexbox (CSS) I have used this tag so much in my portfolio, because it's so useful. if you wanted to have the elements resize when you resize the window that it's in, like on a smartphone? Well, Flexbox can do that and more.
8th <header> Makes the top of the page easier to code
8th <footer> Makes the bottom of the page easier to code

How My Code Has Progressed

An artifact of code from 6th grade.

6th Grade Code

In 6th grade, I only knew how to make an unordered list, with no style! So boring.

8th Grade Code

In 8th grade I learned how to use an ID to add style to my list. This is the HTML code for my current navigation bar at the top of all the pages in my portfolio.

An artifact of code from 8th grade.