もうBootstrap3使っても良いんじゃねぇ?
■ このスレッドは過去ログ倉庫に格納されています
0001nobodyさん
2013/08/21(水) NY:AN:NY.ANID:Qa7rnBrg0010nobodyさん
2013/08/30(金) NY:AN:NY.ANID:???じゃ、3つのクラスの組み合わせが発生する場合、3C1+3C2+3C3=3+3+3=9つのクラスを定義するわけだね。
3つのクラスの組み合わせが発生する場合(以下略)
0011nobodyさん
2013/08/30(金) NY:AN:NY.ANID:???(正) 4つのクラスの組み合わせが発生する場合(以下略)
0012nobodyさん
2013/08/30(金) NY:AN:NY.ANID:???0013nobodyさん
2013/08/30(金) NY:AN:NY.ANID:???例えば、テーブル関連で言うと
table
table-bordered
table-striped
table-condensed
というクラスが定義されてるわけだけど、具体的にはどうすればいいわけ?
0015nobodyさん
2013/08/30(金) NY:AN:NY.ANID:???SCSSは知らんけど、それができるなら
.your_own_class : extend bootstrap_class_a, bootstrap_class_b
みたいに定義してけばいいだけじゃないの?
0016nobodyさん
2013/08/30(金) NY:AN:NY.ANID:???0017nobodyさん
2013/08/30(金) NY:AN:NY.ANID:???そのtable-なんたらってのは、Bootstrapが用意したクラスか・・・?
本当にダサくて時代に逆行してるな。
HTMLの話をすればこれだけでいいだろ?
<table class="hoge">
<tr><td>a1</td><td>a2</td></tr>
<tr><td>b1</td><td>b2</td></tr>
<tr><td>c1</td><td>c2</td></tr>
</table>
でCSSは普通こう書くだろ?
.hoge { tableのスタイル }
.hoge tr { trのスタイル }
.hoge td { tdのスタイル }
いやさ、普通にCSSの使い方だよ?
このように書いていればマークアップとCSSが分離されていて、
HTMLを書き換えることなく、CSS=デザインを担当するものだけで
デザインを書き換えられる。
なにも新しいことは言ってないよ。CSSが出来た時から言われているCSSの正しい使い方。
原則としてデザインを変えるときはCSSだけを弄って変えるもの。
fontタグがなくなったのもHTMLからデザインの部分はなくしましょうという流れの一つ。
borderつけたかったら、CSSを修正すればいい。
偶数行奇数行で色を変えたければ、CSSを修正すればいい。
余白を少なくしたければ、CSSを修正すればいい。
これだけなんだけど、具体的に何を聞きたいの?
CSSの書き方? それともSCSSの書き方?
デザインを変えるだけならCSSしか修正しないのが原則なんで、HTMLはこのまま修正しないよ。
0018nobodyさん
2013/08/30(金) NY:AN:NY.ANID:???補足。「原則として」と書いているのは、
CSSの限界によってdivやspanを入れなければ
出来ないことがたまにあるから。
HTML5とCSS3によって大きく改善されたけどね。
実際に今開発しているスマホ用サイトではほとんどdivやspanを使わずに
無駄な要素を入れることなくCSSだけで表現出来てる。
0019nobodyさん
2013/08/30(金) NY:AN:NY.ANID:???> じゃ、3つのクラスの組み合わせが発生する場合、3C1+3C2+3C3=3+3+3=9つのクラスを定義するわけだね。
細かい計算は面倒なので結論だけを書くと、
定義するクラスは、HTMLで使用するクラスの数だけでよい。
HTMLで使用せずに、他のクラスのベースとしてだけ使うクラスは
クラスではなくSCSSのプレースホルダとして定義すればいい。
だから定義するクラスの数はHTMLで使用するクラスの数だけになる。
0020nobodyさん
2013/08/31(土) NY:AN:NY.ANID:???Sleek, intuitive, and powerful front-end framework
for faster and easier web development.
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
0021nobodyさん
2013/08/31(土) NY:AN:NY.ANID:???0022nobodyさん
2013/08/31(土) NY:AN:NY.ANID:???http://blog.idyllic-software.com/blog/bid/235535/Why-we-don-t-use-Twitter-Bootstrap
TWITTER BOOTSTRAP - IT'S NOT ALL ROSES
http://theled.co.uk/blog/archive/2012/06/22/twitter-bootstrap---its-not-all-roses/
Please stop using Twitter Bootstrap
http://css.dzone.com/articles/please-stop-using-twitter
Why Twitter Bootstrap is bad for the internet
http://blog.guy.ht/2012/02/Why-Twitter-Bootstrap-is-bad-for-the-internet/
0023nobodyさん
2013/08/31(土) NY:AN:NY.ANID:???0024nobodyさん
2013/08/31(土) NY:AN:NY.ANID:???メンテナンス性が悪くなるのが嫌だな。
HTMLがごちゃごちゃするし、
デザイン変更時に全HTMLを書き換えなきゃいけないし。
0025nobodyさん
2013/08/31(土) NY:AN:NY.ANID:???1. 自分でデザインを作れない。(デザインなんかどうでもいい。おきせのデザインでいい)
2. CSSを簡単な物以外自分で書けない。
3. JavaScript書けない
4. とりあえず動けばいい
って人なんじゃないかって思う。
デザインを自分で好きに作りたい人は
Bootstarapをカスタマイズせずに使うなんてありえないし
カスタマイズしようと思えば、Bootstarapに合わせた書き方を
しなければいけなないという面倒くささのせいで使いたくなくなると思う。
0027nobodyさん
2013/08/31(土) NY:AN:NY.ANID:???フレームワークには流行り廃りはあるけれど
根本的な考え方が大きく変わることはないんだ。
マークアップとデザインの分離。それがCSSの本質。
BootstrapはそのCSSの本質に当てはまっていない。
だからバッドプラクティス。それだけの話。
0028nobodyさん
2013/08/31(土) NY:AN:NY.ANID:???0029nobodyさん
2013/09/01(日) 11:34:54.87ID:???4以外全部はずれ。ただ、時間をかけずにそれなりのものをちゃっちゃと作りたいだけです。
と、いう理由でBootstrapをこれから使おうかと思ってるんですが、
夢物語だと知って放りなげるかもしれません。
個人的には>>28と、あと、お手軽なテーマでもあればそれで十分だったりします。
0030nobodyさん
2013/09/01(日) 11:44:59.64ID:???将来修正はしません
ファイルの数は10個ぐらいですってなら
まだわかるけどな。
0031nobodyさん
2013/09/01(日) 11:51:06.60ID:???だれが使っても同じデザインにならないようなものを
プロダクトで採用できるかってーの。
捨てるためのフレームワークだよ。
それをわかってない奴は馬鹿だけどな。
0032nobodyさん
2013/09/01(日) 13:06:25.58ID:???でBootstrapより使い物にならんオレオレフレームワークの誕生って訳だ
0033nobodyさん
2013/09/01(日) 19:11:48.74ID:???SASS(SCSS)というCSSを改良した文法があればいい。
あとはCSSの正しい使い方通りに使うだけ。
0034nobodyさん
2013/09/02(月) 10:29:54.87ID:???「こういう感じでいいなら早く一定レベル以上のデザインを提供できますよ、
こだわりたいなら、当然お金と時間がかかりますよ」
ってやるのが商売ってもんで、
それをやらずに何でも客のいいなりに毎回フルスクラッチなんてばからしくてやってられません。
やってる会社だらけなので、商売やりにくいですけどね…
0035nobodyさん
2013/09/02(月) 12:48:43.17ID:???0037nobodyさん
2013/09/02(月) 17:48:44.34ID:???趣味で使ってたりする奴だろ。
このスレでBootstrapは面倒とか、メンテ性が良くない、とかツマラナイ事言ってないで
建設的な意見をしろよ。俺も。
0038nobodyさん
2013/09/02(月) 17:54:12.27ID:???0039nobodyさん
2013/09/02(月) 18:18:06.47ID:???どっちかというと、サイトテンプレートの方が酷いのが多いけどね。
0040nobodyさん
2013/09/02(月) 21:05:12.81ID:???Bootstrapのような変なフレームワークはいらん。
正しくCSSを使っているフレームワークならいいよ。
0041nobodyさん
2013/09/02(月) 21:06:56.50ID:???> Bootstrapをdisってる人って、サイトテンプレートなんかも認めないんだろうな。
なんで???
勝手に決め付けるなよ。
頭おかしいんじゃないのか?
正しくCSSを使っているなら問題ない。
Bootstrapは間違ったCSSだからクソなんだよ。
何が正しくて何が間違っているかの定義は
CSSはデザインを分離するものであるという
CSSが出来た理由に合っているかどうかだ。
0042nobodyさん
2013/09/02(月) 21:08:24.58ID:???> このスレでBootstrapは面倒とか、メンテ性が良くない、とかツマラナイ事言ってないで
> 建設的な意見をしろよ。俺も。
SCSSってでてるじゃん。
class属性に値を詰め込む方法ではなくて
class属性に入れるクラス名は原則一つ。
これでやれって。
0043nobodyさん
2013/09/02(月) 22:00:51.17ID:???W3Cのhtml4あたりの勧告やDTDを読んでらっしゃい。
そこはhtml5になってもかわらないよ、恐らく。
0045nobodyさん
2013/09/02(月) 23:01:58.92ID:???開発速度を最重要視したフレームワークだぜこれ
そのために十数年前から口やかましく言われてる禁じ手をあえて採用してるんだろ
全員がメンテナンス性やデザインを重視するなら他のを選んでるっての
0046nobodyさん
2013/09/03(火) 00:23:37.37ID:???Bootstrapが開発速度を重視しているからって、
他のやり方よりも開発速度が速いことにはならないんだが。
つまりSCSSでも開発速度は速い。
開発速度には普通メンテナンス速度も含まれるわけだが
この点でBootstrapは遅い。
そして君が言う通り禁じてというかダメなやり方を採用しており
メンテナンス性やデザイン性を重視するときに使えない。
0048nobodyさん
2013/09/03(火) 10:57:11.53ID:???はいはいSCSS一番でございます
フレームワークの要旨を説明してるのに
なんで下層レイヤーの言語と比較するようなアホな論争に持ってこうとしてるんだか
フレームワーク同士の比較なら建設的なんだがな
0050nobodyさん
2013/09/03(火) 11:00:26.04ID:???かけらもない一プログラマには有用だよ。俺みたいな。
0052nobodyさん
2013/09/03(火) 15:54:11.27ID:???リポジトリみれば分かることだがまだ修正もしないといけないのたくさんあるのに
今使うのは人柱のようなものだ
自分のサイトで使う分にはいいが、人様のサイトを作るなら使うのはまだ早い
0053nobodyさん
2013/09/03(火) 16:06:57.26ID:???0054nobodyさん
2013/09/03(火) 16:13:36.84ID:???0055nobodyさん
2013/09/03(火) 21:54:15.63ID:???俺俺CSSライブラリって何?
CSSってさ、デザインだよ?
つまりオリジナルのデザインは
すべて俺俺CSSライブラリってこと?
意味がよくわからないなぁ。
0056nobodyさん
2013/09/03(火) 21:55:16.18ID:???そもそも考え方としておかしいんだよね。
ただのデザイン集なのに。
0057nobodyさん
2013/09/03(火) 21:57:26.06ID:raBduHGTPC用ではただのリスト、スマフォではドロップダウンて感じの
デザインにしたい場合、cssカスタマイズしてxs-xxxみたいなクラスを
自前で書いて、classに両方の場合のクラスを読み込ませるようにしないといけないんですか?
(極力共通のHTMLでPCスマフォ対応したい)
0058nobodyさん
2013/09/03(火) 22:06:54.50ID:???Bootstrapをディスりに来たとしか思えないw
まあ、普通に考えれば、
<ul class="some-list">
<li> 1
<li> 2
<li> 3
</ul>
ってかいて、
1. スタイルシートを2つ用意する
2. bodyにクラスを指定する
のどちらかでやるだろうな。
1の方法は pc.css と smartphone.css 作って
それぞれ読み込むファイルを分ける。
2の方法はCSSは一つでbodyタグにクラスを設定することで
body.pc .some-list {}
body.smartphone .some-list {}
という風に定義できるようになる。
どうやって読み込むファイルを分けるかは、HTMLを動的に生成する方法。
そしてもう一つ。発想を変えてPC版、スマホ版という区別ではなく
画面の大きさなどで区別する方法。つまり CSS3 Media Queriesを使う。
0059nobodyさん
2013/09/03(火) 22:08:39.79ID:???Bootstrapが標準でPC用ではリスト
スマホではドロップダウンにしてくれる
デザインを用意してくれているのなら
それを使えばいいだけだが。
CSSフレームワークに期待するな。
フレームワークというよりも
ただのデザイン集だ。
用意されていなければ自分で作るしかない。
0060nobodyさん
2013/09/03(火) 22:13:20.64ID:???PC用ではリスト、スマホではドロップダウンっていのは
CSSの想定される使い方としてできるんだよ。
HTMLには、デザインであるリストやドロップダウンという
内容を書かない。
CSSに書くことで、同じHTMLでデザインを変えることが出来る。
だけどBootstrapはデザインをHTMLに固定化させてしまうから難しくなる。
BootstrapはCSSの間違った使い方をしてるからこうなるのも仕方ない。
フレームワークがダメなのではなく、間違ったCSSの使い方を
しているのがBootstrapのだめなところだよ。
CSSを正しく使っているフレームワークならもちろんOKさ
0061nobodyさん
2013/09/03(火) 23:51:54.77ID:???どうやって読み込むファイルを分けるかは、HTMLを動的に生成する方法を使うか、
JavaScriptで適切なCSSを読み込むか、bodyのclass属性を変更する。
006257
2013/09/04(水) 00:23:29.40ID:???ありがとうございます
Bootstrapの機能ではなく、CSSの基本的な機能とかJavaScriptによる
動的な方法しかないということですね
なんとなくですが、data-target="xs:hogehogeClass, lg:hagehageClass"みたいな記述をすれば
ウィンドウのサイズがXX〜XXならXXXというクラスを読み込める
みたいなのを期待してしまっていたので・・・
0063nobodyさん
2013/09/04(水) 00:55:29.76ID:???Bootstrapはフレームワークを名乗っちゃいるが
ただのデザイン集だからね。
CSSでできることしか出来ないし用意された
デザイン以外を簡単に作る方法も用意してない。
> ウィンドウのサイズがXX〜XXならXXXというクラスを読み込める
ウインドウサイズが〜というのがCSS3 Media Queriesだよ。
HTMLに書いているのは同じクラスだけど、そのクラスに
適用されるデザインをウインドウサイズなどで変えることが出来る。
でもこの機能はBootstrapとは相性が悪くてね。
Bootstrapが希望通りのデザインを用意していないのなら
Bootstrapで定義されているクラスを上書きするしか無いよ。
そしたらBootstrapで用意されたクラスを使っているのだから
○○なデザインになるはずなのになってないみたいに意味不明なことになるけどね。
ま、ちゃんとしたCSSの使い方をしろってことさ。
0064nobodyさん
2013/09/04(水) 01:16:29.46ID:???0065nobodyさん
2013/09/04(水) 01:27:13.70ID:???0066nobodyさん
2013/09/04(水) 01:46:18.39ID:???使ったこと無いがSCSSのグリッドシステムあるだろ
http://www.profoundgrid.com/
Semantic
The grid keeps your markup semantic and
works without any "grid_x" classes.
Unless you want to use them, in which case they are included.
grid_xとかいうクラスなしで動くってさ。
ま、これが普通だよね。
0067nobodyさん
2013/09/04(水) 09:54:02.95ID:???今からBootstrap3にあわせて作っても無駄
6ヶ月は寝かせておいたほうがいい
0068nobodyさん
2013/09/04(水) 10:42:12.98ID:???どんなものかとダウンロードしてサンプル見たんだが、こんなのがHTMLにごちゃごちゃ入ってたよ。
<article id="row1">
<div class="col6">6</div>
<div class="col6 push6">6</div>
<div class="col12">12</div>
<div class="center">
0069nobodyさん
2013/09/04(水) 10:46:00.14ID:???<div class="subgrid1">
<div class="subcol subcol6">
<div class="subgrid2">
<div class="subsubcol subcol1">1</div>
…
俺はマルチカラムレイアウトでがっつり複雑なレイアウトは作らないけど、どんなフレームワークにせよ、
こんなのと似た感じになるのはしょうがないんじゃないの?
0070nobodyさん
2013/09/04(水) 10:50:41.33ID:???黙ってspan6とかでやってれば勝手にレスポンシブってくれるからBootstrapで充分。
0071nobodyさん
2013/09/04(水) 12:20:46.01ID:???いやームズいっすわー
Bootstrap3じゃHTMLとCSSが癒着してるからムズいっすわー
難問っすわーねぇー
http://jsfiddle.net/eGWeV/
0073nobodyさん
2013/09/04(水) 13:07:39.42ID:???生意気なブートストラッパー共をSCSSでビシっと黙らせてやっちゃって下さいよー
0076nobodyさん
2013/09/04(水) 22:54:20.23ID:???<section class="thread">
<header>
正しいHTMLでデザインするとこうなる。無駄なclassは消え(必要に応じてつけてもいいが)、theadクラス以下に全てが集約される。
<b>360px</b> <b>600px</b> <b>over..</b>
</header>
<ul>
<li>
<a href="#59">>>59</a>
<p>Bootstrapでやる方法は知らん。</p>
</li>
<li>
<a href="#60">>>60</a>
<p>もともとCSSはマークアップとデザインを分離するものだから、PC用ではリスト、
スマホではドロップダウンっていのはCSSの想定される使い方としてできるんだよ。</p>
<p>HTMLには、デザインであるリストやドロップダウンという内容を書かない。</p>
<p>だけどBootstrapはデザインをHTMLに固定化させてしまうから難しくなる。
BootstrapはCSSの間違った使い方をしてるからこうなるのも仕方ない。 </p>
<p>フレームワークがダメなのではなく、間違ったCSSの使い方をしているのが
Bootstrapのだめなところだよ。CSSを正しく使っているフレームワークならもちろんOKさ </p>
</li>
<li>
<a href="#63">>>63</a>
<p>でもこの機能はBootstrapとは相性が悪くてね。
Bootstrapが希望通りのデザインを用意していないのならBootstrapで定義されているクラスを
上書きするしか無いよ。そしたらBootstrapで用意されたクラスを使っているのだから
○○なデザインになるはずなのになってないみたいに意味不明なことになるけどね。</p>
<p>ま、ちゃんとしたCSSの使い方をしろってことさ。</p>
</li>
</ul>
</section>
0077nobodyさん
2013/09/04(水) 22:55:10.88ID:???0078nobodyさん
2013/09/04(水) 23:00:25.53ID:???それがbootstrapか。
0079nobodyさん
2013/09/04(水) 23:55:29.33ID:???0080nobodyさん
2013/09/05(木) 00:23:34.18ID:???当たり前だけどSCSSはメディアクエリーにも対応。
0081nobodyさん
2013/09/05(木) 01:56:46.42ID:???デザイン変えても360px掲げるんですか?
論理構造と視覚表現の分離は忘れましたか?
「pseudo-elementsで実装しろバーカ」が正しい指摘だ
0082nobodyさん
2013/09/05(木) 02:08:21.56ID:???つまりどういうこと?
360pxって視覚表現じゃないぞ?
お前が何をしろと言ってるのかさっぱりわからん。
pseudo-elementsで何を実装したいんだ?ちゃんといってみろ。
0083nobodyさん
2013/09/05(木) 02:35:40.18ID:???説明をしなくちゃならんくなりそうだな。
まあ、レス来てからにするか。
0084nobodyさん
2013/09/05(木) 03:11:10.48ID:???360pxに視覚表現以外の意味はない
>>71のCSSがあって初めて意味を成すんだから
だからHTMLではなくCSSの疑似要素でデザインすべきだと言う指摘に繋げた訳
あなたには360pxが何か意味のある内容だと思えたのかな?
いやそう思ったんだからマークアップしたんだよね
意味がないものをマークアップするなんてセマンティックを理解してない証拠になっちゃうんだから
で初めに戻るけど360pxをどうしてb要素でマークアップしたの?
.thread クラスに属する<b>360px</b>って何?
そこを説明して下さい
と言うか>>71を書いたの俺だから先に言うけど
メディアクエリのデバッグ目的で置いただけなんだけどね
0085nobodyさん
2013/09/05(木) 05:49:34.25ID:???0087nobodyさん
2013/09/05(木) 10:47:47.79ID:???0088nobodyさん
2013/09/05(木) 12:43:22.86ID:???0089nobodyさん
2013/09/05(木) 13:13:57.54ID:???セマンティック至上主義の話は板違い。
009084
2013/09/05(木) 13:58:33.54ID:???無意味な事にヒートアップしてすんませんした
もう相手にしません
0091nobodyさん
2013/09/05(木) 16:24:45.26ID:???0092nobodyさん
2013/09/05(木) 17:30:20.22ID:???HTTP://coliss.com/articles/freebies/freebies-bootstrap-3-psd.html
Bootstrap3のテーマをWYSIWYGでカスタマイズ可能な「Bootstrap Magic」
HTTP://phpspot.org/blog/archives/2013/09/bootstrap3wysiw.html
本日分の燃料
0093nobodyさん
2013/09/05(木) 21:40:29.50ID:???http://d.hatena.ne.jp/kiwanami/20130905/1378353853
も一つ燃料投下
0094nobodyさん
2013/09/09(月) 03:00:31.79ID:nNe0D1vQ設定ウインドウを作ったのですが、
画面中で最大の文字で「設定」って
そんなこと言わなくても分かるだろ!って思えます
どうやってますか?
0095nobodyさん
2013/09/09(月) 04:12:44.27ID:???http://getbootstrap.com/customize/#variables-modals
@modal-title-padding で15pxも取ってあるのか
高dpiを意識してるんかな
0096nobodyさん
2013/09/09(月) 04:25:16.44ID:nNe0D1vQこういうのを見ると、逆に面倒になってないか?って思うな。
CSSってそんなもんじゃないだろ?
テキストエディタでちょこちょこって買い換えれば
済むもんだろ?
0097nobodyさん
2013/09/09(月) 09:36:37.27ID:???そこそこの完成品にするための制限としての規約なんだから
守っておけばいいし、足りなくなったり、気に入らなくなったら、
ムリしてbootstrap使う必要ないだろ
このスレは本質と全然違うところでしか議論が進んでない
0098nobodyさん
2013/09/09(月) 14:18:50.54ID:???大事なものまで消してそうで怖い。
0099nobodyさん
2013/09/09(月) 23:51:24.43ID:nNe0D1vQサンプルプログラムを作ってるわけじゃあるまいし
規約を守るのが仕事じゃないんだろ。
0100nobodyさん
2013/09/09(月) 23:53:50.77ID:???無理して使うこと無い は、本当にそのとおり。
自分のセマンティック精神に合わなきゃ使わなくていい。
ちょいとしたWebアプリがPCでもiPadでもそれっぽく作れるから、
自分は用途に応じて使うよ。
0101nobodyさん
2013/09/10(火) 00:44:07.79ID:k9V3QcR6ちゃんとした教育を受けた人には
気持ち悪いフレームワークなんだよな。
0102nobodyさん
2013/09/10(火) 01:10:20.13ID:???0103nobodyさん
2013/09/10(火) 03:28:26.76ID:???ttp://w3q.jp/t/4438
0104nobodyさん
2013/09/10(火) 21:03:15.06ID:???現実と折り合いをつけて使うのが大人
0105nobodyさん
2013/09/10(火) 22:07:56.46ID:k9V3QcR6諦めないと使えないのがBootstrap
0107nobodyさん
2013/09/11(水) 02:12:07.23ID:S3z0iKLL0108nobodyさん
2013/09/11(水) 13:15:40.30ID:???メンテ性が下がる理由がよくわからん…。
ソース量が妙に増えるのは欠点だが、Bootstrapにあわせた
マークアップルールを考えればそれでいいだけな気もするし、
所詮一つの道具に過ぎないこれがそれぞれの自分流にあわなきゃ
使わなければいいだけなはずなんだがな。
0109nobodyさん
2013/09/11(水) 13:39:32.80ID:???なんて言ってたやつはどこいった、?
■ このスレッドは過去ログ倉庫に格納されています