DEV Community

Timothy Achonu
Timothy Achonu

Posted on

Static websites vs Dynamic websites

What exactly is a static website?

If we are to follow the dictionary definition of the word "static" then I believe the following description accurately describes a static website:

A website with no movement or change. The content, colors, and layout remain exactly the same, no matter who visits or when. Every visitor sees the same thing, regardless of location or time. These are just some of the factors that can define a static website. But are these factors considered in the technical definition of a static website in web development? We'll explore that as we go along.

In this article, I want to explore three possible ways I think a website can be dynamic:

Dynamic by aesthetics:

On many modern websites, when you hover over a button, the color changes, or it gets slightly bigger. Some things might move from top to down, or left to right immediately you enter the website (entry animations.), or while you scroll through the website (scroll animations), texts transform, etc. On some websites, visitors may have a different experience or see different aesthetics because they use different devices, or different browsers, or visited at a different time of the day, etc. The look of a website may change across different browsers and devices, because some browsers and devices display somethings differently (e.g. scrollbars look different on Google Chrome and Microsoft Edge), but generally the content remains the same. It's important to note that this dynamicity—aesthetic dynamicity—all happens on the client, the user's browser.

Dynamic By Content:

A website's content might vary based on user input, time, user's browser, user's device or an update on the website's data source, etc. Websites that are dynamic by content can update some (or all) of their content without manual intervention from their developers.

You might be wondering how a website's content can appear dynamic based on things like the browser you're using or the time of day. To put it in perspective: when a website pulls content from a data source and that source gets updated, the content changes. Similarly, if the site checks for factors like browser type or user's location, it can display different content depending on those conditions. And in plain English, since the content can vary, the website isn't static; its content is dynamic. Again, it's important to note that this dynamicity—content dynamicity—all happens on the client, the user's browser.

Dynamic By How Servers Deliver The Pages of a Website (my suspected standard technical definition):

Using a shallow description or an oversimplification of what happens when you visit a website: When you visit a website, for example, https://www.google.com, your browser requests for the homepage of Google from a server, when that server returns the page, your browser displays it. Now, that server either returned a static page or a dynamic page.

A static website, in this context—the context of how servers deliver the pages of a website—is a website whose pages (HTML pages) are prebuilt. This means the page (or HTML file) is stored on the server, like a pre-cooked meal in a restaurant that’s ready to be served, rather than one that's made only when a customer places an order. This does not mean this website lacks all dynamic features. However, this for sure means that any dynamicity or interactivity on this website is triggered on the client, mostly by JavaScript (CSS is also capable of shaking things up a bit😉).

A dynamic website, in this context, is a website whose pages are generated dynamically. This means that the page is assembled and sent to your browser only when it is requested. When you visit a dynamic site, it makes a request to a server. The server executes the code for the requested page, possibly queries databases or other servers for additional data, assembles the page using this information, and then sends the final page to your browser. This process happens quickly; the server generates a new page for each request, customizing the content based on specific user data or other factors (user's location, user's device, time of the day, etc.).

Conclusion

We've explored various ways a website can be dynamic, but it's important to note that a website can be both static—in all the ways we've discussed—and dynamic—in all the ways we've discussed—at the same time, as parts of a website can work differently from other parts. I hope this article has helped clarify what it means for a website to be static or dynamic or at the very least, sparked your curiosity to explore further what truly defines a website’s dynamic nature.

Credits:

To ChatGPT, this youtube video, this article, and to other sources I'm unable to remember or find right now but that, no matter how little, assisted me in writing this article, thank you.

Top comments (0)