Boilerplate, Bootstrap... pueden sacarme de la duda

Pax-Man · #1 (**permalink**) 15/11/2012, 23:24

Desde hace unos dias estoy por comenzar un nuevo proyecto para un cliente, y estoy descidido a hacerlo lo mas compatible posible entre navegadores y responsive desing, claramente conoci estos 2 proyectos, Boilerplate y bootstrap, pero aun estoy algo enrredado en algo? boilerplate incluye en su codigo a bootstrap o bootstrap incluye a boilerplate o son cosas completamente separadas? o como es el cuento y diferencia entre estos 2 proyectos? por favor... necesito alguna orientacion...

pzin · #2 (**permalink**) 16/11/2012, 01:43

Son cosas diferentes, pero que se complementan.

Boilerplate es básicamente para crear una plantilla general, se basa mucho en normalize.css y es un compendio de buenas prácticas HTML. Bootstrap por otro lado es una especie de framework CSS.

Si nunca has usado ninguno de los dos y no estás familiarizado con el uso de frameworks y cosas similares, yo casi que recomendaría usar uno de ellos para no hacerte mucho lío. Los frameworks empiezan a ser útiles cuando se conocen, no al detalle, pero sí las cosas más básicas de ellos.

undakel · #3 (**permalink**) 16/11/2012, 09:40

Lo que ocurre es que ahora boilerplate genera tb una plantilla para empezar basado en bootstrap. Esto quiere decir que bootstrap se beneficia de boilerplate y al revés. Mi recomendación es generar una plantilla desde boilerplate usando el complemento bootstrap.

O como dice Bonez, si lo ves muy lioso utiliza sólo bootstrap porque es muy completo y por si sólo ya te brinda muchas herramientas para empezar.

Pax-Man · #4 (**permalink**) 16/11/2012, 21:26

Segun esto que dicen, yo podria hacer lo siguiente...

Integrar el css de bootstrap a boilerplate? (incluyendo el js)

quedando mi template basico algo como esto?

Código HTML:

Ver original<!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <title></title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width">
 
        <!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
 
        <link rel="stylesheet" href="css/normalize.css">
        <link rel="stylesheet" href="css/main.css">
        <link rel="stylesheet" href="css/bootstrap.css"> <!-- BOOTSTRAP -->
        <script src="js/bootstrap.js"></script> <!-- BOOTSTRAP -->
        <script src="js/vendor/modernizr-2.6.2.min.js"></script>
 
    </head>
    <body>
        <!--[if lt IE 7]>
            <p class="chromeframe">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> or <a href="http://www.google.com/chromeframe/?redirect=true">activate Google Chrome Frame</a> to improve your experience.</p>
        <![endif]-->
 
        <!-- Add your site or application content here -->
        <p>Hello world! This is HTML5 Boilerplate.</p>
 
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
        <script>window.jQuery || document.write('<script src="js/vendor/jquery-1.8.2.min.js"><\/script>')</script>
        <script src="js/plugins.js"></script>
        <script src="js/main.js"></script>
 
        <!-- Google Analytics: change UA-XXXXX-X to be your site's ID. -->
        <script>
            var _gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']];
            (function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
            g.src=('https:'==location.protocol?'//ssl':'//www')+'.google-analytics.com/ga.js';
            s.parentNode.insertBefore(g,s)}(document,'script'));
        </script>
    </body>
</html>

Este es el codigo del index que trae el paquete boilerplate... esto estaria bien hacerlo????

undakel · #5 (**permalink**) 17/11/2012, 04:48

Es correcto