Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
haruko haruhara

How do I make a site like doomkid's doomshack.org

Recommended Posts

I don't want the upload wads thing but I want to make a doom site like the 90s but then I would have to learn code which I'm up for to learn but I tried to follow a video but I did everything right and it didn't work I don't know what I'm doing wrong here I will send over the website once I get this thread posted but if anyone has knowledge in java script or notepad code I would love to you guys to help me out!

 

https://www.mediafire.com/file/76wdwkwtld3q8yh/Lightbringer_corp.txt/file

i might come up with a better name soon i even tried to change the name to lightbringer corp .html and it shown me a blank page.

Share this post


Link to post
Just now, Dark Pulse said:

Like the 90s, eh?

  • Comic Sans is your font of choice
  • Animated GIFs everywhere
  • An embedded MIDI is mandatory
  • Some of those GIFs, by law, must be of fire and the dancing baby
  • Your site properly loads in Internet Explorer ONLY - fuck Netscape
  • Webpage must contain at least one Blink or Marquee tag

Am I missing anything here...?

That's not really helping I literally have no idea how to make it that doesn't help

Share this post


Link to post
28 minutes ago, haruko haruhara said:

That's not really helping I literally have no idea how to make it that doesn't help

Since you're asking so nicely, sure.

 

Line 2: Missing closing < for </title>

Line 4: Missing closing >

Line 9: Don't need that first center, you already centered the previous line; just keep the </center> (better yet, move that closing tag to the end of Line 8 and keep just the </p> on Line 9. Good coding practice is to usually close out a tag on the same line, unless it's got something inbetween it.)

Lines 10-11: <a href=[...]> must be all one line

Line 12: Extra space after the "black" that needs to get removed

Line 16: No ending </html> tag to tell the browser that the page code is completed.

 

That then results in this...

 

376226ab3c.png

 

...But if you highlight and drag the text, you will see some of your other text become visible. It's currently not visible because it's black-on-black. (Links will generally automatically get colored, though you can specify the color manually if you so desire.)

Edited by Dark Pulse

Share this post


Link to post
4 minutes ago, Dark Pulse said:

Like the 90s, eh?

  • Comic Sans is your font of choice
  • Animated GIFs everywhere
  • An embedded MIDI is mandatory
  • Some of those GIFs, by law, must be of fire and the dancing baby
  • Your site properly loads in Internet Explorer ONLY - fuck Netscape
  • Webpage must contain at least one Blink or Marquee tag

Am I missing anything here...?

 

Nope. 100% accurate.

Share this post


Link to post

Adam 'OK'er called. He asked for his thread ideas back.

Share this post


Link to post
1 minute ago, Maes said:

Adam 'OK'er called. He asked for his thread ideas back.

Unlike Adam Oker, OP is actually trying.

Share this post


Link to post
27 minutes ago, Murdoch said:

Nope. 100% accurate.

Actually, I did forget one: Background that "tiles" atrociously.

Share this post


Link to post
2 minutes ago, Dark Pulse said:

Actually, I did forget one: Background that "tiles" atrociously.

 

That contrasts so poorly with the text you often have to highlight it to read it.

Share this post


Link to post

There's a few different skillsets here:

 

 - web design - the static look and feel of the page(s)

 - user interaction and site navigation logic - so-called 'user journey'

 - web development (how the site is technically constructed - css framework? hand-crafted CSS, responsive html code, client-side Javascript, server-side logic etc.)

 

I've been doing web development with some design and user interaction stuff for many years - it's not an overnight thing. However, more than happy to help you out, but probably need a lot more from you about what you are trying to achieve - examples of look and feel you want, what pages, how the navigation should work - all of which and many other would be ascertained by discussions...

 

For now, if you are a noob WRT web development, I would definitely suggest looking at some tutorials on the basics of HTML as that is the underlying framework of what you need to build web page:

 

https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web/HTML_basics - the curation organisation for all this]

https://hostingwiki.org/html-tutorial-for-beginners/

https://dev.to/ceeoreo/html-101-what-you-need-to-know-to-get-started-5bmo

https://blog.hubspot.com/marketing/web-design-html-css-javascript

https://websitesetup.org/html-tutorial-beginners/

 

Begin by making some simple pages and loading them in your browser (it'll work from a local HDD location). Setting up a local web server is a very important next step, but you will need to understand the concept of what a webserver and HTTP actually is beforehand (apologies if you already do)

 

Anyway, I am happy to respond to more specific questions with appropriate specific answers.

 

Good luck...

 

 

Share this post


Link to post
1 hour ago, Dark Pulse said:

Am I missing anything here...?

yes - fixed width and non-responsive..., tables with default border styles... link to a geocities site...

 

Ohhh... those were the days :-)

 

In all seriousness, I did try to emulate that old-school look with my site - columnar with a border down each side and very simple - but using a modern responsive framework (https://purecss.io) so it works on a mobile too.

Edited by smeghammer

Share this post


Link to post
3 hours ago, haruko haruhara said:

I don't want the upload wads thing but I want to make a doom site like the 90s but then I would have to learn code which I'm up for to learn but I tried to follow a video but I did everything right and it didn't work I don't know what I'm doing wrong here I will send over the website once I get this thread posted but if anyone has knowledge in java script or notepad code I would love to you guys to help me out!

 

https://www.mediafire.com/file/76wdwkwtld3q8yh/Lightbringer_corp.txt/file

i might come up with a better name soon i even tried to change the name to lightbringer corp .html and it shown me a blank page.

 

OK - So you started making a HTML file. Excelllent. However:

 

  1. You need to give the file an extension to match the use to which it will be put. A browser will not know to render a .txt file as HTML - you need to provide the .htm or .html extension (well, actually, you need to give the response a mime type of text/html - but that is advanced stuff...)
  2. mediafire is a file storage service and while it will certainly store html files, it likely will not serve them (though try by all means)
    1. To do this properly you need to have proper hosting of some sort - I would suggest using the github pages feature as you have just made a github repo for your mods etc... (my smeghammer site is using that feature, though I gave it a custom domain)
  3. The HTML itself needs some more tags. You have:
     
    <html>
    <head><title>Lightbringer corp/title>
    </head>
    <br
    <hr>
    <h1> this is a heading</h1>
    <p> this is a paragraph</p> 
    <p><center> welcome to my site my name is haruko haruhara aka kinotsu kochirumi i make doom mods more info below
    center</center></p>
    <a
    href="https://www.youtube.com/channel/UCytnPyRW_2xBI24h6ukdMeA">youtube</a>
    <body bgcolor="black" >
    </body>
    <p><font color="yellow">
    this is a font color</font></p>

    and this has a number of issues:

    1. you have the <body> tag in the wrong place

    2. title closing tag is probably mistyped and this is what causes the blank page: " i even tried to change the name to lightbringer corp .html and it shown me a blank page.". Because the title tag is not closed, the HTML renderer in the browser thinks that ALL following content is part of the title...

    3. same for opening br tag

    4. there is no closing html tag

    5. there is no DOCTYPE declaration, so the browser won't know which version of HTML rendering to use (more advanced stuff...)
       

If you do this:
 

<!DOCTYPE html>
<html>
    <head>
        <title>Lightbringer corp</title><!-- fix title tag like so, otherwise it will cause everything else to not show -->
    </head>
    <body bgcolor="black" ><!-- put this  here - body encloses all other displayed content -->
        <br /><!-- fix this - it is also a self-closing tag -->
        <hr /><!-- as is a hr tag... -->
        <h1> this is a heading</h1>
        <p> this is a paragraph</p> 
        <p><center> welcome to my site my name is haruko haruhara aka kinotsu kochirumi i make doom mods more info belowcenter</center></p>
        <a href="https://www.youtube.com/channel/UCytnPyRW_2xBI24h6ukdMeA">youtube</a>
        <p><font color="yellow">this is a font color</font></p>
    </body><!-- close body once done -->
</html>

you will have a much better start framework.

 

Also, note the tabbing indentation to show you how the  tags are nested. This is not necessary, but makes it so much easier to read.

 

There is a lot more to it, but starting with a properly constructed html hierarchy is key. You can worry about doctypes and proper CSS styling later on... 

 

Edited by smeghammer

Share this post


Link to post

 

Nice seeing a designer who knows how to code. Too many designers just use templates these days. I get annoyed when one of my clients tells me they had their site designed by whoever and I can tell in two seconds looking at the code they just bought a template from somewhere and most likely do not understand their code at all.

Share this post


Link to post

heh! I'm not really a designer - definitely more of a coder. But over the years I've picked up some design sensibilities from clients and mostly my wife. And I definitely don't have a Mac...

Share this post


Link to post
4 hours ago, haruko haruhara said:

I don't want the upload wads thing but I want to make a doom site like the 90s but then I would have to learn code which I'm up for to learn but I tried to follow a video but I did everything right and it didn't work I don't know what I'm doing wrong here I will send over the website once I get this thread posted but if anyone has knowledge in java script or notepad code I would love to you guys to help me out!

 

https://www.mediafire.com/file/76wdwkwtld3q8yh/Lightbringer_corp.txt/file

i might come up with a better name soon i even tried to change the name to lightbringer corp .html and it shown me a blank page.

what video did you tried to follow?  it can be useful to see why it didnt work

Share this post


Link to post
32 minutes ago, omalefico32x said:

what video did you tried to follow?  it can be useful to see why it didnt work

I suspect it was the unclosed title tag. The fact that @haruko haruhara got a blank page when changing the extension to .htm suggested that it was being renderd by the browser as HTML, just with big-arse title. 

Share this post


Link to post

Making the site is easy. Getting it hosted correctly on the web is the hard part. Hell I'm a web developer part time and I still don't know how to put up a site so it's accessible from the outside.

Share this post


Link to post

Mr.Crispy is responsible for everything good about the site, lol. When I was a newbie just getting started, I used SeaMonkey to build the 0.1 version of the site. It allows you to do “visual editing”, like the web design version of 3D mode in Doom builder - you set the background image, text colour etc and see the changes right before your eyes.

 

As for hosting it, you’ll need to make a Geocities.ws account - which is totally free. As you’re building the site, remember the think of the website not just as an HTML document, but a whole folder. Your background image, and any other images and files you want to host need to be in this folder.

 

You’ll upload your index.html and all the images and files you link to on your HTML document into a remote folder, AKA your Geocities site. “Sub sites” like the Multiplayer Tutorial on Doomshack are just a different HTML document that is linked to from the main index.

 

Both SeaMonkey and GeoCities are excellent to help budding web designers get their land legs. Once you’re successfully hosting a site there and have learned the basics of HTML, you can eventually wean off SeaMonkey as doing your own code is far, far cleaner. Later on down the road, You’ll come back to this thread and everything smeghammer and Dark Pulse have mentioned will suddenly make complete sense!

 

For me though, that was about a year after I first got Doomshack off the ground (or Doomkid’s Wadshack as it was called at the time).

 

Here’s the thread from when I very first launched the site, you can see all the helpful tidbits people gave me:

 

Once I switched from the free hosting on GeoCities to my own paid server on Linnode (which in itself was a lot to understand) I was able to use the remote server - which is basically just a remote computer running Linux - not only to host the site and start doing PHP work to allow people to host their own wads on the site and learning CSS which is crucial, but also getting Zandronum, ZDaemon and Odamex servers running from the very same server.

 

Once we - mostly Mr.Crispy - got all that shit figured out, I started a new thread. Took (almost) 2 years to get the site to roughly the level of functionality it’s at now, but it was a fun learning process:

 

If you use archive.org, you can even check out older versions of the site - Geocities.ws/doomkid was the old URL, but you can also see older shitty versions of Doomshack.org on there as well. As 90s as it looks, it’s way cleaner and more accessible these days than it was during the initial couple years.

 

(Also, wow, the site is almost at its 7th birthday.. jeez the time flies!..)

Edited by Doomkid

Share this post


Link to post
55 minutes ago, Doomkid said:

Once I switched from the free hosting on GeoCities to my own paid server on Linnode (which in itself was a lot to understand) I was able to use the remote server - which is basically just a remote computer running Linux

 

It was literally only last year when I realised that Github provides free static website capability via the Github Pages feature. Who knew? And I've been doing this shit for 20 years... It is only one per github account, but hey - free web hosting! You don't have access to any server-side stuff, but you can do quite a bit with some javascript and some imagination. It's also possible to use your own domain name if you have one - just needs a CNAME record.

Spoiler

"which is basically just a remote computer running Linux"

Once you understand Apache, it's a far better web server than IIS. SSH, terminal and nano are your friends for life!

 

 

So yes, @haruko haruhara, please ask for help and I or someone else will certainly try to assist as much as we can.

Share this post


Link to post
On 6/30/2021 at 9:52 AM, Dark Pulse said:

Like the 90s, eh?

  • Comic Sans is your font of choice
  • Animated GIFs everywhere
  • An embedded MIDI is mandatory
  • Some of those GIFs, by law, must be of fire and the dancing baby
  • Your site properly loads in Internet Explorer ONLY - fuck Netscape
  • Webpage must contain at least one Blink or Marquee tag

Am I missing anything here...?

 

Nothing mandatory, but nice to have: invalid links to the other members of your WEBRING...
 

Share this post


Link to post
On 7/1/2021 at 5:44 AM, Doomkid said:

doing your own code is far, far cleaner

 

Yes. I have been hand coding websites since I was 17 (when I pulled apart the @Mordeth website to see what made it work). So... about 24 years. Never liked the results any WYSIWG editor gave me. I get irritated when I have business clients come into my shop, I look at their sites and it is clear their "Designer" has simply sold them a template that they probably could not fix a bug in if the lives of their nearest and dearest depended on it. If you use templates like this and don't understand the code, then in my opinion you are not a web designer.

 

OK, insane rant by the crazy man over, back to your regularly scheduled DW shenanigans. 

Share this post


Link to post
On 6/30/2021 at 10:52 AM, Dark Pulse said:

Like the 90s, eh?

  • Animated GIFs everywhere
  • Some of those GIFs, by law, must be of fire and the dancing baby

Am I missing anything here...?

 

The UNDER CONSTRUCTION GIFs, of course. Back then, the Internet was all about "UNDER CONSTRUCTION" GIFs and less about cat memes. Also  made sure nobody badmouthed your site, because, after all, it was UNDER CONSTRUCTION.

 

Also, page counters, which will ofc break as soon as your host no longer supports CGI-BIN.

Share this post


Link to post

Don't forget the little "made in notepad" and "best viewed in 800x600" stickers, for cred.

 

Also: frames. Make a sidebar that's a frame, and the "main page" is another frame, and when you click on a link in the sidebar it loads the page in the main frame. So the URL never actually changes, and people cannot conveniently link to the page of your site that interest them.

 

Oh, and a welcome page! Your index.html just contains some useless "splash screen" nonsense and a link to index2.html which is the actual site.

Share this post


Link to post
On 6/30/2021 at 5:52 PM, Dark Pulse said:

Like the 90s, eh?

  • Comic Sans is your font of choice
  • Animated GIFs everywhere
  • An embedded MIDI is mandatory
  • Some of those GIFs, by law, must be of fire and the dancing baby
  • Your site properly loads in Internet Explorer ONLY - fuck Netscape
  • Webpage must contain at least one Blink or Marquee tag

Am I missing anything here...?

 

On 6/30/2021 at 6:25 PM, Dark Pulse said:

Actually, I did forget one: Background that "tiles" atrociously.

 

On 6/30/2021 at 7:42 PM, smeghammer said:

yes - fixed width and non-responsive..., tables with default border styles... link to a geocities site...

 

3 hours ago, DoomGater said:

Nothing mandatory, but nice to have: invalid links to the other members of your WEBRING...

 

48 minutes ago, Maes said:

The UNDER CONSTRUCTION GIFs, of course. Back then, the Internet was all about "UNDER CONSTRUCTION" GIFs and less about cat memes. Also  made sure nobody badmouthed your site, because, after all, it was UNDER CONSTRUCTION.

 

Also, page counters, which will ofc break as soon as your host no longer supports CGI-BIN.

 

8 minutes ago, Gez said:

Don't forget the little "made in notepad" and "best viewed in 800x600" stickers, for cred.

 

Also: frames. Make a sidebar that's a frame, and the "main page" is another frame, and when you click on a link in the sidebar it loads the page in the main frame. So the URL never actually changes, and people cannot conveniently link to the page of your site that interest them.

 

Oh, and a welcome page! Your index.html just contains some useless "splash screen" nonsense and a link to index2.html which is the actual site.

 

The fact that Doomshack has pretty much none of this stuff reassures me of its quality (I think!)

 

Well, there’s a little gif randomiser, not to mention the little quotes and fortunes.. but there’s a line between being clean/minimalist and flat out boring! A cute little gif and quip will do me, no need for bloated design that plagues far too many modern/template sites..

Share this post


Link to post
16 minutes ago, Gez said:

Also: frames. Make a sidebar that's a frame, and the "main page" is another frame, and when you click on a link in the sidebar it loads the page in the main frame. So the URL never actually changes, and people cannot conveniently link to the page of your site that interest them

 

TBQH, some "Web 2.0" sites were/are guilty of the same thing, though for different reasons.

 

Also, how could nobody mention a TABLE layout? Because, screw this newfangled DIV thing, who supports it anyway? While TABLE renders correctly* even with Netscape!

Share this post


Link to post
18 minutes ago, Maes said:

Also, how could nobody mention a TABLE layout? Because, screw this newfangled DIV thing, who supports it anyway? While TABLE renders correctly*

 

Has to be fixed width, probably with missing TDs because of bad understanding of rowspan or colspan... And the table fixed width does not add up to the TD width sums...

 

Spoiler

PureCSS or Bootstrap are your friends... :-)

 

Share this post


Link to post
On 7/14/2021 at 9:39 AM, Gez said:

Don't forget the little "made in notepad" and "best viewed in 800x600" stickers, for cred.

those are:

 

doThlUp.gif

res8.gif

 

also publicity old navigators, such as netscape or IE:

 

aamwv9G.gif.4ce4cd48b55f500eb7aba48682acba59.gif

BROWSER6.gif.c73bb613cd3003c66186fc4fea7a634b.gif

netscape.gif.2217bf38892c844e51928158f719eb17.gif

wG7QI4h.gif.4c2018e4f72de1d7c4a9c6a81e09c881.gif

 

also put an "under construction" gif/image:

conbar2.gif.57235bd16560048c9f56cd8d3a6f9e89.gif

constrct.jpg.e9455c2335b07db9b12a4217e4991d3d.jpg

construction.gif.7d3947a15048335af11e806ba4f27726.gif

Edited by URROVA

Share this post


Link to post
3 hours ago, Doomkid said:

The fact that Doomshack has pretty much none of this stuff reassures me of its quality (I think!)

 

Well, there’s a little gif randomiser, not to mention the little quotes and fortunes.. but there’s a line between being clean/minimalist and flat out boring! A cute little gif and quip will do me, no need for bloated design that plagues far too many modern/template sites..

Your website, sir, is not cool enough for the 90s.

 

Frank Zappa wriggles his mustache in disappointment.

Share this post


Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×