Hodgepodge

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:

a piece of text to be displayed
the piece of text's style
- font weight (normal, italic, bold, ...)
- font family (serif, sans-serif, monospace, cursive, ...)
- font size
- text color
- ...

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:

run a web server on your home computer (just for yourself)
run a web server for a Local Area Network (LAN)
- home
- class
- school
public websites available on the internet

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:

Apache (complicate)
Nginx (simpler)
8 Best Open Source Web Servers in 2024
There is a simple web server Python module

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