Why Bootstrap might be very important
scripting.com
scripting.com
As a programmer, this is awesome because I can spend the rest of my time on the interesting programming stuff. Really, it appeals to:
1.) My complete lack of understanding of the intricacies of CSS and web page design.
2.) My mindset as an industrious but lazy programmer.
3.) It can be made to be generally portable.
I can see that down the line I might want to replace it with something else or hire a real designer to make me real buttons and web page styles, but it an excellent tool for the rough drafts of different ideas that I have. I can put things 'here' and 'there' on a web page quite easily, and that is really what I want/need.
It is much like a writer throwing down his ideas stream of consciousness style onto a piece of paper. He knows that he will have to edit eventually to make it consumable, but for now, he just needs to get the ideas down on paper while he has them.
I just started a Bootstrap app and customising it is surprisingly easy. If I were worried about my app looking like a bulk standard Bootstrap app it probably hard to modify the Bootstrap CSS enough to give it a unique style.
I use the framework as a concise, distilled version of good CSS practices and I find it hard to believe that somebody launches a project that looks like a kitchen sink example.
Furthermore, all the designers I've ever worked with like to throw a PSD over the wall and say, "Make that." Every little detail reimagined and drawn from scratch. They don't know how to build and work from a set of reusable CSS components like Bootstrap. So as a developer, I'm inclined to say forget your PSDs, learn CSS, we're on the web and it's part of the job.
In general, for example, I might want a certain set of buttons to look different from another set of buttons because this provides useful information to the user of the system.
I haven't worked with bootstrap yet, however it looks very promising. The key to a good framework is how much it makes what you want to do easy when the tasks align, and how it stays out of your way when the tasks do not.
I actually look forward to playing with Bootstrap to see what it's capable of doing. It looks like the alignment handling might be worth it by itself. However, the article here made me somewhat less enthusiastic. One of our goals is to produce something easily themable. If bootstrap helps, great. If it gets in the way, that would be a bad thing.
Deciding how CSS should be organized, some reasonable assumptions about type and layout and UI primitives – these aren’t your business. They should be commoditized to your benefit, much like cheap CPU cycles.
I say it's useful for two things: quick and dirty way of getting a prototype barely functioning and looking decent. The second is getting me right into the design cockpit without worrying about all the defaults and resets and foundation of it all. I change a few heights/widths/colors/fonts and we have something decently unique.
Edit: I might add that if a.) my app took off or b.) I was presenting it to someone important, I would make sure it was very unique and all my design and UX principles were put into play. But for simply prototyping an idea, or having a good base for a project, it's a great tool.
There's nothing wrong with bootstrapping to map out user flow, and give clear indication a button is a button, a list is a list etc. But when it's time to up your game, give access to the public, default bootstrap visual/color needs to go.
Humans judge a book by its cover. If you release your bootstrap website, users will have to work and over come the barrier of your bland looking site and then decide if it's worth it to try your product. PS: The point about lawyers have crappy websites and yet we still use them is because our expectations changes depending on the organization. Do we expect government websites to be wow and dazzle us? Do we expect a new Apple product's website to use bootstrap? Do we expect a 2 month old startup website to be featured on Behance's frontpage?
And remember who your early adopters are – if it's people that scours HN or see countless bootstrapped sites, what are they going to think when they see your site? Would they be understanding and go 'Oh its okay - they're a startup, I'll give them some leeway when it comes to visual design' or 'Would they go eff this, these guys don't care about design or visuals. I'll come back later'.
> Can you imagine your designers simply copying and pasting
> from iOS's default theme? It's very bland, it turns off
> users before they even use it
i recognize UX is really important in ios, especially since a lot of ios apps target the $1 casual user market. There are a lot of other markets and types of business, for example enterprise webapps, where a product which solves their business need matters, and using a stock theme does not matter, we don't even have a designer on staff.Bootstrap provides a bunch of reusable elements. You can still make the non-reusable elements (the layout chrome, logo etc.) as pretty/ugly as you want, and you can use those reusable elements to create very bland or very inspired websites.
Frankly, I don't see what all the fuss is about.
There's a big difference between what a user can articulate about their experience and what they are affected by.
I too don't really understand that backwards patterns were creating with the web, i.e. when a few years ago modal dialogs got much more popular (i.e. jquery-ui, etc). I remember not too long ago in the mid 90s when every magazine was awash with complaints about apps that had too many modal dialogs, saying they were bad for user experience, which was generally true.
I guess the difference is with hardware buttons the app has little ability to effectively change the behaviour, whereas with software conventions they can pick and choose what they follow.
But startups come from various fields and solve various problems, provide different services and products. Should we shift our expectations that all startup sites will use templates now?
The visual treatment for bootstrap sites, however, completely lacks any branding. The problem isn't that users can't figure out how to use your site (a UX problem) but that users don't associate the look and feel of your website with your product.
More importantly I would say that a non-trivial amount of users do not enjoy and even detest change. For an anecdote look to any change facebook makes.
One benefit of bootstrap is that casual users can leverage their understanding of how other bootstrap sites behave thus reducing the amount of new things they have to learn and get used to.
and it doesn't look anything like bootstrap.
We loved the grid, the form elements and buttons and its sized. The first thing we re-did was the nav bar though. Apart from that we think the framework really accelerated the design process.
I've been using it on new projects, but always found customizations a little awkward. Are you changing the actual bootstrap files (typography.less or whatever) or simply overriding them in your own style file?
I'm used to 960GS so I was at home when it came to bootstrap. I spent some time reading the examples provided, then started on a clean slate. Top nav, the mast then footer, then finally the main content. That way you are not technically tweaking their templates. You are branching out.
You can try:
- Bootswatch, free color schemes: http://bootswatch.com/
- Lavish, a way to apply colors extracted from images: http://lavishbootstrap.com/
- WrapBootstrap, a marketplace for premium Bootstrap themes: http://wrapbootstrap.com/ [shameless plug]
Check out Built With Bootstrap for great examples of sites that are thinking outside the default styles: http://builtwithbootstrap.com/
However, seeing all websites using the same layout it's pretty boring and dull. I think the web is what it is because of it's diversity. I'm a very visual guy, I love te see beautiful well design things and new approaches.
If bootstrap or any other framework is the end of road as far as UI interface, it's pretty sad IMO.
This is a self-correcting problem though. Once there's enough backlash, people will start tweaking things to set things apart. Bootstrap is a good starting point, that's all.
I still appreciate aesthetic beauty, but the web just isn't the place for it. In my mind at least.
Edit: I would change the layout also, but sadly to do that is non trivial.
Sure, having a killer design is first prize, all other things being equal. However, in a lean startup resources aren't infinite - you have to decide where to put your time and money.
Marketing has a concept called "point-of-parity/point-of-difference" [1] that I think might be useful here. Bootstrap without any customisations gives you parity - your design doesn't suck anymore. Once you've achieved parity and your customer feedback indicates that design is hurting you, iterate the design.
Building a todo list for designers? Pay lots for design.
Building a technical app for builders? I suspect once you have relative parity they'll buy based on how well you target their needs.
[1] http://en.wikipedia.org/wiki/Points-of-parity/points-of-diff...
Having a custom design for every site means a user having to learn a new UI every time. It's mentally exhausting.
And as an added bonus the programmer doesn't have to rewrite code that been written a million times before by other programmers.
The disquiet some people feel is that frameworks like bootstrap make it very tempting to drop this design phase in favour of snapping widgets together and assuming the end result must be a good UI because users are "used" to the individual widgets. This would definitely not be step forward in software construction - web or otherwise.
OS widgets provide a user familiar with those elements hints and clues about how to use a program. A menu is a menu is a menu no matter the application. Bootstrap provides a very similar framework.
The problem is that we don't interact with public facing websites in the same way we interact with websites in the same way as desktop applications. The level of complexity tends to be very different and design is far more important for a website.
I can understand using Bootstrap for an admin interface; it provides that same recognizable framework for a user. For a public facing website, however, I think using Bootstrap is almost abhorrent. Whenever I see that very distinct black navigation bar across the top I have an urge to leave a website.
I understand that you can of course modify Bootstrap but to be honest I think the design choices are simply wrong for most sites. Bootstrap is great for web applications but for a blog... seriously?
Anyway, enough ranting. I actually really like Bootstrap and I'm using it currently but I know I would not use it for my own personal blog or public facing site.
Design _is_ more important for a website but that doesn't mean that design _should_ be more important for a website.
Bootstrap fills that very interesting and apparent need in the web community. It feels like a coping mechanism for devs who can't find good design/frontend resources, so I don't have a personal need for it, but I hesitate to dismiss it entirely as I personally know many developers that wouldn't have anywhere to turn without a tool like Bootstrap.
That said, the author's attempt to push it forth as some sort of a framework for all web language is a bit much. The best UI and UX will always be at the service of what the specific website requires, not skinned out of a modular system.
But this knowledge/resource gap is a growing problem, and I don't see enough of the design community becoming aware of it and stepping up their game to make things like Bootstrap less necessary.
Indeed - but I'd venture that the standard behavior for most web elements is already well-established. Pretty much everyone knows how to use a dropdown or a modal. Bootstrap makes it easy to implement these, and that's really handy. You could do the same with jQuery plugins or CSS snippets, though it would take more time.
The bigger aspect of Bootstrap (IMO), and the one that really grabs people's attention, is its distinctive and consistent styling. That's what shouldn't be kept consistent across websites. (It's not like different styling will confuse users.)
Tangentially, overriding Bootstrap's styling can be a bit messy, especially if you aren't using Less/SASS; but it's necessary if you intend to design a site with its own look. That's what I'm dealing with now.
Throw a "custom.less" at the bottom of your styles.less, and you can make bootstrap completely indistinguishable from the vanilla style.
right now I am building a very large browser app on bootstrap, and you'd never know by looking. All I do is add styles to the "custom.less" and change what needs changing.
Programmers need to realize that customizing the look and feel of bootstrap is VERY VERY easy. It's perfectly safe to use for production.
All bootstrap did was make a vanilla, simple template so you don't have to redo all the boring html work over and over. There is nothing that constrains you to a layout or visual style.
I would be happy to create a demo "web3.0 startup" landing page on bootstrap doing nothing but adding 1 less file and some graphics. And then I could write what I did on my blog or something, or just make a post here.
With that being said, website designs have defiantly shown trends over the years (as have operating system "themes"). So I think we'll see something else come along to replace the bootstrap eventually according to the "standards" of the next greatest design phase.
Note Bootstrap does make a solid case for using standard components such as LESS, CSS and jQuery.
There are lots of sites that look worse than the nice, clean bootstrap look. I like it when I'm using a bootstrap site. If the visual design of a site is an important feature of your site, then by all means go your own way. But if not, use the standard, and make it easy on your users.
Edit: Also, Dave is far from an Apple fanboy. He has a far more complicated relationship with Apple. But I'm thinking that was just a little personal dig, not based on much of anything.
The Web is very frequently about marketing materials, akin to pamphlets, rather than about simple functional tools. Additionally where you do have those functional tools, they aren't going to fit in with the desktop in the same way that native thick clients will.
Is there a "getting started with bootstrap" tutorial that anyone here recommends?
The Bootstrap page talks about all the features and how easy everything is, but I don't know where I should put the files, if I need jQuery already, etc.
jQuery isn't used at all.
https://github.com/esbullington/flask-bootstrap
It's barebones right now but I'll be making improvements and would welcome pull requests (there's a todo list).
Like programming, UI is about problem-solving. You can only commoditize design to a certain extent. You still need a design phase. Period.
The interface is the product. It's not something you tack on at the end.
AKA: Allowing Programmers to take their website designs from nuclear-waste-bad to looks-decent-but-so-much-like-that-other-bootstraped-site-good
Yes, bootstrap is a good thing. But it should be used only as a base for further improvements.
Take a look at Mac programs, for example. For the most part, they all have menus, windows, and title bars that look the same. But the important parts of many apps are unique. This makes things easier for both developers and users.
Imagine, as a developer, having to code the entire UI from scratch every time. That's how it used to be. It's not so nice for users when every app looks similar but it subtly different. It means every app has a steeper learning curve.
I think there is room for both uniformity and creativity to co-exist.
An OS UI is mostly buttons and other widgets, window frames, and behavior. The actual applications are very different.
Just to give you an example:
Look Reeder app, Chrome, Things, iPhoto all for OSX. They are wrapped with the a common UI, but they are much different from each other.
Sure they use lots of the same OS widgets, window frame,etc.. but they have their own design and way behaviors inside.
With frameworks like twitter you can't get that, unless you hack the source. But that defeats the whole point of it in the first place.
Not for long.
> An OS UI is mostly buttons and other widgets, window frames, and behavior. The actual applications are very different.
So is Bootstrap.
> So is Bootstrap.
While that's true, it's a bit disingenuous given the difference between web development and native client development.
Not using Bootstrap doesn't mean that you need to write your own functionality from scratch; for elements like buttons all Bootstrap gives you is some nice CSS styles and a little bit of syntactic sugar over using the web browser's built-in implementation. There's a bit more of an argument for the JS plugins (tooltips, modals, etc), but even then the alternative is grabbing one of the countless other JS plugins that do the exact same thing, not necessarily rolling your own.
And there is a myriad of bootstrap-based websites now that look exactly the same.
This is what change looks like. Every generation of programmers wants to hold it back. It's not fair that you've invested all this in learning how the current layer works, well now it's not current anymore. You have to adapt, or you end up obsolete.
Younger developers always say this to the old developers. It's a bit disturbing when you hear it for the first time, about you. :-)