作者:
wukoto (吳飛)
2014-05-21 23:35:02會想討論這個是因為最近在網頁工作遇到了很多問題,我從國中就對網頁有興趣,高中開
始自學網頁(學得很破),到大學開始轉往平面設計,等到出社會才又回頭做網頁設計,
如今也過了四年,我本身可以說是有點龜毛的個性,你也可以說我有強迫症,總之,我對
網頁設計的要求有點詭異,就拿上家公司來說,有一次我為了 h1 {font-weight: bold;}
跟主管吵了半天,就因為我覺得這樣寫根本多此一舉。
我本身是平面設計出身,所以我對網頁的技術僅限於 HTML 與 CSS,還有一些基礎 JS 的
套用,但我不知道為什麼,天生就很討厭東西排得不夠整齊。
就像這樣:
<div>
<ul>
<li>這個世界多麼美好,空氣多麼清新</li>
</ul>
</div>
但接著可能我放假去了,同事接手:
<div>
<ul>
<li>這個世界多麼美好,空氣多麼清新</li>
</ul>
</div>
這種時候我總是可以聽到腦袋理智斷裂的聲音,或是體會到什麼是自己的老婆被隔壁老王
睡走的感覺,總之我實在是相當討厭別人的 HTML 排的歪七扭八,就連我打這個例子的當
下,也是感到很痛苦。
最近公司在搞一個手機板的網頁,我比較少做大規模網站的經驗,所以我不知道各位是怎
麼規劃,但是我們公司的規劃就是大家一起做(這算規劃嗎?)這樣,簡單來說就是我做
登入註冊,同事甲做會員規範,同事乙做會員專區,然後各自切各自的版,我實在不太認
同這種做法,因為在沒有妥善規劃下就要這樣各司其職,我可以預見未來這網站必然沒有
一致性,這個站目前已經出現一些問題,在當初我把檔案規劃好以後,就被修改的我認不
出來了。
一、不知道為什麼硬要把一些 Layout 屬性放進 reset.css?
這個站的 reset.css 有著 h1 ~ h6 的樣式,這種東西在我個人認知,不是應該拿出
來放在其他跟版面有關的檔案裡面嗎?
二、很豪邁的寫了 p {color: #FFF;}。
呃,如果是我,我不會直接下這種設定,誰知道明天會不會有一頁白底的頁面,或者
我會在前面多加一個 Class。
三、最令我崩潰的排版問題。
你可以看到 CSS 有 2-space、4-space、Tab 的各種縮排,還有縮成一行,跟沒縮
成一行的,呃,總而言之就是不統一的寫法,就像這樣:
header {background: #000;color: #FFF;}
footer {background-color:#000; color:#FFF;
}
你冒號後面到底要不要空格?你分號後面到底要不要空格?
你到底要一行還兩行?你到底要用 background 還是 background-color?
你搞的我好亂啊!!!(強迫症發作)
抱歉,寫的有點崩潰了,明日還要上班,我先寫到這裡,不知道各位前輩有沒有類似的經
驗的(抑或你也跟我一樣是強迫症患者),如果你能提供一些你過去的經驗與解決方案,
或者一些閒聊也好,我會很感激你的,謝謝。
作者: lyforever (LY) 2014-05-22 00:01:00
html強迫症 大概要改用jade, css可以改用sass或stylus
作者: lyforever (LY) 2014-05-22 00:02:00
不用preproccessor 只有靠規範和檢查工具
作者: lyforever (LY) 2014-05-22 00:03:00
但是整個team沒有共識的話 怎麼座都有點困難XD
作者: ss163500 (ss163500) 2014-05-22 00:07:00
找一間客人肯花錢、沒有網頁菜鳥跟不懂技術的主管的公司
作者:
GoalBased (Artificail Intelligence)
2014-05-22 01:02:00我只知道我的vs可以自動排板= =
作者: Fantasywind (Fantasywind) 2014-05-22 02:32:00
我比較好奇這行 h1 {font-weight: bold;}怎麼了 中文?
作者: powerkaifu 2014-05-22 03:20:00
應該是h1本身已經有粗體,加粗好像多此一舉...
但這東西 .title{font-weight: bold;} 會比較好你怎麼知道所有h1都應該加粗體?
作者:
danny8376 (釣到一隻猴子@_@)
2014-05-22 04:46:00h1預設粗體沒啥問題啊 有class的都能蓋掉
作者:
danny8376 (釣到一隻猴子@_@)
2014-05-22 04:48:00至於第一點... 如果那是全站預設的h1~6放reset到也沒啥不可 沒人規定叫reset.css就要全清空
作者:
danny8376 (釣到一隻猴子@_@)
2014-05-22 04:50:00至於第三點的background/background-color我到覺得沒啥
作者:
danny8376 (釣到一隻猴子@_@)
2014-05-22 04:51:00畢竟bg-color本來就是bg的一個子項...
作者: Fantasywind (Fantasywind) 2014-05-22 05:31:00
哈晃神了 我以為你的問題在後面 bold
作者:
alog (A肉哥)
2014-05-22 06:43:00如果你可以做主再來要求.
作者:
alog (A肉哥)
2014-05-22 06:46:00或做code review 的時候再來提出
作者:
pm2001 (做個盾牌眼球兵吧)
2014-05-22 10:46:00排版交給IDE就對了
作者:
wukoto (吳飛)
2014-05-22 11:14:00我個人習慣把 reset.css 只用來設定瀏覽器一致性,公用排版樣式寫在別的檔,真要寫我會寫 inherit,讓他們隨著區塊設定去變動。
作者:
wukoto (吳飛)
2014-05-22 11:17:00至於我現在不出來要求的原因,就是因為我不是當家作主的…
作者:
danny8376 (釣到一隻猴子@_@)
2014-05-22 11:22:00我只知道production全包成一個css最理想XD然後既然你不是做主... 除了盡所能說服外 只能接收XD
裝個Sublime-HTMLPrettify解決你所有煩腦
作者:
Luos (Soul)
2014-05-22 11:50:00推樓上 超好用
作者:
a83294 (馬岱)
2014-05-22 20:35:00html prettify我按下去怎麼一點感覺都沒XD好像沒支援erb?
作者: liaosankai (低溫烘焙) 2014-05-22 23:10:00
我覺得 Netbean8 滿不錯的
作者:
wukoto (吳飛)
2014-05-23 00:01:00公司制度問題...綁死在 Dreamweaver。
作者:
alog (A肉哥)
2014-05-23 02:02:00Dreamweaver 就用樣板的時候開起來..@.@其他都在 Sublime Text 完成
作者:
yanli2 ( Yan™)
2014-05-26 13:37:00寫網頁的規範及應遵守的事項: 老闆爽
作者:
aceone 2014-05-26 14:07:00haml+sass 省時又好寫
作者:
lairrol (小黑)
2014-05-31 10:05:00你自己用JS寫Parser.....