1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

Is bootstrap still the standard?

Discussion in 'HTML & Website Design' started by Anveto, Dec 29, 2017.

  1. #1
    I want to create a new site, it will be simple but I want it to look good. I am not much of a designer so it would be good if a lot of the work is done for me (bootstrap is pretty easy).
    SEMrush
    I feel that themes are too heavy generally and the site im working on is a hobby project where I don't want to spend anything on a designer.

    What do people like to use now when starting a site? Is there something better than bootstrap? Some boilerplate maybe?
     
    Anveto, Dec 29, 2017 IP
    SEMrush
  2. deathshadow

    deathshadow Acclaimed Member

    Messages:
    8,483
    Likes Received:
    1,512
    Best Answers:
    223
    Trophy Points:
    515
    #2
    If by "standard" you mean the go-to for inept halfwit morons, quacks, and fools unqualified to be coding a single line of HTML or CSS, yeah, it's still the giant steaming pile of manure so massive it is basically a monument to ineptitude.

    ... particularly since compared to vanilla HTML and CSS, it is not easier, simpler, nor does it make you more productive no matter how many asshats know know jack about shit will try to sell you lies to the contrary!

    But let me tell you what I REALLY think about it. There's a reason I call it bootcrap; go find a stick to scrape it off with before you got tracking it all over your website's carpets!

    Progressive enhancement; start with your content as plaintext in a flat text editor organizing it in a manner that makes sense. Mark up that content SEMANTICALLY saying what things ARE, NOT what you want them to look like. THEN and ONLY then add semantically neutrual containers like DIV and SPAN as hooks ONLY WHEN NEEDED to apply your style and layout to it!

    Content dictates markup, content + markup + device capabilities dictates layout. NOT THE OTHER WAY AROUND!

    If you're screwing around with what it looks like as your first step, you've already screwed the pooch.
     
    deathshadow, Dec 29, 2017 IP
  3. SoftLink

    SoftLink Greenhorn

    Messages:
    30
    Likes Received:
    4
    Best Answers:
    0
    Trophy Points:
    13
    #3
    I'm not sure anybody really considered it 'standard'. If you were talking about my standards, I'd say it's substandard by a pretty big margin. It's for people who don't know Web development.
     
    SoftLink, Dec 29, 2017 IP
  4. Anveto

    Anveto Well-Known Member

    Messages:
    674
    Likes Received:
    36
    Best Answers:
    17
    Trophy Points:
    145
    #4
    Alright alright, standard is the wrong word :) What I meant to ask is what is considered normal or popular. I want something lighter than bootstrap since it feels so bloated, but something that will give me some nice looking elements that I can use, maybe fonts, a color theme, some simple formatting guides. It helps someone like me who focuses more on the backend code, golang and php.
     
    Anveto, Dec 29, 2017 IP
  5. deathshadow

    deathshadow Acclaimed Member

    Messages:
    8,483
    Likes Received:
    1,512
    Best Answers:
    223
    Trophy Points:
    515
    #5
    If you're doing back-end in PHP you should know enough HTML to do this without the crutches and training wheels. Otherwise you aren't qualified to be using HTML to do much of anything.

    It might be 'popular' with the mouith-breathers, that doesn't make it any good. Remember, leisure suits and disco music were once popular; and the only good thing you an say about the former is that the whole reason there was so much f***ing in the late '70's was so people could get out of the hideous clothes.

    Since as I'm often saying, if you don't know what's wrong with this:

       <nav class="navbar navbar-toggleable-md navbar-inverse fixed-top bg-inverse">
          <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarsExampleDefault" aria-controls="navbarsExampleDefault" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
          </button>
          <a class="navbar-brand" href="#">Site title</a>
    
          <div class="collapse navbar-collapse" id="navbarsExampleDefault">
            <ul class="navbar-nav mr-auto">
              <li class="nav-item active">
                <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
    Code (markup):
    You likely have ZERO blasted business building a website; what with the endless pointless DIV for NOTHING, endless pointless classes for NOTHING, unconstained text doing H1's job, button + scripttardery doing a checkbox+label+css' job, aria role mental midgetry, content cloaked span doing emphasis' job...

    You want something lighter than bootcrap, don't use a framework use HTML and CSS directly. They are PISS simple compared to ANY of these dumbass ignorant dipshit 'frameworks' and at least you won't be pissing on why HTML and CSS are separate in the first place by slopping presentational classes into the markup... since the MINUTE you do something like class="w3-red w3-border-wide" or class="xm-s-4" you might as well go back to writing HTML 3.2 as if CSS doesn't even exist!

    Hence why given what bootcrap does with that markup there is NO reason to be pissing out that MESS of markup to do the job of THIS:
    
    <div id="top">
    	<h1><a href="/">Site Title</a></h1>
    	<input type="checkbox" id="mainMenuShowHide">
    	<label for="mainMenuShowHide">
    	<ul id="mainMenu">
    		<li><em><a href="#">Home</a></li>
    
    Code (markup):
    THAT is simpler. THAT is lightweight. THAT is using HTML correctly leveraging semantics! THAT is why all the dipshits who think bootcrap is simple or easy or "makes them more productive" are talking out their collective arses and don't know enough about HTML or CSS to be flapping their bloody gums on the topic!!! For people who know nothing about websites, BY people who know nothing about websites is not a recipe for success! Just HOW stupid do people have to be to think that writing 670 bytes of markup to do 193 bytes JOB is "easier". Looks at the orange cheeto-fingered commander in half-tweet elected 'by the people'... OH, that stupid. Nevermind.

    Markup? you should know semantics and separation of presentation from content, otherwise you shouldn't be doing a damned thing with PHP -- so do that.

    Layout? Simpler you keep it, less work there is. Two columns isn't rocket science, max-width should be a no-brainer, header and footer sections are simple. DONE. Just be sure to use EM so it's elastic instead of herpafreakingderping along with px.

    Style? backgrounds and box-shadow... is that so hard? When it comes to your colours pick a hue (it's often hard to go wrong with blues) and then run different foreground and background colours past a tool that checks it for WCAG compliant contrasts like the one at webAim.

    https://webaim.org/resources/contrastchecker/

    Formatting guides? Try to keep your paddings and margins a consistent half-multiple of EM. Set up a max width in a fluid layout where your content area doesn't exceed 52em. Use half a flow EM between headings and content.... and most of all design a layout that adapts to the content instead of trying to feebly shoe-horn content into an existing layout.

    Anything less isn't a design, it's ignorant inaccessible trash. See the broken halfwit RUBBISH that clogs up template whorehouses like ThemeForest and TemplateMonster; laundry lists of how NOT to build a website that prey upon the ignorance of the average person who wants a website but doesn't know any better.
     
    deathshadow, Dec 29, 2017 IP
  6. Anveto

    Anveto Well-Known Member

    Messages:
    674
    Likes Received:
    36
    Best Answers:
    17
    Trophy Points:
    145
    #6
    Thanks for the guide :) Trust me, I know how it all works, but my eye for design is bad (picking the right colors is probably the hardest) which is why something similar to bootstrap is nice.
     
    Anveto, Dec 30, 2017 IP
  7. phpmillion

    phpmillion Member

    Messages:
    93
    Likes Received:
    8
    Best Answers:
    3
    Trophy Points:
    25
    #7
    I'm not a web developer, but I code web-based applications. From simple online calculators to script licensing solutions and complex management systems for restaurants and other businesses, so I'll share my opinion.

    Yes, for every single project I use Bootstrap because it's really easy to work with and has many plugins/options to play with. This way, adding some new feature (like fancy sliders, dynamic bars, etc.) is very simple. I never found it to work slow, but that might be because after making some app (which I try to optimize as much as possible), I spend several extra days optimizing/minimizing all the code further. In other words, as long as your non-bootstrap code is OK, you are good to go.

    If you are looking to use some existing theme made with Bootstrap, make sure you "tweak" it properly. What I mean is that many "out of the box" themes include almost all the additional plugins/modules by default, so theme authors can demonstrate how universal their theme is (I don't see anything wrong about that). However, you won't need every single feature/plugin from the theme, so remove everything you don't need. I also always load additional modules dynamically. For example, if theme has 10 extra plugins loaded, and I need only 3, not only I completely remove 7 unneeded, but I load needed ones on specific pages only. In other words, if after removal theme has only plugins A, B, and C remaining, and I need plugin B on page-x.php only, I tweak the code accordingly to load plugin B on page-x.php only. Dynamic loading is easy to implement using PHP, and you get the best performance possible.

    Hope you got the idea.
     
    phpmillion, Dec 30, 2017 IP
  8. deathshadow

    deathshadow Acclaimed Member

    Messages:
    8,483
    Likes Received:
    1,512
    Best Answers:
    223
    Trophy Points:
    515
    #8
    Well that explains the link in your signature taking 40+ seconds to load, wasting 45k of minified markup on 3k of plaintext -- about 8k without minification's job, 175k of scripttardery spanning 9 files on a page that doesn't even warrant the presence of scripting, 196k of CSS in 3 files with no media targets on a SITE (the ENTIRE site) has no excuse to be wasting more than 24k in 1 file per media target, and is utter and complete semantic gibberish telling non-sighted visitors to go f*** themselves. (A situation where one should remember that search engines don't have eyeballs either!) -- Nothing like 1.2 megabytes spanning 37 files doing the job of around 250k in 5 files job!

    Meaning you're about as far off from "best performance" as possible. You'd almost think it was herpaderped together with bootcrap.

    Again, for people who know nothing about websites, BY people who know nothing about websites is not a recipe for success.
     
    deathshadow, Dec 30, 2017 IP
    SoftLink likes this.
  9. deathshadow

    deathshadow Acclaimed Member

    Messages:
    8,483
    Likes Received:
    1,512
    Best Answers:
    223
    Trophy Points:
    515
    #9
    ... and it solves that problem HOW exactly? You like what it does visually, just do that without it... that statement doesn't even make sense.
     
    deathshadow, Dec 30, 2017 IP
  10. limitlessjz

    limitlessjz Active Member Premium Member

    Messages:
    105
    Likes Received:
    8
    Best Answers:
    1
    Trophy Points:
    78
    #10
    I don't know why there are so many people hating on Bootstrap. It is a framework to simplify and lessen your code. Would some of you bickering about Bootstrap rather not use frameworks, libraries or IDE's and go back to building things from the ground up? I use Bootstrap for its grid, buttons, wells and more. If you're developing a web app this library will save you time.
     
    limitlessjz, Dec 30, 2017 IP
  11. qwikad.com

    qwikad.com Illustrious Member Affiliate Manager

    Messages:
    5,362
    Likes Received:
    1,001
    Best Answers:
    17
    Trophy Points:
    400
    #11
    qwikad.com, Dec 30, 2017 IP
  12. phpmillion

    phpmillion Member

    Messages:
    93
    Likes Received:
    8
    Best Answers:
    3
    Trophy Points:
    25
    #12
    Thanks for your input. I'd like to answer it, but it's very difficult to reply to a self-proclaimed "expert" who doesn't even bother reading, and for some reason is only able to pick out some lines out of context and interpret them the way he wants. I doubt you will ever read this (but I sincerely hope someone else will do it for you), so here's the very first sentence from my original post again - I'm not a web developer, but I code web-based applications

    I know it might be hard for a person like you to understand what website and web-based application are, but in short, web-based application is NOT a website, which means I never coded a website you mention.

    To summarize, your strategy (bashing others, so only mature people understand that you have zero knowledge in the area you claim to "expertise" with) is out of the date and doesn't work (as it used to) these days. I'm not only talking about web-coding (sorry for this term, I realize you have problems understanding differences between websites and apps, but one day you will)... If you take a closer look at the history of all the "experts" in the world (let it be economics or politics, or whatever) who used the same strategy as yours years ago, you will see most of them either are forgotten now, ever had to quit "just bash others, so less people realize you know nothing" strategy because of a very simple reason - it doesn't work today.

    For now, I wish you all the best fighting against receptive aphasia in 2018, and I hope it will finally be a success for you. Happy new year!
     
    phpmillion, Dec 31, 2017 IP
    Anveto likes this.
  13. deathshadow

    deathshadow Acclaimed Member

    Messages:
    8,483
    Likes Received:
    1,512
    Best Answers:
    223
    Trophy Points:
    515
    #13
    Why the hate? IT DOESN'T DO THOSE THINGS!!! -- it makes people write two to ten times the HTML they need, using as much if not more CSS than they'd have WITHOUT the stupid malfing framework if they knew the first damned thing about HTML or CSS! AT BEST all it does is shuffle code from the CSS into the markup, code that doesn't BELONG in the markup since it's media target specific presentation.

    <broken record>
    Which is how you end up with mind-numbing idiocy like this:
    
    	<nav class="navbar navbar-toggleable-md navbar-inverse fixed-top bg-inverse">
    		<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarsExampleDefault" aria-controls="navbarsExampleDefault" aria-expanded="false" aria-label="Toggle navigation">
    			<span class="navbar-toggler-icon"></span>
    		</button>
    		<a class="navbar-brand" href="#">Site Title</a>
    
    		<div class="collapse navbar-collapse" id="navbarsExampleDefault">
    			<ul class="navbar-nav mr-auto">
    				<li class="nav-item active">
    					<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
    
    Code (markup):
    927 bytes of 100% grade A farm fresh derpitude, with the endless POINTLESS classes for nothing, lack of proper semantics, abuse of content cloaking, and a menu technique that requires JavaScript to do CSS' job -- all for what any sane and rational developer would have written as:

    
    <div id="top">
    	<h1><a href="/">Site Title</a></h1>
    	<input type="checkbox" id="mainMenuShowHide">
    	<label for="mainMenuShowHide"></label>
    	<ul id="mainMenu">
    		<li><em><a href="#">Home</a></em></li>
    
    Code (markup):
    206 bytes, Less than 1/4th the code... would use CSS not JavaScript for the menu/search show/hide. You don't need the stupid malfing NAV tag if you bother using numbered headings properly and create logical document structure with your semantics. You don't need the endless pointless classes if every tag inside a parent container is getting the SAME class.
    </broken>

    It is THAT stupid. Hence how even the bloated "jumbotron" template wastes 504k in ten files to do the job of 10k or less in TWO files.

    Tell me again how using four times the markup with presentational classes to the point you might as well go back to writing HTML 3.2 and pretend CSS doesn't even EXIST is magically "easier"... or "simpler"... or "makes you more productive"

    The ONLY way anyone could see a benefit to using frameworks like bootstrap is not knowing enough HTML or CSS to have an informed opinion on the subject. By using bootstrap and its kine, you're making MORE work, making pages MORE complex, making them HARDER to maintain thanks to the endless pointless presentational use of classes creating specificity hell, and for all intents and purposes embracing a late 1990's mindset that is the very thing HTML 4 strict was trying to kill off!

    To be brutally frank (when am I anything but?) if you don't know what's wrong with this:
    class="navbar navbar-toggleable-md navbar-inverse fixed-top bg-inverse"

    You have ZERO damned business creating ANYTHING that uses HTML. Ever heard of "separation of presentation from content"? Well guess what, that ain't it!
     
    deathshadow, Dec 31, 2017 IP
  14. deathshadow

    deathshadow Acclaimed Member

    Messages:
    8,483
    Likes Received:
    1,512
    Best Answers:
    223
    Trophy Points:
    515
    #14
    Either way you're using HTML and CSS -- in which case thanks to bootcrap you are writing two to ten times the HTML needed, failing to maintain separation of presentation from content, likely are lacking in proper semantics flipping the bird at users with accessibility needs, and on the whole making yourself do MORE work, not less.

    The ONLY way you could think bootstrap is saving you any time, or making it easier, or any of the other DELUSIONS and LIES people parrot about bootcrap is that you simply don't know enough about HTML or CSS to realize how badly you're screwing yourself -- and any clients -- with it!

    Or WORSE, missing 'essential' bits of semantics out of ignorance. Let's use your login for the demo as an example, you have 3.75k of minified markup for a simple login form.... and even on a visual inspection before I even get to the code you've told users to go **** themselves by forgetting that Placeholder is not a label!

    Wasting time on that X-UA rubbish that no page properly written should EVER need, endless pointless separate stylesheets without even bothering to have media targets, viewport meta telling users who want to zoom to go **** themselves, scripttardery doing CSS' job, incomplete/broken form, ZERO headings, captions or labels meaning ZERO document structure, and so many separate scripts slopped in one has to question if you know how to use JavaScript either... par for the course with the equally ignorant dumbass jQuery present.

    Hence why I'd be shocked if written properly said page needs significantly more than 1k of markup WITHOUT minification.

    But again, tell me how writing three to four times the HTML was "easier" for you -- much less how ignoring EVERY basic rule of HTML semantics and structure is "better"!
     
    deathshadow, Dec 31, 2017 IP
  15. deathshadow

    deathshadow Acclaimed Member

    Messages:
    8,483
    Likes Received:
    1,512
    Best Answers:
    223
    Trophy Points:
    515
    #15
    Machete don't tweet.

    No, seriously, I always equated twitter and twitter use with mouth-breathing halfwits. Special thanks to the orange cheeto-fingered commander in half-tweet for proving the point.
     
    deathshadow, Dec 31, 2017 IP
  16. Gihan

    Gihan Member

    Messages:
    36
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    38
    #16
    TIPs: download the bootstrap css & js
    do not edit the bootstrap css
    use a different style sheet for editing css and link it in the header after the bootstrap link.

    it will make you minimal of hassles updating bootstrap to a new version.

    even i use this for my web scripts in scriptfolder.com. it seems to be easy.
     
    Gihan, Jan 6, 2018 IP