200k sounds huge for a navbar to me but you must be adding stuff I can’t see you woudl need in the demo.
A quick PageSpeed check shows it’s mostly JS and you have 30Kb of unused FA symbols and 3 font weights are being loaded.
Not sure what you are gaining over a Source Navbar using the CTA containing a Popdrop burger and 3 icons in it.
That’s just random stuff on the page. It’s kinda irrelevant what additional stuff is on the page. It’s the size comparisons that matter here.
Sorry, but you’re once again missing the point. That is just a demo homepage navbar. Which may or may not be doable with the Source navbar. The point is it’s a homemade navbar which can be adapted to offer pretty much any setup you want without being restricted to any particular framework.
OK, to put this one to bed, for anyone other than me still reading this!
This is the final version: BWD | My Website
I’ve called it the BWD menu, as the menu items are mostly all BWD stuff, in particular BP2 for the buttons. The grid is Source Grid Plus with the Grid Enabler stack. The theme is Foundry, with the foundry stuff for syles and fonts etc. But of course it can be used with any theme.
The homemade menu on that page in infinitely customisable to do whatever you want. And in the layout on the demo page a total of 223kbs. More than acceptable for any navbar. I believe all the elements have the correct tags for accessability etc.
In short, my work here is done :-)
If anyone wants it, let me know and I’ll fire it into the Template Repo downloads section.
(I’ve left the other menus in the demo; Foundry, which uses Flux for the columns and all Foundry stacks. And Source, which uses all Source stacks.)
Hmmm.
Out of curiosity I isolated my main Source navbar using the CTA feature containing Source buttons, the entire page loads in 15k (excluding tha variable font) according to PageSpeed. I kept all site code.
See https://www.webdeersign.com/test2/
All Aria navigation, rolemenubar & menu item, schema definition are all present.
Building this with just with Coders might be even smaller but when you can add a Source navbar to a page, there would be little to gain to build it yourself other than relocation the logo. Adding a Popdrop for more nav items would be the next stage. Any change of page name or extra pages is catered for by 1 BP edit.
I’m unawae of what you are trying to build exactly, but it is easy to overthink navigation and they can become a sink hole of effort.
PS your new demoappears to be just over 400Kb! Also your buttons have role set to button instead of menuitem and no itemtype=“SiteNavigationElement - Schema.org Type”
PPS AFAIK Adding the Source Grid Enabler will enable this layout in any framework.
I’m unawae of what you are trying to build exactly,
Please read my previous posts!
PPS AFAIK Adding the Source Grid Enabler will enable this layout in any framework.
This is built in Foundry WITH Grid Enabler. Again, read my posts!
Out of curiosity I isolated my main Source navbar
At this point I’m not at all sure why you keep bringing up Source Navbar!
Building this with just with Coders might be even smaller but when you can add a Source navbar
See above. Put Source Navbar down. Move away from Source Navbar!
PS your new demoappears to be just over 400Kb!
I know. There are loads of things on that page apart from just the homemade navbar. If I remove it, the page weight drops by 223kbs. Therefore, the homemade navbar is about 223kbs. As covered above.
Also your buttons have role set to button instead of menuitem and no itemtype
That is good to know. Thanks. I can change that, so will.
There ya go, another made whilst avoiding doing the washing up :-)