Static & Dynamic Websites

Building up on my previous article on ‘A short guide to Starting ‘Web Development’, this article will keep you informed on what’s the difference between a static and a dynamic website, how both are served whenever you request a link, the need of a ‘dynamic’ website & code for the some of which I have developed. Just to be clear, a website refers to collection of webpages connected together in various ways.

What’s the difference?

Static is something that lacks movement, action, or change while being dynamic is characterized by constant change, activity, or progress.

Static websites are those which serve the same content every time they are requested. The content served doesn’t change until changed manually. Though the content remains same, it doesn’t mean that the website loses it’s interactivity.

Dynamic websites involve use of server-side scripting(the code executed before the content is sent) and/or client-side scripting(the code executed in a browser). For instance, try and imagine how would medium.com be keeping inventory of all the articles and then displaying the user only that one which is specifically asked for. But can you imagine how much space it will take even if they would’ve created a harcoded .html file for each blog that is put up on the website! This is where the dynamic websites dive in. They pick up the content from a database and then manipulate the DOM(Document Object Model, basically everything that one can see in the browser) to present it to the user.

Simply put, the web page requested is created on demand, they are not pre-built in a dynamic website while in a static website, the web pages that can be requested are already present on the server and are sent directly without conducting any other process.

Why a dynamic website?

A dynamic website is a lot powerful than a static website. They offer a wide range of benefits, from ease of maintenance, scalability to greater usability. Imagine creating something a static website, like your own medium.com, initially with 250 pages on it. Now, let’s say you need to change the size of the title, the font type or the meta tags whenever content is changed in each page. Imagine the tremendous consumption of the time and force to edit each page. Therefore, to ease this process, one opts for a dynamic website. Figure out which content management system to use and for once write the javascript to be executed whenever a page is requested, sit back and enjoy. This takes off all the worry to edit each page, just edit it the script used to create this pages, whenever required.

Example

Have a look below how the projects are created on demand. It is developed in Flask. The link to GitHub repo: https://github.com/IIIT-Delhi/HCD-IIITD/

(Templating each research project displayed)

In here, I have shown you the code for the page that is created. That’s right, I have written a file single file in which the content is figured out whenever demanded. View the GitHub repo to view how the content is fetched and passed onto this file while it is being created! ⚡

That’s what I have for now. Hope this helps!