Help me with my new website!

[FlatAssembler]

[T0 Th3 M4X]

I do my own web development, and I didn't read through the whole thread, but here are my initial recommendations. I can help you with some of it if you like.

1. If you're starting a new page, simplify it. It looks like you're trying to do too much too quick. Just get the basics down, then add gradually.
2. Pick one font, one size for that font that's easy to read, and try to use it as much as possible through your site. This is known as "font agreement". When you can do this well, it will help keep people using your site since it's easy on the eyes.
3. Make better use of the sidebars. I would suggest using only one.
4. Pick one primary color, and no more than 1 or 2 additional color for things like borders and to identify clickable links.
5. Add a photo to break up the text a bit. Something that is expressive of the site and the message you want to share.
6. Move the bit about you to an "about" page.
7. Display your favorite song by moving it to a sidebar, then have it so visitors can listen to the track by clicking a play button or even if it in video form through YouTube (Don't have it play automatically)
8. Also, if it's not currently responsive so that it automatically adjusts to mobile, swap out to a theme that does this.
9. Once all that is done, then you can start expanding on things like the headers, footers, content for your sidebars, and maybe linking social media if you have it.

Most importantly don't try to do too much. The best websites are simple. What makes them optimal is that anybody can jump on them, figure out the pupose quickly, and easily navigate them.

[FlatAssembler]

[T0 Th3 M4X]

[bennyboy]

This is a good example of why MVC is a thing, by the way. Here, you have some really cool programmed stuff, tied in to some really bad internet views. There are now (so far as I can tell) 3 people here right now who could design your website, including all navigation, in less than an hour.

What we couldn't do (or at least not easily) is design something that will spit out the assembly language for a given formula. That is a spectacularly cool thing.

[KevinM1]

This is a good example of why MVC is a thing, by the way.  Here, you have some really cool programmed stuff, tied in to some really bad internet views.  There are now (so far as I can tell) 3 people here right now who could design your website, including all navigation, in less than an hour.

What we couldn't do (or at least not easily) is design something that will spit out the assembly language for a given formula.  That is a spectacularly cool thing.

Yeah, separation of concerns is key, not just with web programming, but programming in general.

The compiler page does look a hell of a lot better than the rest of his site.  While a Windows 95 inspired look isn't all that fetching in 2018 (it's literally a 23 year old design aesthetic), at least it looks like something I recognize and I have a somewhat intuitive idea of how to engage with it.

But the rest of the site is still Geocities, using old (I mean, late 90s/early 2000s) techniques to render content.  No separation of concerns (external CSS or JavaScript), repeated calls to getElementsByTagName and getElementById on the same elements which is incredibly inefficient and should be a code smell to any student, a bouncing ball and a fade-in effect for the entire site for no real reason, random colors with no sense of theme (plus gradients), etc.

Suggestions, for like the 5th time:

No gradients
Pick 2-3 colors that aren't black and white for your overall theme (black and white is for the main body text)
Pick colors that don't clash (look at a freaking color wheel)
No gradients
Pick a maximum of two fonts
Your primary font should be very readable... since your site is mostly technical, sans-serif, with a good looking monospace (I like Adobe's Source Code Pro) for any code examples
No frivolous bullshit - no random cloud background, no fade-in, no bouncing ball
Consolidate and separate your code - external CSS and JavaScript where possible, adhere to DRY (don't repeat yourself) principles, save any element you obtain by one of the getElement(s)By... functions in a variable, etc.

[T0 Th3 M4X]

This is a good example of why MVC is a thing, by the way.  Here, you have some really cool programmed stuff, tied in to some really bad internet views.  There are now (so far as I can tell) 3 people here right now who could design your website, including all navigation, in less than an hour.

What we couldn't do (or at least not easily) is design something that will spit out the assembly language for a given formula.  That is a spectacularly cool thing.

Yeah, separation of concerns is key, not just with web programming, but programming in general.

The compiler page does look a hell of a lot better than the rest of his site.  While a Windows 95 inspired look isn't all that fetching in 2018 (it's literally a 23 year old design aesthetic), at least it looks like something I recognize and I have a somewhat intuitive idea of how to engage with it.

But the rest of the site is still Geocities, using old (I mean, late 90s/early 2000s) techniques to render content.  No separation of concerns (external CSS or JavaScript), repeated calls to getElementsByTagName and getElementById on the same elements which is incredibly inefficient and should be a code smell to any student, a bouncing ball and a fade-in effect for the entire site for no real reason, random colors with no sense of theme (plus gradients), etc.

Suggestions, for like the 5th time:

No gradients
Pick 2-3 colors that aren't black and white for your overall theme (black and white is for the main body text)
Pick colors that don't clash (look at a freaking color wheel)
No gradients
Pick a maximum of two fonts
Your primary font should be very readable... since your site is mostly technical, sans-serif, with a good looking monospace (I like Adobe's Source Code Pro) for any code examples
No frivolous bullshit - no random cloud background, no fade-in, no bouncing ball
Consolidate and separate your code - external CSS and JavaScript where possible, adhere to DRY (don't repeat yourself) principles, save any element you obtain by one of the getElement(s)By... functions in a variable, etc.

100 percent agree with what he said.  Simple is optimal.  Once you reformat it, you can expand a bit from there, but you can't to keep things as uniform as possible.

[FlatAssembler]

[bennyboy]

That looks MUCH more like a modern browsing experience, and the script looks really nice and clean. It scales nicely with browser size, as well.

You've used almost the exact same system as I use for my slideshow app-- preload all images in hidden divs, then use js to choose which to show.

If you really want to minimize bandwidth, then you could consider the following:
1) Make special downsized thumbnail images (I noticed you used fullsized images for them).
2) Have a single div for your main image window, and just change the src when a thumbnail is clicked, i.e. load each full-sized image only on demand.

For overall smoothness and coolness, the way you've done already is perfect. But for absolute maximum bandwidth saving, you could probably reduce it down to just a couple hundred kilobytes / visit unless someone chooses to click on all the slides.

I'm curious though: why do you build your slideshow divs directly in javascript, rather than in server-side markup? Are you using some kind of client-side programming tool that does that automatically?

But anyway. . . good job.


PS your home looks very nice. I'm sorry you have to sell it, but I'm glad you are trying to follow your dream!

[LastPoet]