Help me with my new website!

[FlatAssembler]

OK, fine, there is some truth to it. But most of the first responses I got were not constructive criticism. Constructive criticism would have been something along the lines of: "I am glad that you've put so much effort trying to learn to code at your age. However, I think you've been pointed in somewhat wrong direction. It's a common mistake made by web-developers to assume that a website is better if it has more colors and animations. This is not true. When people see animations on a site, most of the people are simply annoyed by that. As for colors and gradients, they are not good either, because what looks nice and perfectly legible on your device may be completely unlegible on some other screen. Colors should always be low saturation (that means either very dark or very bright) and it's important that the contrast between the text and the background is high, but not too high. If you don't have a feeling of what's a good contrast, it's better not to use colors. In your art classes, you may have learnt that, for example, purple and yellow or green and red are the highest possible color contrast. That doesn't apply here. In fact, many people would argue that the best way to design a website is to just use some Sans Serif font (since they are considered easy to read on LCDs) and some very-light-gray background and a very-dark-gray text color with little to no images and no animations or gradients whatsoever. Also, it's important that the viewport is set correctly so that a website is easy to read on mobile devices. Since you are using a three-column layout, you will probably need to change it somewhat to make it usable on mobile devices, either in JavaScript or using only advanced CSS. It's not too hard to do, but it's quite different from the programming tasks you've probably done before. As for your PacMan game, it's a good programming excercise, however, you've chosen a wrong platform. SVG is certainly not a good platform for making games (better use something like Unity, if you've heard of it), and you probably shouldn't use it on your homepage either if you can help it. Browsers, even today, usually render SVGs much worse than PNGs. As a junior programmer, you have probably often been told it's better to code simple images into your program than to use some external tool to edit them. Well, see, that doesn't apply here. Programming language skills and algorithmic skills are important, but it's just as important to be informed about the available tools and frameworks for the things you want to make. Good luck with that website and with your future projects! By the way, if you are going to get serious about web-development, don't use free hosting. While free software can indeed be of superior quality, free hosting isn't. I am having trouble accessing your website from (where?) and you will probably run into trouble updating it.". Or do you think I am missing something?

[bennyboy]

You are like a thirsty man who's been given a glass of nice, clean water, and you complain because nobody put an umbrella in the glass for you. Right now, I'd say your ego is the biggest impediment you have to ever succeeding, more than your IQ and more than your current knowledge of programming.

[FlatAssembler]

What's the alternative? Taking the first replies I got in this thread "seriously" would have probably meant giving up programming altogether (thinking that if I haven't learnt anything about programming in five years of trying, I probably never will).

[bennyboy]

What's the alternative? Taking the first replies I got in this thread "seriously" would have probably meant giving up programming altogether (thinking that if I haven't learnt anything about programming in five years of trying, I probably never will).

The truth is simple-- you asked for a qualitative assessment of something that is low in quality.

The solutions are obvious:
1)  Make something of high quality.
2)  Don't approach learning in this particular way.

If you said, "I'm making a new site.  Any tips on how to make it great?" we would have told you all the same things, and you could have made your site, and we would have given minor corrective comments.  You wouldn't have had to take the comments as personal criticism.

Let's say I go to a dance class, and say "Look at me! How's this!?" and then I flop around in the floor like a stroke victim-- what do you think will happen? If I show up at American Idol and screech like a cat in a blender-- what do you think will happen?

[FlatAssembler]

So, how do you approach learning a new part of programming (like web-development)? Are you suggesting I should strive to learn everything I can about some programming language before making any piece of software in it? That doesn't appear to work well either.

[bennyboy]

So, how do you approach learning a new part of programming (like web-development)? Are you suggesting I should strive to learn everything I can about some programming language before making any piece of software in it? That doesn't appear to work well either.

I'm currently learning ASP.NET MVC and Razor Pages.  I started about 2 weeks ago, and I should be completed a total re-make of my homepage within a couple weeks.  That's because I get the point of things quickly, and see how to apply them to my goals.  The only people who will give me input once the new site goes live are my customers-- and THEY will be more merciless than I've been with you, 100% guaranteed.  But because I've programmed the site properly, I will be able to make changes to my (very large) site relatively easily.

The problem right now is that you're still working on the basics of programming, and you have tunnel vision. In order to get the inspiration and imagination that you'll need, I'd do the following:
1) look at a LOT of sites, and figure out what makes the good ones good
2) Do more tutorials. There are courses on Youtube for every possible environment and language. Walk through a couple of ASP.NET tutorials. Try a .php tutorial. Look at some client-side stuff: node.js / django / Angular

Don't commit your full efforts into doing things badly. In the time you spent stumbling around on your original site, you could have gone through about 20 video series and ended up with a fair working understanding of many of the popular technologies that are current, right now in the 21st century.

I recommend doing tutorials, and then adapting them to your own ideas. Any web tutorial will show you how to set up good navigation, how to use a database, how to format the appearance of the site, and so on. What they WON'T teach you is how to work with Croatian phonemes or how to make assembly code-- once you have a highly-functional, great-looking site, then you can add those contributions and hopefully get interest for them.

[T0 Th3 M4X]

So, how do you approach learning a new part of programming (like web-development)? Are you suggesting I should strive to learn everything I can about some programming language before making any piece of software in it? That doesn't appear to work well either.

Start slow and find good teachers.  I learned web development by hiring web developers for projects, then learned from them over time.  It became more practical to do it myself rather than pay someone and have to wait for something to be fixed whenever there was a problem.   Good teachers are important because there are right and wrony ways to do just about anything.  The development goes beyond building the site since you want to control traffic to your site and provide relevant to those who visit.  Also, on the Internet it's not so much a numbers game as it is about quality.  If you draw a lot of traffic, but have a lot of bouncing, you'll get a poor bounce rating score and that's just going to hurt you when it comes to being in search engines.  Bouncing is when people go to your page, then leave within a few seconds without clicking on anything.  If almost everybody is doing that, then it indicates your content isn't relevant to those visiting.  When someone like Google sees that, they don't want you high on their list because they want more relevant sources, and that in turn makes their search engine more relevant.

[bennyboy]

By the way, I should add-- while I know a lot about some things, in others I'm a n00b. I'm currently trying to record sound client-side, which to me is one of the holy grails of web programming. But when I get something that works on development, it doesn't work on live servers. Or when I get something that works on my live ASP server, it doesn't work on iOS. It's quite the wild goose chase.

I've literally copied a sample project that someone had working online, run it in development, and had it fail, and have zero idea at all why. But that's the real joy of programming, I think-- when you finally achieve the seemingly impossible, you are a god!

[FlatAssembler]

But because I've programmed the site properly, I will be able to make changes to my (very large) site relatively easily.

Ah, you make it sound so easy. Yes, not using too much inline CSS does solve some problems. But it doesn't do miracles.
The CSS "calc" function resolves many instances where you would otherwise need to use JavaScript, but it wasn't properly supported even in the browser I was using when I was making that website (Safari 6), so I was kind of forced to insert inline CSS from JavaScript to simulate that.
Even so, separating JavaScript and CSS that's used in all pages into separate files wouldn't be an easy task. To make the transparent SVGs on the homepage (the problem appears only because of the background image on the homepage) render properly in both Internet Explorer 11 and other modern browsers, I had to change quite a lot of CSS and even do some browser-sniffing in JavaScript (I gave up trying to make it render correctly in Internet Explorer <=10 and Opera <=14 and just deleted the background image in them).
Also, since I was setting up a mobile theme in JavaScript, I need to delete all the JavaScript-generated SVGs except for those that are somehow related to the text. If I'm going to just include JavaScript from an external file in all my pages, it's not an easy task. I'd have to modify it somehow, and it's not at all obvious how.
Maybe you can do that after 10 years of learning to program. After 6 years, I can't do that.

Don't commit your full efforts into doing things badly.

But if I am trying to learn how to program, it's important to build stuff, rather than just read the tutorials, right? And it's also much better to figure out how to do something myself, no matter how badly, than to just copy somebody else's code I don't even understand, right?

I learned web development by hiring web developers for projects, then learned from them over time.

I must say I am amazed. You've figured out that some program would be useful before knowing basically anything about programming? Tell me more about it! I still have no idea for a project that would be useful and relatively easy to program.

The development goes beyond building the site since you want to control traffic to your site and provide relevant to those who visit.

Well, like I've said, the page on my website that gets by far the most traffic is one about the Croatian Toponyms. I can kind of see why, but it's a mystery to me why my house-selling page isn't getting more.
It's often said that the best way to get people to see your house-selling page is to post it on Facebook in the relevant groups. However, I can't sign up to Facebook under my name, because I got banned from Facebook because of what I was posting about politics.

I've literally copied a sample project that someone had working online, run it in development, and had it fail, and have zero idea at all why.

Yeah, me too. I've tried to make a scientific calculator for Android by letting Duktape execute the JavaScript code identical to one in the web-app. Do I need to tell you how much tweaking I had to do to make it useful? First, I got a bunch of ReferenceErrors because "if (window)", which I've used quite a few times in the code, doesn't quite do what I thought it would do. Then, a bunch of errors related to the global variables not ending up initialized, because I made them get initialized only in button-click event handlers (seriously!). Then, when I finally got it to load without errors, it was very slow. But I managed to speed it up around 7 times just by minifying the JavaScript using jscompress. It's quite ironic that what made it slow weren't the terrible algorithms I've used (there is an algorithm to do something in linear time, but I was using an algorithm that runs in cubic time because it was easier to implement in JavaScript), but the incorrect usage of the framework.

[bennyboy]

But because I've programmed the site properly, I will be able to make changes to my (very large) site relatively easily.

Ah, you make it sound so easy. Yes, not using too much inline CSS does solve some problems. But it doesn't do miracles.
The CSS "calc" function resolves many instances where you would otherwise need to use JavaScript, but it wasn't properly supported even in the browser I was using when I was making that website (Safari 6), so I was kind of forced to insert inline CSS from JavaScript to simulate that.
Even so, separating JavaScript and CSS that's used in all pages into separate files wouldn't be an easy task. To make the transparent SVGs on the homepage (the problem appears only because of the background image on the homepage) render properly in both Internet Explorer 11 and other modern browsers, I had to change quite a lot of CSS and even do some browser-sniffing in JavaScript (I gave up trying to make it render correctly in Internet Explorer <=10 and Opera <=14 and just deleted the background image in them).

I'm not as extreme as that, either. Unless it's re-usable, I will usually put my javascript in <script> blocks on the page. I usually keep .css separate. And certain inline styles, like block behavior or word-wrap, are fine, too.

I looked at your new phoneme-game page, and its behavior and the code behind it look a lot more like what I'd expect. Personally, I'd recommend you start working with server-side code and a database: both to serve up your data, and also to record user inputs-- then you could give stats like how many people go each answer right or wrong and so on.

I've literally copied a sample project that someone had working online, run it in development, and had it fail, and have zero idea at all why.

Yeah, me too. I've tried to make a scientific calculator for Android by letting Duktape execute the JavaScript code identical to one in the web-app. Do I need to tell you how much tweaking I had to do to make it useful? First, I got a bunch of ReferenceErrors because "if (window)", which I've used quite a few times in the code, doesn't quite do what I thought it would do. Then, a bunch of errors related to the global variables not ending up initialized, because I made them get initialized only in button-click event handlers (seriously!). Then, when I finally got it to load without errors, it was very slow. But I managed to speed it up around 7 times just by minifying the JavaScript using jscompress. It's quite ironic that what made it slow weren't the terrible algorithms I've used (there is an algorithm to do something in linear time, but I was using an algorithm that runs in cubic time because it was easier to implement in JavaScript), but the incorrect usage of the framework.

I found my problem-- I was recording from a live mic, and when you initialize an audio context, it pops up a permission screen. Normally, that was enough to allow you access to the mic. Now, however, Chrome requires that whenever you create a new recorder, you need to do it in an event handler from user input, even if you already have permission to record.

That's a very good rule, and should be in place, but it took me quite a lot of failed attempts to figure out why the code wasn't working.