Every Fucking Bootstrap Website Ever (2019) | Hacker News Reader

Every Fucking Bootstrap Website Ever (2019)

dagusa.com

184 pointsFastEatSlow129 comments

Open articleView on HN

HEY LOOK, IT'S EVERY SUPERMARKET EVER. Huge automatic glass doors, shopping carts, aisles with stuff on shelves. So fucking creative.

This is a good point, but it doesn't invalidate the premise. The first sites to use bootstrap and this particular brochure template truly stood out. And today, with everyone using it, it still works okay, well enough to be a bona fide standard, but it of course doesn't work nearly as well as it did for those early adopters.

What I'm saying is, the next big thing, for marketing in particular, may very well be derided in this same "Hey look..." manner after it takes off in popularity, but the pioneers of that next big thing are going to reap serious profits.

this is a good analogy, in that some supermarkets feel soulless, whereas others feel really cozy, even though ultimately they both have aisles with stuff on shelves. it's like the difference between someone using a template versus making something by hand. there's a human feel to the latter.

I think you both have a good point. I guess it depends on what your relationship you have with food. Do you prefer your shopping experience to be predictable and efficient or do you like to discover something new and exciting.

Realistically, most people who browse the web don't care too much about website design and just want something reasonably functional that's not too ugly.

Supermarkets really need to get with the times. I mean, barcodes? Please. It's like they're not even trying.

Seriously. We're soooo over 1-d barcodes. Need to get a QR code on all that stuff. MMmmmmm.... Fiducial markers - that's hot

brb patenting higher dimensional barcodes / tensor barcodes

Finally, we can use holograms for something mundane!

Pretty neat. You can encode 100 megabytes of data in a 4x4x4x4 cm tesseract, just need to apply an appropriate rotation around two of its axes and then you can extract the information as it intersects with 3d space.

That adds an additional temporal component to the scanning process which makes me hesitant.

However, the idea is ridiculous enough to greenlight.

Just go full panopticon with a thousand cameras, so that the looters don't need to put in all that selfie effort.

That’s Amazon Go.

They usually use 2D barcodes for weighed items at the deli.

I mean you joke, but a local sports good store has switched to using RFID tags for all their products. First time I went shopping after the change was rather startling. I dumped my purchases at the cash register and almost immediately the cashier read me the total.

I see no reason supermarkets couldn't do similar once this sort of tech gets prolific enough.

afaik some of them use quite cool tech - fully automated sensors for just about anything plugged up to complex workflows and whatnot

And every apartment building, and every fast food restaurant... Why Everywhere in the US is Starting to Look the Same: https://youtu.be/UX4KklvCDmg

If you're in the burbs. There's a reason sprawl sucks

I love my little patch in the burbs.

or restaurants with plates

https://old.reddit.com/r/WeWantPlates

Plates are sooooo 2010's if my food isn't served on a wooden board or a tile I'm not even interested.

A wooden board is fine for a charcuterie plate.

But what's ridiculous is breakfast being served on a shovel.

Or a plaster mould of the chef's mouth.

Or spaghetti being just dumped all over the table.

A supermarket isn't designed to sell you on a product.

They are literally designed to make you buy products. The milk in the back corner is the most famous example so that you have to pass by as much product as possible to get it and have less chance of not impulse buying. End caps…all the candy right next to the checkout lane, etc.

I guess I worded it incorrectly. My point was that it's two completely different ways of selling you things. Supermarkets use all these techniques to subconsciously make you buy more things, but they rarely try to sell you a singular product.

Product websites actively try to distinguish themselves, to make you feel that the product is unique and convince you it'll make your life better. Having the same style of website for every product ever feels like something that'd actively go against the goal of the website. After all, if two things look the same, why would I pick one over the other?

As a previous bagger boy gone stocker gone high-as-a-kite meat dept clerk, the milk is in the back because it is stocked from a walk-in fridge. People don't even buy much milk.

Or you can just walk past the deli and the bread section, like I do at my local Safeway.

...what do you think they're for?

I... I'm awe struck by this comment..

I've been an active reader of HN for 5 years and this has to by far be the most wrong comment I have ever seen. Absolutely bone-headed.

Believe me, you're not even trying if that's the most bone-headed comment you've seen on here.

I mean, there are certainly bonehead comments. Any time Jan 6 comes up, conspiracy theorists will come out of the woodwork and say it was a false flag operation done by Antifa or the Deep State. Nearly anything supporting NFTs is bone-headed.

But this one was just baffling on another level. Like...what do you think supermarkets exist for? Just for people to look around and go "Neat! They put a whole chicken in a can!"?[0]

[0] There actually IS a supermarket like that though. It's called Omega Mart, and it's a tourist attraction in Las Vegas. They sell weird shit like a household cleaning spray called "Who Told You This Was Butter? Seriously, Don't Eat This", "Emergency Clams", and a laundry detergent called "Plausible Deniability". But even in the case of Omega Mart, you can still buy all the products.

Supermarkets are literally designed to sell you on products. Every single product placement is from a planogram meant to juice the sales per sqft of space, from which aisle the item appears to which row and where within the row it’s positioned.

https://www.reddit.com/r/confidentlyincorrect/

Not even close. We're missing at least 27MB of carousel images, an entire mp4 on loop, a 4k 4000x4000 png being displayed at 320x320 and few MB of analytics.

It didn't even hijack the back button or ask me to subscribe to a newsletter.

You mean 50MB of analytics. Per minute.

This guy web develops.

This is amusing as a developer, but there's a reason why Bootstrap is still a thing. It works. And I don't even really like it, to be quite honest. Yet in terms of what it's designed to do, it succeeds. The public doesn't know what Bootstrap is and, with a couple tweaks to the colors and border radii, they won't even notice that they're on a site that's nearly identical to a millon+ other sites.

I go to a bootstrap site and I know what to do. Familiarity is a feature.

I honestly get pretty confused by these websites, usually I have to use ctrl+f to find the content, but often I fail to find what I'm looking for.

UI that does that collapse thing (mobile Wikipedia for the fail!!) causes the find on page feature to become useless.

Yeah it's still way more popular than Tailwind for example.

https://2021.stateofcss.com/en-US/technologies

Does it work? I'm probably not the target audience, but I don't know who would actually read a bootstrap page. It's a few sentences worth of information bloated up in both page space and data.

The first and only thing I do is find the link in the top right that leads to a more traditional page that actually contains useful information (e.g., Docs, FAQs, About).

This conflates websites as a medium of art or personal expression vs websites as a medium of business communication. For the latter, I just want to get the point across quickly and painlessly. For the former, everyone is welcome to design whatever they want and consume as much time is required.

No, truly utilitarian websites look and function like this: https://smxi.org/docs/inxi.htm

The template in the article is exact opposite. It conveys bloat, unoriginality and impedes efficient communication of information.

Here's the thing, that website doesn't actually efficiently communicate as well as you think it does.

Information hierarchies have a bunch of channels to get the reader to understand what's important and what's not. Text size, color, motion, placement, rotation, contrast, images, etc. all contribute to drawing the eye to key pieces of information.

The link you presented is simple, yes, but the information hierarchy is nearly flat. It presents all the information as equally important by reducing the channels for information transmission it uses.

Our eyes focus on certain details because we have monkey brains that have been trained to pattern match certain things.

I am not convinced. It does a far better job of organizing information in my opinion. Clear, concise, zero bullshit.

Ok. I'm sorry you aren't convinced.

Here are some resources to educate yourself:

https://www.nngroup.com/articles/visual-hierarchy-ux-definit...

https://xd.adobe.com/ideas/process/information-architecture/...

https://uxplanet.org/visual-hierarchy-and-ux-design-a-guide-...

https://www.interaction-design.org/literature/topics/visual-...

https://guides.lib.wayne.edu/iaux

It's a field of study that has research to back it up. It's great you find that link legible, but most people would not. Even most developers would find it helpful to tweak whitespace, use headers, and layout the content a little more structured to improve legibility.

Most of the UX studies are subjectivism dressed as objectivism.

The entire field is like nutrition or fitness, 90% of it is bogus and made up. None of these studies have proper controlled experiments while still trying to appear as authoritative.

No one takes a step back and realize that physical books are an interface and so is your kitchen. Photons hitting your eyeballs have no clue if it came from a computer monitor or the world around you. Organizing visual information is far deeper than these "UI/UX" experts.

Here's five studies:

https://scholar.google.com/scholar?&q=Djamasbi%2C%20S.%2C%20...

https://scholar.google.com/scholar?&q=Djamasbi%2C%20S.%2C%20...

https://ourapps.princeton.edu/uploads/190805104123-A-3176.pd...

https://citeseerx.ist.psu.edu/viewdoc/download?doi=10.1.1.87...

https://www.sciencedirect.com/book/9780124081383/eye-trackin...

I'm sorry, you just don't know what you are talking about. This is a widely studied area in human computer interaction both academically and informally.

I don't understand the infatuation with obscure irrelevant studies to make a point. None of these are remotely relevant to the page in question. Linking to sources isn't a way to escape basic common sense scrunity.

Basic common sense says the site has poor visual hierarchy. These links in the past several posts have been to highlight that the common sense understanding is that it has poor visual hierarchy.

The basic scrutiny agrees with me, and the sources are to help provide both subjective and objective reference that shows that, yes, the common person would prefer a more structured layout.

None of those back up your assertions about the linked website, which has very clear information hierarchy. Category nav links at the top. Key topic links in a list and sublists (how's that for hierarchy?). The information hierarchy is easy to see and navigate, much unlike modern websites which mislead the reader with a lot of irrelevant images and layouts.

The limited site is like 4 blobs of text with equal weight. Yes, it has a nav bar, but it's not at all trying to emphasize the key takeaways.

Yeah but outside of HN, that is probably considered dated/ugly.

That's not my point. I am responding to OP that if we don't care about dated/ugly/not-unique/fashion/medium-of-expression/art/etc, then inxi website does the job better than the template.

That’s not all that functional. The only two links I clicked, changelog and cli options, are just copy and pasted as preformated text that scrolls horizontally.

Putting zero thought behind UX isn’t the pinnacle of UX despite what we celebrate on HN.

Yeah, but they don't sell to a very wide audience. It needs to look nice, not unique.

>> No, truly utilitarian websites look and function like this: https://smxi.org/docs/inxi.htm

To some extent, the majority determines what is utilitarian. Once Bootstrap achieved mass familiarity, it became utilitarian -- because almost everyone knows how to interact with it, the flow, the location of the information.

I checked out the site you shared -- it is indeed utilitarian...but it is also unfamiliar and hence to me, it makes it more difficult to find the required information at a glance.

while I agree with you in theory, As a business operator, i'd rather win the customer than win the academic debate.

If you have your business website look like that then you are gonna lose a lot of customers before they even start reading. It looks like it's from the 90s

https://berkshirehathaway.com/

If you're talking about a business that needs to market to customers through a website; I agree with you.

But I thought OP is talking about efficient communication which I what I responded to. Every comment response is completely misunderstanding where I am coming from.

I'd probably appreciate this humor more if I hadn't experienced the web before design frameworks existed. Bootstrap was a step in the right direction, and while I don't think anyone owes it any level of respect for that, I respect it. And if you've ever had to do literal 'pixel pushing' as part of your job, these frameworks were a godsend. Things were mostly lined up well or could be made to easily, and if anyone had a problem with the way things were lined up, you could blame it on Bootstrap, etc.

Also, people can make uninspired designs with just about any framework.

Shouldn't there be a popup to subscribe to a newsletter before scrolling 10% of the content?

That comes up when you scroll down 4 pixels and can't be exited out without giving a BS email address.

It'll pop up when it sees the mouse pointer move up the page to the back button/URL bar.

Bottom line of the source: (don't go there, it's an adsite now or something.)

The original rant from 6 years ago is here.

https://devrant.com/rants/75712/http-adventurega-me-bootstra...

It would have been nice if they'd have provided a download link or github repo so I could use this as a template to quickly launch new sites.

I thought the same thing: https://github.com/StartBootstrap/startbootstrap-creative

Looks like it was copied, no idea if it's the same owner or not.

>

Just needs a stock photo of some business people shaking hands, and maybe a pic of a laptop with some code and it's all set.

I hope Will Smith slapping Chris Rock becomes one of the main "teamwork" or "synergy" images.

This takes me back. Around 2014, back when I had no idea how to code, I wanted to make websites. I knew that HTML was a language used to make websites, so I tried to learn that. After a few failed attempts at understanding what I could all do with HTML and CSS, I looked into bootstrap. I knew nothing about it, but it was used on my favorite forum at the time, so it must be good. Looking into bootstrap led me to find templates. In fact, this is the exact template I first used for my personal home page.

It was through this template that I fell in love with just making things, even if it wasn't original, or groundbreaking, it felt good to start digging into code, understanding the recipe behind the product. Here I am now, working on full-fledged software, happier than ever in what I'm doing, and it all started because of "this fucking template".

This template looks great actually. I think I'll use it for my next random website project.

Who cares? Function over form.

The point of Bootstrap was to "make the default web beautiful". The better question is the poster feels the need to piss on everyone else's work.

Who cares? If it works, use it.

Yeah, I hate flashy websites. I rather go with boring than distracting.

And the various browsers have their own default styles for everything including buttons, inputs, paragraphs. Lets use those again instead!

I recently grabbed a CSS framework that would take care of 95% of the styling I need for a prototype. Half of the reason for selecting Bulma is that it looks slightly different than Bootstrap. The same complaint applies, but I just want to work on the functionality right now :shrug:

Client: "I want a website for $299."

Me: "Sure, here, allow me to spend 5 weeks, 40 hours a week, developing a custom website for you. Wait, no, here is your cookie cutter website that I slapped together in 30 minutes. We good?"

Client: "No. I read this article that was called "HEY LOOK, IT'S EVERY BOOTSTRAP WEBSITE EVER" so I want more than a cookie cutter template. Please spend 5 weeks, 40 hours a week, and give me a fantastic website for $399."

Me: "OK. Sounds reasonable after all."

As much as I like custom made websites and design that take a lot of time, thought, and effort, I really hate when they make things too unique by doing something weird, like making me scroll left to right across the website, instead of up and down because "The concept is for the user to read it, like a book. Because the website is about an author. Get it?"

There is a twinge of pain that I feel in the corporatization of the internet, and the loss of fun that used to be so present, but I cannot in good faith deny the level of predictability and ease-of-use that comes with standard templates like that one. It's clean and to the point. It's nice to look at. It's so common because it's such an excellent design. Get the point across, offer a little bit of detail further down, offer contact info for those who are still interested.

I also really appreciate the lack of one of those tedious "not-a-popup popups" that so many websites have gone with, where they try to get you to sign up for a newsletter of a website that they couldn't be bothered to update their copyright info in the last 2 years.

I don’t every site need to be a special little flower.

Many sites are just transactions. I’m there to get some info.

If it looks like other sites, fine by me. I know what to do.

More often than not I’m annoyed by special sites where i just want some info.

The best part is at the very bottom they say

> Honestly this template does look really nice, though.

I feel like this person wants the layout to be the Comic Sans of web design, where people in the know smugly look down on anyone using it.

Carefully crafted, unique designs of all sorts should be appreciated and lauded, but shitting on anyone who doesn't live up to that high standard doesn't seem terribly productive to me.

(Also, I'm not an actual web developer, but when scrolling through the site I did find myself thinking, "Huh, if I need a website in the future maybe I'll just use this template.")

Template looks great - I'm glad everyone uses it versus hand rolling six thousand other ones.

I’ve used bootstrap themes successfully quite a few times for internal applications.

I just pick something that uses stock bootstrap and adjust the colors, shapes, sizes, and font to taste. Add some extra utility classes or widgets. Maybe an icon library and a logo or two. If you’re looking for it, you may notice it’s bootstrap. At least it looks like someone put work into it.

Not bad to be honest. If you replace that font with something like IBM Plex and fix those horrific buttons it's a cool template.

Ok, but like, this looks nice? And it works smoothly?

Not everything needs to be novel. It's ok to just be a functional, nice looking, boring basic-bitch website, right?

It might be the pumpkin spice latte of websites, but just because it's popular and basic doesn't mean it's not valuable.

Let people enjoy things.

Same can be said for a lot of tailwind and material ui sites. It’s all the rope to hang yourself with :)

* UNDER CONSTRUCTION * 2022 edition!

And it looks totally fine. Thanks for making sure those gates are kept though.

So what should be done to appease you? Add some corporate memphis? Maybe do some cool brutalist stuff that gets designers excited and that no other human being in the world wants?

You're watering down the definition of gatekeeping. God forbid someone add snark to an opinion on web homogenization. At least they credit it to looking nice at the end:

> Honestly this template does look really nice, though.

Yup, it's a popular template because it looks good and works very reliably.

The page concludes “Honestly this template does look really nice, though.” I’m not really sure what the author’s point is.

Is there a higher point? It seems to be a joke about the prevalence of one particular website style. Sometimes the chicken just needed to get to the other side.

What are the gates in this situation? The gates of design? What do the gates keep out? I'm honestly confused.

Add slow scroll hijacking.

It's missing the stock photo of manly man with a big beard, plaid shirt and some tasteful tattoos infront of a exposed brick wall with some Edison bulbs for lighting.

Not just every bootstrap website. This is literally the stereotype of web 2.0. Every site was vertical scroll with absolute positioned static elements you scrolled down past.

I used to think that was bad. But compared to the javascript applications of today that don't even have text or images unless your run their code those sites were/are at least functional.

Web 3.0, of course, will be way better. Fully functional links and effective calls to action, that only cost you one or two hundred millionths of a Bitcoin to click!

Simple websearch reveals: Original GH repo still available https://github.com/jkarbows/adventurega.me/tree/gh-pages/boo...

If you look into the source code you'll find a link to adventurega.me/bootstrap/ where it was supposedly cloned from through HTTrack. This redirects to a Typeform though asking things like current living situation in Germany and German-Russian relations. I don't get it.

This is now Tailwind. Purple everywhere!

Thank you for showing me this! I am looking to build an internal tool for a tech team and was thinking of what framework to use to make it look something simple but post-1995. It was going to be Bootstrap but I'd never seen Tailwind before.

The author is trying to be funny, but newsflash: Most people want to get shit done.

I thought they used that purple for examples because it --should-- stop people from copy-pasting examples without making at least that one modification. That you could not paste that into your site and think, "Oh, that's good. Just like that."

https://proton.me/

Honestly, the only reason I am not using ProtonMail is because of the gaudi colors. There is a serious lack of Swiss-ness in their design; aesthetically and functionally.

I use protonmail for my personal user and haven't seen the homepage in while. Thanks for sharing this.

Show me the author's real website, along with some honest reporting on what their design/web background is, and how long it took them to design/build/test/maintain the style, and you will probably have your answer why bootstrap is so popular.

This is a template, no Bootstrap. Anyone who is not a CSS guru and also kind of hates it will tell you Bootstrap and similar CSS frameworks are a godsend.

If the joke is everything looks the same, then it also needs a sticky nav, ask for ur email, and ask if you like cookies.

Awesome, but it seems like it’s also missing:

- an auto-playing ad covering the top half of the screen

- a cookie pop-up with “Accept All” dark patterned in and covering the bottom half of the screen

- a full screen email prompt popup once you interact with the page in any way

The phone number at the bottom of the page seems to be a legitimate phone number for "Berg Consulting and Technology Leadership" in Wisconsin, US.

Hopefully that is actually the site owner's number and not someone else's.

It is actually his phone number, the website (dagusa.com) is on the same IP as report.ly, which is the real mailto right next to it. The same phone number is on that page.

I called the number. It works! If you loled, send this man some work!

Funny but these days, I see a lot of sites built using Tailwindui.com and even I was playing around with it to build stuff. If it helps non designers put something up fast, who cares.

Good. This weird glam design trend I have been noticing is gross

Not a bad thing - new users are already used to the navigation.

The same dev probably complains about the iOS apps with weird custom controls that don't follow the guide.

Consistency is a good thing, whether it's on a phone or on the web.

I have a site using Bootstrap.

I find the easiest thing is to change the primary color and then remove border radii and you're golden - no-one notices or complains.

I still don’t think I could do this with bootstrap.

Where are the bogus statistics that count from 0 to X that show how many cups of coffee have been consumed etc..

And it still looks nice and is sufficient for most people's needs if they just have static content.

One day, people will get bored enough with it and something new will emerge.

Body text shouldn't be centered, it makes it harder to read.

They forgot the "Testimonials" from fake customers.

To OP: very delighted to see my first ever website featured here on-

Shoot.

You've got some bugs with the nav link highlighting

Don’t bugs that are never going to be fixed make for better satire?

Perfection

It's a shame that Foundation withered. Their CSS framework is vastly superior to Bootstrap.

In my view the main issue with Foundation was the documentation, which is where Bootstrap shines while most other CSS frameworks and pre-baked design systems are generally lacking.

Reply on news.ycombinator.com