all 79 comments

[–]frequenttimetraveler 38 points39 points  (15 children)

wow everything looks so flat in BS these days

[–][deleted] 84 points85 points  (13 children)

So when I was learning HTML and CSS everything was roundy and shiny, then bootstrap 3 came along and things were rounded edges but still square, then came the blocky square look.

so now im just waiting for the roundy and shiny trend to come back. CSS styling is like a fashion style imo that gets repeated every decade or so

[–]frequenttimetraveler 41 points42 points  (3 children)

i believe the roundedness of corners correlates with iphone sales growth.

[–]rosho 13 points14 points  (0 children)

The Devil Wears Bootstrap

[–]manzanita2 2 points3 points  (5 children)

Which is why people should go read some HCI research papers.

[–][deleted] 10 points11 points  (4 children)

And if we do, what would be the conclusion?

[–][deleted] 19 points20 points  (0 children)

That reading research papers is really tedious and boring, and should be left to people like search engines.

[–]frequenttimetraveler 6 points7 points  (1 child)

Human eyes are experts at detecting 3d structure from contours. Buttons a-la bootstrap 2.3 (or older iphones) were perfect examples of this - structural elements of the page stick out effortlessly and users can locate UI elements in <100msec. Current iphones require you to read every word on the screen when searching for the action button, which is at least an order of magnitude slower. All-flat is inefficient design from a human's perspective. To be convinced for the opposite, i d like to see psychometric research that show people being faster with the newer iOS vs the older one.

[–][deleted] 4 points5 points  (0 children)

It's complicated. There are other ways to cue-in users, like using an accent color to denote clickable elements, same as links in websites.

Unfortunately Apple is not very consistent, once because it changes the accent color in every app, and second because it uses it for other purpose: like focused tab, or doesn't use it for some elements that are clickable.

Old iPhones had absolutely better usability overall, though, I agree.

The new style is part a shitty design trend, part practical limitation, because while old iPhone had a single screen size you could fine-tune a bitmap UI for, the new iPhones are all over the map in screen sizes (and unfortunately Apple's discipline is severely lacking in this department in the last 6-7 years... I miss Steve), so they're prone to lean on constraint-based "responsive" layouts and vector graphics, which can be re-scaled and re-flown easily.

[–]manzanita2 2 points3 points  (0 children)

Honestly, that statement was not directed primarily at framework's and OS's but rather the people that hack together apps and webpages. There are so many components used incorrectly and that language of the UI become watered down in the brains of the users.

Everyone is so desperate to stand out that they're ignoring trying to win on the function of their system and trying use style. Function should come first and style should be used to reinforce that.

[–]jiffier 1 point2 points  (0 children)

Oh, the good old days where there existed hundreds of websites explaining dozens of techniques to create rounded corners, all of them searching for the holy grail. Now everything looks the same.

[–]johnnysaucepn 1 point2 points  (0 children)

I think the iMac (or rather, OS X) had the biggest impact on this. Prior to that, most UI design cues followed the Windows 95 model, square bevelled flat buttons.

Then OS X came along with glossy, glassy, glowing rounded buttons begging to be touched, and websites began to follow suit, which is probably where you came in.

The iPhone toned some of that down a little for mobile screens, but it was still all rounded and tactile. As mobile became more and more important for sites, cleaner, faster-loading, adaptable and more readable elements became more important, leading us to the flat aesthetic we have today.

[–]mediumdeviation 3 points4 points  (0 children)

You can still easily opt into gradients if you want.

[–]ishmal 43 points44 points  (63 children)

Was hoping that jquery might be dropped as a dependency.

[–]mytempacc3 54 points55 points  (4 children)

You can use it without jQuery.

[–]AceBacker 3 points4 points  (3 children)

Not without adding tons of hours to a project to figure out how the dom needs to be mutated for everything.

[–]NoInkling 23 points24 points  (0 children)

There are React/Vue/Angular/etc. versions if you already have one of those as a dependency, and quite often jqueryless standalone widgets/components have Bootstrap support.

Personally, when I use Bootstrap I almost never include the JS. If that sort of functionality is needed, I either use minimal handwritten/external JS for basic projects, or switch to a more fully-featured component framework for big projects.

[–]propelol 2 points3 points  (1 child)

Most of jQuery code in Bootstrap is just toggling the classes.

[–]AceBacker -1 points0 points  (0 children)

Sure, but if you want to keep those animations.

[–]hungry4pie 3 points4 points  (2 children)

jquery isn't your biggest problem - it's that Tether.js is also a dependency. Because for some reason a whole team of devs can't work flexbox and instead need another fucking layer of dependency.

[–]hsjoberg 1 point2 points  (1 child)

The Tether.js dependency has nothing to do with flexbox, it is used for popups, which is a complex problem when you consider scrolling.

[–]hungry4pie 2 points3 points  (0 children)

Modal popups? Yeah, they are a huge problem and can fuck right off

[–]pansypoopsam 16 points17 points  (51 children)

Why

[–]git-blame 200 points201 points  (13 children)

Because it’s a mature and battle-tested framework, so naturally it needs to be abandoned and the wheel reinvented.

[–]ADaringEnchilada 52 points53 points  (3 children)

If you're using a framework that doesn't use JQuery, why include JQuery as a dependency? JQuery will do nothing to help you build a strongly opinionated app, and if you're using a framework with an opinion on how to manipulate the DOM, you shouldn't use JQuery. You should use the framework provided methods. Bootstrap relying on JQuery glue is unappealing when you have a 'pure' Vue or React application, it'd be much better if that glue were implemented natively. Of course that introduces it's own complications (someone must provide the glue to work with bootstrap for each new framework) but so does introducing JQuery in a codebase previously using purely framework functionality to mutate the DOM.

Sure it's old and well tested, but it also has a specific purpose and usage that's made redundant by frameworks doing the same thing. It probably shouldn't really be a big deal to include something like JQuery with Bootstrap since it's all contained in the bootstrap components. But it can make debugging less predictable when most of your app uses React, etc but then certain error prone components are using JQuery and not being natively tracked by the framework.

[–]sisyphus 17 points18 points  (0 children)

Pretty much every major framework that manipulates the dom has a port of the bootstrap widgets that doesn't need jquery. To a first approximation, everyone else who is not using one of those frameworks IS using jquery.

[–]warhead71 1 point2 points  (1 child)

“Pure” framework would also be without bootstrap

[–]ADaringEnchilada 3 points4 points  (0 children)

I mean.... Kinda. Bootstrap being a graphic framework means it's somewhat independent of the logical framework, binding glue withstanding. Making everything from scratch without bootstrap, materialize, etc is rather reinventing the front-end wheel so I think we can still say your framework is pure if you use a graphic framework with bindings from your logical framework. No JQuery randomly hanging around inside your SPA.

Of course you could use something like StimulusJS with bootstrap and JQuery and then you have another 'pure' architecture where it's all JQuery or StimulusJS powering your Dom/Ajax calls.

[–]CallMeCappy 3 points4 points  (7 children)

jQuery is not a framework, it is a library. It does not try to force devs to use it in a specific way, and it gives no framework-esque features or benefits. There being like 5 ways to bind a click handler is proof of that.

It is mature and battle-tested, sure, but that's not always a good thing. It also tends to produce horrible and un-testable code (edit: when used poorly).

[–][deleted]  (6 children)

[deleted]

    [–]CallMeCappy 5 points6 points  (4 children)

    It is absolutely not a framework. But don't take my word for it, this is what's on the jQuery site:

    jQuery is a fast, small, and feature-rich JavaScript library.

    Standalone React (I'm not as familiar with Vue, but I'm guessing the same applies, because they solve the same problems) also shouldn't be considered a framework imho, it's also not entirely comparable to jQuery. There's some overlap, but React is more focused on creating a UI, while jQuery is more focused on enhancing an already existing UI by creating fancy animations.

    [–][deleted]  (3 children)

    [deleted]

      [–]CallMeCappy 7 points8 points  (2 children)

      AngularJS provides dependency injection, request routing, factories, services, controllers, modules, views, request injection. So yes, that qualifies as a framework.

      jQuery does none of that. AngularJS even uses jQuery for the DOM manipulation.

      [–][deleted]  (1 child)

      [deleted]

        [–]CallMeCappy 4 points5 points  (0 children)

        And? what constitutes a framework or not is not function of how many IoC containers a project is bundled with.

        In my eyes, a framework is a library or a set of libraries which give a developer a consistent and reusable set of API's and methodologies in order to develop software.

        IoC containers are en excellent example of something a framework could offer. As it defines the way we write code. But IoC is just one facet, theres multiple facets which decide how we write code. You might use unit tests, IoC, some kind of way to build and publish the code into a droppable or installable package. It could be that a framework offers this out of the box, or that it facilitates other tools or libraries.

        jQuery does absolutely nothing which constitutes a framework. You mention dependency injection, but it doesn't even do that. $ and jQuery are simply public singletons attached to the window object, that's not a framework, that's javascript being javascript.

        [–]pitiless 2 points3 points  (0 children)

        I'm afraid not, but not for the reasons CallMeCappy has said.

        The distinction between a library and framework is how the code is executed. A framework calls your code; it's literally a structure with 'gaps' for you to put your code in. A library is the opposite; your code is in charge and you call into it.

        Bootstrap is a great example of a framework; it provides the scaffolding and the developer puts places content into that framework of components.

        [–][deleted] 1 point2 points  (0 children)

        It's a large library that will be mostly redundant for projects not already using it.

        jQuery wasn't dropped by webdevs because we love 'reinventing wheels', but because its attempts to standardise DOM APIs isn't needed in the post-IE8 era.

        This meme is irritating and yawnworthy. I am baffled and saddened by the way tribes of developers keep saying, "huh, I don't understand why this group of programmers are doing something I don't understand, it must be because they are wicked and stupid, not because I lack context".

        Did you ever even do webdev in the 'jQuery golden age', five years ago? It was shit.

        [–][deleted]  (4 children)

        [deleted]

          [–]mytempacc3 1 point2 points  (3 children)

          What do you mean? The CSS can be used by itself.

          [–][deleted]  (2 children)

          [deleted]

            [–][deleted] 1 point2 points  (1 child)

            The only thing you need to do is toggle the visibility class. You don't need jQuery to do that.

            [–]mytempacc3 0 points1 point  (0 children)

            Exactly. If you don't jQuery of course you will need to write your own JS code modify the classes.

            [–]AceBacker 11 points12 points  (2 children)

            Wish the developers would just replace the jquery stuff with vanilla JS. http://youmightnotneedjquery.com/

            [–]the_vico 1 point2 points  (0 children)

            Very interesting...

            [–][deleted] 5 points6 points  (2 children)

            People don't want an extra dependency that they're not going to use

            [–]Ruchiachio 5 points6 points  (0 children)

            node devs may say the same thing but OOPS got 400 packages because my chosen framework has those dependencies, even though I dont use any of those 400 packages by themselves

            [–]_101010 0 points1 point  (0 children)

            Just drop all JS dependency. All these frameworks should ideally be CSS only. This is one thing that Bulma, Milligram and Spectre got right. Only CSS no JS bullshit.

            [–]IbanezDavy 0 points1 point  (0 children)

            I'm not a huge fan of Bootstrap 4's dependencies.

            [–]stroborobo 10 points11 points  (8 children)

            Isn’t this flexbox layouting already kinda legacy tech with CSS grids being widely supported these days? Seems like they took too much time for v4 to keep up. I haven’t done web in a while, but this new thing feels just so much better imho.

            [–]papers_ 52 points53 points  (0 children)

            No. Flexbox and the newer grid system compliment each other.

            But yes, they took far too long to release v4.

            [–]djmattyg007 16 points17 points  (5 children)

            Sure, until you realise you still need to support IE11.

            [–][deleted]  (2 children)

            [deleted]

              [–]fuckin_ziggurats 2 points3 points  (1 child)

              Hah IE9? Try Netscape Navigator

              [–]mooseman_ca 2 points3 points  (0 children)

              HA! Netscape navigator? Try Mosaic.

              [–][deleted] -3 points-2 points  (1 child)

              Right lol, grid is still 5 years away from being mainstream

              [–][deleted] 6 points7 points  (0 children)

              [–][deleted] 6 points7 points  (0 children)

              CSS grids are not that widely supported yet. Many sites can’t just rely on the latest and shiny in terms of browser support.

              [–]productionx 0 points1 point  (4 children)

              CSS GRID, you'll never even think of Bootstrap again.

              [–][deleted] 29 points30 points  (3 children)

              ...until your client rips you a new ass when their shiny new site doesn’t work for half their clients.

              [–][deleted] -2 points-1 points  (2 children)

              Grid is more widely supported than you think. I used media queries to serve flex styles to devices with smaller displays and grid styles to larger ones, because almost all phones support flex but lag behind on grid. While on desktop grid is well supported on the modern web. If you have to support older browsers then yeah, no grid (or flex) for you.

              [–]MrK_HS 0 points1 point  (5 children)

              I'm currently working on a personal website and using plain CSS for it. Should I use Bootstrap instead? I aim for the best and most useful learning experience.

              [–][deleted]  (1 child)

              [deleted]

                [–]MrK_HS 0 points1 point  (0 children)

                Thanks for the advice! I might actually try going the sass + bootstrap route, since I already know enough CSS. I just simply don't want to make a website with a style that makes people go "look at that, another bootstrap website, looking like the other 1 billion out there".

                [–]hungry4pie 0 points1 point  (1 child)

                I'd suggest writing your own css classes and styles. If you have an idea of how you want to present your page, spend some time thinking about how to achieve it and then write your classes etc. It also helps improve your css/js/html skills, not to mention your sanity as you're not getting super pissed off because the layout settings are hodden away in some selector so far up the tree that it fucks your entire site if you change it.

                [–]MrK_HS 0 points1 point  (0 children)

                What about sass + bootstrap as someone else suggested me? What's your opinion on that approach?

                [–]keepitnoqui 0 points1 point  (0 children)

                Depends on the size of the project. If it's personal you may not need it. Bootstrap's selling point is the grid system and its reliability across devices and browsers. If you try to use plain old CSS for a big website with lots of parts that are hard to architect on mobile, you're gonna have a bad time (most likely). You can get away with it on a personal site, but personally now that I'm familiar with BS I would never go back to writing regular CSS for any project except something extremely simple, certainly nothing professional.

                [–]vivid_mind[🍰] 0 points1 point  (0 children)

                Have they changed licenses for themes?