As I mentioned in one of my posts, I am a very old fart and I haven't kept up with the latest techniques in website design. This is the first website I am designing which hopefully will be responsive. This may also be the last website I ever design because I am just too old to keep with the quickly changing technology.
Sad part is, most of it in terms of good practices HASN'T changed in a decade and a half -- the problem is most of the tutorials, books and people teaching it never pulled their heads out of 1997's backside in the first place. It's how HTML 5 came into being, as it's carefully crafted to set development practices BACK a decade or more.
But yeah, it is hard to keep up; the old IT saying from the '80's comes to mind: "3 years is obsolete, 5 years is the scrapheap."
Which is why many experienced IT folks think a bachelors is a waste of time and money. Only people who know nothing about IT or haven't worked in the field for more than a decade could possibly think a college education in the topic is worth a flying purple fish.
I now have to make this navigation work with drop-down menus. Can anyone point me to tutorial that will help me accomplish this? I have made many of the old conventional websites with drop-down menus in the past, but this is quite different from anything I have done before.
Dropdowns can be very difficult to work with in a responsive layout, particularly if you care about mobile users. Generally speaking I've STOPPED putting them on websites and put sub-navigation into a sidebar instead. Really they are painful to use and are not compatible with the whole "shrink it down for mobile" nonsense. Between "link overload" -- giving the visitor too many options at once, "false simplicity" -- oversimplifying a complex task to the point it's actually harder to use, and "accessibility, what's that?" -- where you get so much CSS and JS going on that in trying to make the page useable on different devices you've made it harder to use on different devices... You might be best off just finding some other way to deliver sub-pages. Keep the main menu simple and direct to the sub-sections, with good old 'drilldown' navigation for the rest of the site.
Basically, it's way too easy now to get too complicated for your own good... and sadly many ridiculously overcomplicated things that make more work are sold to people as making life simpler, faster and easier; the exact opposite of what they actually do. Again, see jQuery, BootStrap, and the vast majority of HTML, CSS and JS frameworks.
As pointed out in the above posts, there are many ways of doing things with HTML5 and CSS3. Unless you use it on a daily basis it is difficult to know which is the best path to take.
Particularly CSS3 which has been a total game-changer... though it's not that hard or that complex if - as I keep saying - you know semantic markup, separation of presentation from content, follow accessibility guidelines, build with progressive enhancement so you have graceful degradation, and all the other good practices we're SUPPOSED to have been using the past decade and a half. That many developers still scoff at in ignorance, sleazing out presentational HTML 3.2 and slapping 4 tranny or 5 lip-service on it.
As to the trainwreck known as HTML 5 for the most part there are only a handful of reasons to use it:
1) you REALLY need to deliver video and audio to people dumb enough to throw money away on Apple products just to be told that they don't even own the device and can't run third party software unless it's "approved" by them. Have fun screwing around with four different codec/container combinations like the worst of the late '90's wmp vs. quicktime vs. realplayer nonsense.
2) You're building a web application and are using MANIFEST
3) The client "demands" it because they only know it as a sick buzzword with no clue what it really means other than "5 is greater than 4 so it must be better". In which case you build the page in HTML 4 strict or XHTML 1.0 Strict (the current recommendations) and then slap the 5 lip-service doctype on it when finished.
Apart from that, all HTML 5 does is re-introduce old redundancies, create all new redundancies with allegedly semantic wrappers that serve no legitimate purpose on a site, promote vendor lock-in, and basically undo all the progress HTML 4 Strict was supposed to be about.
After all, there's a reason HTML 4.01 Strict and XHTML 1.0 Strict are STILL the recommendation doctypes, when they are 1998 era ideas. Here's hoping the idiocy known as HTML 5 NEVER becomes a recommendation, or that by the time it does, we'll have a HTML 6 Strict that undoes all the garbage it's pissing on the specification with just like HTML 3.2 before it.