Create a Simple Website

Project #1

Create a simple website with simple web pages. Use Python to generate the HTML files.

  • You can create web pages with a plain text editor
  • Python and other programming languages can pull data from a database and build static web pages using the data
  • There are Python modules, web frameworks, applications, etc. that can help create "complex" web pages and websites. Do not use them for this project. See the code examples below.

    Add an animated GIF to a web page?

    Introduction

    Hyper Text Markup Language (HTML) is the standard markup language for creating Web pages (HTML files).

    HTML files are plain text file that contain two types of information. Things to be displayed and a thing's style. For example:

    Many web browsers will show you the HTML text that defines a web page. Try right clicking of a web page and select "view page source". Try clicking on this page.

    HTML Tutorial

    Web Hosting Options

    There are several web server hosting options. They are:

    Note: As long as everything is on a single computer, a web server is not necessary to view static web pages.

    There are free web servers that you can download and operate "locally". For example:

    Web Browser, Web Server Interaction

    Sample Python Code

    The following are peaces of Python code that can be used to create static web pages.

    start_of_web_page = '''\ <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="author" content="{author}" /> <title>{pagetitle}</title> {style_if_any} </head> <body> <header> <center>{headertitle}</center> </header> <div class="indent12"> <p>''' end_of_web_page = '''\ </p> </div> <footer> <modate>Last Modified: {today}</modate> </footer> </body> </html>''' mystyle = '''\ <style> img { width: 400px; border: 2px solid #000000; } div.indent12 { margin-left: 12px; } modate { font-size: 0.8em; margin-left: 12px; } div.box { display: inline-block; border: 2px solid #000; padding: 10px; background-color: white; font-size: 1.2em; font-family: monospace; white-space: pre-wrap; } </style>''' body_of_web_page = '''\ <b>Hello World!</b>'''

    Turn the above code into functions. Pass parameters to the functions to create parts of a web page. (use f strings?)

    Write the parts to a HTML file.

    if __name__ == '__main__': def main(): print(start_of_web_page()) print(body_of_web_page()) print(end_of_web_page(),end='') main()

    Project #2

    Us CSS file(s). For an example click HERE .

    Links

    Be careful of what data you put on the internet. Personal information of any kind is a bad idea.

    13 Best: Free Hosting for Students (Feb. 2024)
    Best Web Hosting for Students: 6 Top Free and Paid Options