When most people think about evolution, what comes to mind is “the big bang”, usually describing it as way different types of living organisms developed from earlier forms during the history of the earth. Technology has also evolved over time, there are many technologies, major ones being web development, computer systems, software engineering, artificial intelligence and many more. The main focus of this article is on the evolution of Web Design. A deeper dive into HTML which is the backbone of every web page document that you see on the internet today. Yes, other supplements exist e.g. CSS, thats adds design for websites, but without HTML, displaying a webpage document is not possible. Let us first traverse our way through this markup language. This acronym stands for hypertext markup language, the language of webpage documents. Its development was by a physicist by the name of Tim Berners Lee in the 1980’s. It first started out “HTML tags” after the1990. In 1995 HTML 2.0 got published and it added more functionality compared to the previous versions. HTML comprises of elements which are the building blocks of an HTML page. The identification of such elements is with tags. A starting tag “ ” and a closing tag . What comes between these tags is the respective content e.g. text. The common tags HTML kicked off with were, heading tags, paragraphs, lists, links to mention a few. <element attr> </element> Stop and think for a second, there must be a way that these tags have are added into an HTML document? Yes, the structure of an HTML document has to be strictly followed to see how these tags actually work. The main elements of an HTML document are enclosed in the tag which is the main identifier. <html> </html> These are the and tags. The head consists of the tag. Second comes the links to styling resources and elements. The title tag generally describes the pages’ relationship with other pages. The body is where we find the main content linked to the page that is in development. Below is how the script would look in a live project <head></head> <body></body> <title></title> <meta> abc.com Main content < > html < > head < > title </ > title </ > head < > body </ > body </ > html Common Elements HTML started out with some of the common elements that are still in use today. Some elements that existed in HTML have been deprecated. Better elements where developed to achieve certain goals when developing a webpage. Let us Begin with Block Formatting Elements: 1. Headings This element runs from <h1> to <h6> tags and are used for headings of sections in an html document. The size of text decreases from h1 — h6 respectively 2. Paragraphs This element is represented using the <p> tag. It is generally used for writing a section of text in an HTML document. Each time you put this tag to use, you a new line of text is created. 3. Lists There are several types of lists available in HTML. The most common lists available are an ordered list represented by the <ol> tag and an unordered list represented by the <ul> tag. A Lists usage serves the general purpose of an actual list. You have to enclose <li> tags with content in the list for results on your html documents. 4. Images To embed images from a source of choice, you can use <img src=” ”> tag. You have to ensure you define the source of the image in order for it to appear on the webpage. Tags like this have no closing tag and others exist and are implemented by developers today. 5. Forms The form element is represented by the <form> tag. The common use of forms is to collect data from users. A form can contain, input, buttons, selection tags for user interaction.These elements above are used for development and have proven to be very useful. We are here to read about the evolution of this beautiful mark up language though. The mentioned information has general purpose of giving oneself a clear brief insight of HTML. As mentioned before everything started with HTML, different versions have been released over time e.g HTML 3.0 and HTML 4.0. As of the year 2014, HTML5 was released making certain previous elements obsolete. There are a lot of different browsers being released. Some HTML features proved to be incompatible with these browsers hence the development of HTML5. HTML5 is supported by all web browsers and that is one of the major advantages it possesses. When you look at HTML, it is a primary language used for webpage development. HTML5 brings more to the table. It is not only a markup language it has the capability of interacting with other technologies to assist in development. This can increase the dynamic sense of webpage content. JavaScript is one of the programming languages used in web development and can now run in the background. This is made possible by the JS Web worker api. Before HTML5, HTML used browser cache memory for temporary storage. With HTML5 there are a variety of storage options like web storage and SQL database. This allows more space and makes usage of the web better. As mentioned before, HTML5 unlike HTML has diverse browser compatibility. Before, usage of other browsers would break your content and make issues arise, with HTML5 any browser is capable of loading a pages’ content. With HTML it was difficult to handle errors but things changed with HTML5 being development and it make the life of a developer easier. When it comes to the use of graphics, HTML needed support from external tools. One of the common tools used for vector graphic support was adobe flash. As of today, HTML5 has an inbuilt SVG and canvas which makes graphics be supported by default. One of the most annoying things when it comes to development is bugs. With HTML it was kind of difficult to handle errors but things changed with HTML5 being development and it make the life of a developer easier. Today we see the use of a lot of multimedia on the web, HTML5 introduced support of multimedia elements like sound and video which can be directly embedded into a webpage. This has made more websites interesting to browse through. So, let us add on to what has changed, you might wonder what other new elements have are there to make web design easier. There are quite a number and a few include time which is used by most sites to show current date and time. The section element which is generally used to divide you page into sections for reference purposes e.g jumping to the section by the click of a link. The nav which usually appears at the top of the webpage has proven useful. Other elements include progress and aside to mention a few. With the few things mentioned, we can see that HTML has come a long way and now HTML5 allows more added functionality to websites. With the use of this technology, you are bound to produce outstanding results on projects in the industry. To learn more about HTML5 refer to the following resources: https://www.w3schools.com/html/default.asp https://www.freecodecamp.org/learn https://www.tutorialspoint.com/html/index.htm Microverse school for web developers also makes it a part of the curriculum and you get to build amazing project with the use of HTML5. Interested in enhancing your career in software development ,check out more information here → https://www.microverse.org/

Evolution of Web Design: From HTML to HTML5

About Author

Comments

TOPICS

THIS ARTICLE WAS FEATURED IN

Related Stories

Untitled Story

10 VSCode Extensions To Make Your Life Easier

10 Ways Stand Out as a Java Developer and Land that Dream Job

10 Tips For Junior Developers To Succeed in Code

10 Things Every Beginner Should Know When Learning Javascript And React

10 Reasons Why Front End Development Is a Great Career Choice

10 VSCode Extensions To Make Your Life Easier

10 Ways Stand Out as a Java Developer and Land that Dream Job

10 Tips For Junior Developers To Succeed in Code

10 Things Every Beginner Should Know When Learning Javascript And React

10 Reasons Why Front End Development Is a Great Career Choice

Light-Mode

Classic

Newspaper

Dark-Mode

Neon Noir

Minty

HN StartUps