What is HTML?
HTML stands for Hyper Text Markup Language, and it is not a programming language it is the standard markup language for creating web pages. It describes the structure of a webpage and consists of a series of elements, such as these;
These are tags and tags directly introduce content into the page. Other tags such as <p> surround and provide information about document text and may include other tags as sub-elements. Browsers do not display the HTML tags, but use them to interpret the content of the page. Html can be assisted by technologies such as Cascading Style Sheets(CSS) and scripting languages such as Javascript.
History of HTML
Tim-Berners lee created the basics of the web and is very well known for created the first version of HTML in 1990, he wrote a memo proposing an internet based hypertext system. The first publicly available description of HTML was called ‘HTML Tags’,it describes 18 elements comprising the initial, relatively simple design of HTML. There were many developments of this first draft and after the HTML and HTML+ drafts expired in early 1994, the IETF created an HTML Working Group, which in 1995 completed “HTML 2.0”, the first HTML specification intended to be treated as a standard against which future implementations should be based.
Starting to look at html and css
In beginning to look at html and css we began by just mocking up a page of text about John Baskerville. I found it quite enjoyable learning. bout the different rules and coding phrases like <h1>, <p>, <blockqoute>, and I found it very satisfying when the mock ip would work and the test would change on the saved document. We started with our first version ‘John Baskerville version 1’ and then we had to create a GitHub account and link our desktop version with the internet version of GitHub. I found this part tricky because in order for the files to be updated on the internet browser page of GitHub, the files had to be ‘pushed’.
Version 1
This image is of the first version, as a class we were then told to add css to the next version to make it more visually pleasing. I found this more tricky because the tiniest mistake could lead to a change in the whole layout and design of the text. As seen in the image beside the coding, the text is plain and boring with just black and white elements. Therefore a style.css folder had to be created and this was a chance for me to add my own flare to the piece and get a chance to develop my design skills.
Version 2
This is the second version and the css to go along with it. The part I found most difficult about this version was getting the links and navigation to function properly. The links took time to get the hang of because the css for the links was more tricky than the first. I had to make sure that the user was able to hover over the navigation and it would change colour, but when I got it to work I was very proud of myself and the overall finished look of it felt very professional to me.
Version 3
This version was all about changing the font on the text. I found it enjoyable going to google Fonts and finding a suitable font for the piece. I had to make sure I chose a font that was traditional looking yet not too boring, a font that was fun to look at and made the text interesting to read. I chose ‘Libre Baskerville’, I thought the name was suiting also. For this mockup I had to make sure that I got the correct link to font website and the link for the css page, because if those weren’t in the correct place then the font would not change on my version 3. I also added colour to different parts of the text in this version also, I feel that this made the page of information easier to read and makes key parts stand out.
Version 4
This part was all about adding images and also adding lines to separate the different sections. I had to open a new file labelled images and ensure that when I was linking the images that I used to correct names of the saved images or they wouldn’t appear on the document. We were asked to repeat these steps in our own History of type document and mock them up ourselves and add images. this was good practice for html and css because I had to figure lots of it out myself, the practice defiantly helped my knowledge on how to use css and html.