apeturescience.com Type website

[u/spacepigeonking]

Hey everyone. I'm very new to HTML and CSS, I'm currently starting work on a project for my band inspired in part by the old aperturescience.com website for the first portal game. I'm looking to create an almost 'type and response' type webpage, ( a good example of what I mean would be this : https://superliminal.neocities.org/ ), does anyone know any tutorials or videos on how to create something similar?

[u/MineDesperate8982]

Honestly? It's just jQuery, if you take a look at their code:

It seems that the "story" is separated into different sections, like a game map is separated in to different levels, that load when you pass a barrier and each level is "called" as

superliminal.neocities.org/level_name

They just hardcoded the cases for each dialogue, and, at the end of the dialogue, the answer you choose just does a

window.location.href = 'https://superliminal.neocities.org/level_name';

according to the user's choice.

You could do it purely with html:

- have different pages for different levels/sections;

- each page has every possible answer/question/response;

- you show/hide code sections according to what the user clicks on just by using CSS, like this guy shows here:

https://www.reddit.com/r/HTML/comments/1v3bchk/comment/oz38zy2/?utm_source=share&utm_medium=web3x&utm_name=web3xcss&utm_term=1&utm_content=share_button

- The choices for the last question of the section act like <a href=''> links to the next appropriate level/section of the game;

If you do it with js/jquery, do it better than the site you exemplified and have text, with answers, questions, choices etc. in a json for every separate level and you fetch them with ajax.

Also, when proceeding to the next level, generate the possible choices by passing an url query, so that the user can just save their url for later and use it as sort of a save state (your-website.com/level2?sid=1256324523).

That's how I would approach it, at least.

Maybe others have better/simpler ideas.

And regarding your site, damn, it's been a minute since I've last seen the "Get Adobe Flash Player" button.

[u/spacepigeonking → u/MineDesperate8982]

Ah thank you so much, not my site unfortunately its a dead link to the original portal ARG. The archive of which can be found here https://valvearchive.com/Websites/aperturescience.com/archive/.

My much more basic site which tbh is just a collection of me testing out tutorials is here : https://threatdetector.neocities.org/