I started from scratch, and created a new weather website for myself

For about the first eight years (starting in 2007), my weather website consisted of WDL and one page from the Saratoga-script.
Then, in 2015 I started using the wonderful Leuven Template, which I customized here and there.

Halfway through 2023 I decided I needed a new weather website. This was partially because the Leuven Template was EOL, but was mostly because I wanted something new. I wanted all data on one page, neatly organized, and with a ‘responsive layout’, as it is called.

And here we are, about ten months of off and on coding later. I think it’s ready.
And when I say ‘coding’, by the way, I have to admit that I am no pro in any way. It’s a hobby. So if you’re a pro, and see something is “off” here, this might be the reason. (And please do tell me, so I can learn from it.) Also… I did have help when it came to the (for me) really difficult part; the graphs with the updating live data. So there’s that.

A couple of random things about the new site:

  • I had a logo/icon created.
  • All items on the page reload automatically (through Javascript) at their own set number of seconds/minutes.
  • The graphs with the live data have pop ups on hover, with extra info on the graph data.
  • There’s a graph with a pull down menu to show sensor data of the last 72 hours.
  • There’s a section with a pull down menu that allows you to view every monthly WD file I have (e.g. January2007.htm). New months are automatically added to the pull down menu.
  • In the footer there are green/red status indicators showing whether or not the live data on the site is accurate. (Separate scripts have been made for these indicators as well, to work with UptimeRobot.com, so I get notifications when the live data is not accurate.)
  • At the top of the page there is a section called ‘Weer-waarschuwing’ (Weather Warning), showing code yellow/orange/red notifications when present, from the KNMI (Royal Dutch Meteorological Institute), through their API.
  • Just above the footer there is an option to go to the ‘Mini’ page. This page is light weight, and displays only the bare essentials.
  • Something that stayed: the up/down and wind arrows (the graphics) I first saw in the Saratoga script. Why change what works.
  • I’ve been using the same source website for including radar/satellite images for years, but at about the same time I was creating my new site, they called it quits. So I’m now experimenting with a new radar/satellite images provider.
  • It is all in Dutch. Sorry about that :stuck_out_tongue:
  • I have tested the site on several operating systems/devices, and as far as I can see, everything works like it should, in all modern browsers.

There are still several small things I want to fix/improve upon, but I think the site is ready to go live :slight_smile:

Please tell me what you think: https://meteohilversum.nl

4 Likes

Hi there
Very nice site…clear and to the point with good information.
Would love to know how some of them were done

Your new site looks great and is nicely laid out. My command of the Dutch language is pretty much zero but I figured out what most of it meant. Well done for coding it yourself!

Thanks a lot! Nice to hear.

Thanks!
And could you specify your question on how things were done? Maybe I can shed some light here and there :slight_smile:

Great Job! Nicely done.

1 Like

Looks very nice.
Mooi man, ziet er goed uit.
Radio 11 :grin:

1 Like

Yes. That’s that other hobby that also takes up way too much of my time :laughing:

Do you have any plans to share the code? Your site looks great, nice job!

My chrome browser translates it automatically, you should turn it on.

Thanks!

About sharing the code: if there is a specific part you’d like to have for your own site, I’d be happy to share the code for that. (Like swright1957 who now has the three files needed for the Almanac part.)
But I don’t think I’ll release it as a template, if that’s what you meant. For me it was quite the journey getting my site to look and function as it does now. But I cannot provide support for it like Wim does for his templates. That’s on another level.

Currently a weather warning has been issued because of fog. Since a weather warning doesn’t happen that often, here’s a screenshot of what that looks like :slight_smile:

Very, Very nice! This is a template quality site.

1 Like

Why, thank you! That’s nice to hear :grin:

I would set the uv-index graph scale to 10 instead of 16.
9 is the highest we can get in the Netherlands if I am not misstaken.

Good point. I guess I just used the default that I also always had in the steelseries dial. Maybe I’ll change it. I’ll think about it. Thanks.

nicely done! I’ve created some “charts” using the data I’ve collected, but not as nice as what you’ve done. Nice job.

Hoi Beun

Mooie site vooral de 72 uur map (heeft mijn belangstelling :wink: )
Wil je die delen ? mijn https://www.weersverwachtingen.eu/clientraw/wd-ajax-ml/wxindexcsv.php kan niet meer worden weergegeven.

Nice site, especially the 72 hour map (has my interest :wink: )
Would you like to share ? my https://www.weersverwachtingen.eu/clientraw/wd-ajax-ml/wxindexcsv.php can no longer be displayed.

edje

Nice site! I was wondering how did you get uptimerobot working with your site? was it hard? I would like some kind of notifications if my site goes down.
Thanks!

Thanks!
But, now I’m curious as to what your charts look like. You don’t have a website in your profile?