Its crucial to understand how webpages are built if you are planning to build/own are website or trying to learn building the website. This basic knowledge will help you to build amazing websites in the right way, which shoud also help you to make wise decisions with regard to,
The Amount to be invested in Building the website
To calculate the timeframe needed to build the website
To understand the efforts/resourcs needed to build the website
To understand what kinds of websites are best
- The webpages are built in HTML ( Hyper text mark up language), the webpages are combination of several HTML tags.
- HTML tags are the simple commands in HTML, for every command there is a opening and closing tag.
- The closing tag will have an additional forward slash. The opening tag will not have the forward slash.
The HTML comprises two parts
The HTML page will be always started with the <html> opening tags and ends with the </html> closing tag, where as the head section and body section HTML tags will be always within the <htmL> </html> tags.
Head section- Usually holds all the information for the browsers,bots, search engines and the sitelvel CSS/JS, usually the external css files and external JS files.
<head>
<title>This a Title For The DM Training Class About The HTML Basics</title>
<meta =” description” content = “ This is the place or section where the pages meta description is updated”</description>
</head>
Body Section.
<body>
<h1> This is the page heading, “The Test Page”</h1>
<p>
</body>
The following is a code for a simple HTML test page. The below code saved as .html will open in the browsers as a webpage.
<html>
<head>
<title>This a Title For The DM Training Class About The HTML Basics</title> <meta =” description” content = “ This is the place or section where the pages meta description is updated”</description> </head> <body> <h1> This is the page heading, “The Test Page”</h1> <p>This is any piece of information that you want to have on your webpage displayed to your audiences visiting your website</p> </body> </html> The outcome is as follows, The HTML page developed would be like as in the below image. This is an example of how a simple HTML webpage would look like. The above HTML is useful to build a simple webpage that doesn’t look appealing. It doesn’t have the borders It doesn't have the colours The alignment is not appropriate How to build beautiful web pages? The information or the content for which the website is to be built has to be first developed as a mockup which is called UI/UX designing and the same will be converted to HTML webpages. UI- Is the user interface something that you can see with your eyes such as the colours, font styles, font sizes, images, videos, alignment, borders etc. UX- User experience is that you experidnce with the website for example, a click leads you to a cart page, or to an about us page to a pop up pops up ont he webpage. Your webpage built is in HTML has to be also wrapped with the CSS ( cascading style sheets), it is used to beautify your web pages. Which takes care of alignment, colours, presentation, etc. Refer to w3schools, this is a very good platform to practice and master HTML, CSS, and JS as well. Hence the modern era webpages are the combination of HTML, CSS and Java Script. HTML- To present the content CSS- To Beutify the content/webpage JS- It to make the webpage functional/interactive The webpages built are now dropped into the hosting server which is connected to the domain name and hence anybody can access all these webpages by just typing the domain name in the address bar of the browser. If you need more webpages to be built you will have to write it in the HTML again. If your new page is same as your previous webpage you can replicate and change the content ( Anyways its your choice, you can prefer to type the HTML again) This process of creating same kinds of webpages ( Structure/presentation) can be automated using one of the programming languages such as Java, Python, Dot net, PHP, any other programming language. This automated platforms/system allows you to manage the content of your website and hence usually referred to as the content management system (CMS). People alternatively call it as website backend. The CMS is completely a customized platform coded in one of the programming languages as per the functionality requirements. The website backend/CMS- It gives a control to you over your website to manage content ( Edit, delete, or add any new pieces of content) It allows to create the webpages without any use of HTML Dynamic Websites need a database as well connected to the website, where the information will be pulled from the DB and displayed on the front end. The content is stored only once and in one place but then on the front end it can displayed on multiple pages wherever needed. Learn MERN stack, its a full stack development course. Which allows you to build the front end and the back end. If you are looking for to learn MERN stack LearnNThrive is the best place to get hands-on training. Explore more here.- https://learnnthrive.com/technology/mern-stack-training The alternative & easiest way of building webpages/websites by anyone without knowing any of the programming languages (No HTML, CSS, JS, and Backend scripting language needed) is building on Wordpress ( Open source content management system - CMS) This method of building a website is easier, and quicker and fulfills all kinds of business needs mostly Around 50% of the websites on the internet are built this way In this method, the websites are built using the open source content management system (Website backed) the pre-built themes ( website front end), and the webpages builders which are easy to use drag and drop applications. What is open source? Is the application built by the community and is made available for free for everyone to use, in this process anyone from the community can contribute in building the application. More About Wordpress Wordpress is a platform/software that, Allows you to manage the front end/content of the website Allows you to install various plugins needed to build functionality both in the front end and in the backend Allows you to install the themes thats needed to build the website layout/design Allows you to build the beautiful webpages by drag and drop option Wordpress is a backed for your website. This is for free, you don’t have to purchase it. learning Wordpress will help you to build beautiful webpages and website with a lot of pre-built features/fucntions. If you are planning to build a website on your own in few simple steps read our other article about building websites using Wordpress. If you think you need some guidance in building a website on Wordpress you can register for our Wordpress website development course. Wordpress is easy to learn and any one can learn it, it doesn't need any technical expertise to learn Wordpress. Conclusion: Building webpages and websites is a fun and any body should be able to build with little practice in the traditional method or alternatively can learn the easiest wat of building the webpages using the Wordpress editors or Wordpress website development. Wordpress is a boon to millions of business owners and beginners who want to build websites without learning the complex HTML, CSS and Javascript.
Manjunath Chowdary
Digital Marketing Consultant
Kandra Digital
