I am learning how to create webpages and I made a simple one that runs on a python server, locally, on y machine. I have a menu that can be pressed to re-direct to other sections, essentially loading a new page.
On the half a second it takes to load the page, the raw html is visible until the CSS formatting is applied, which looks really ugly. I want to know if there is a way to prevent the new page from being displayed until it is ready, or at least add a blank, black, page over the html until the CSS is ready.
I am using flask for the server:
from flask import Flask from flask import render_template
app = Flask(__name__, static_url_path="/static", static_folder="/static")
@app.route("/")
def home():
return render_template("home.html")
@app.route("/resume")
def resume():
return render_template("resume.html")
And this is how the buttons look in html:
<nav id="PageNav">
<div id="TimeContainer">
<ul id="TimeList">
<li><a href="/"><span>Home<span></a></li>
<li><a href="/resume"><span>Resume<span></a></li>
<li><a href="#"><span>Math<span></a></li>
</ul>
</div>
</nav>