跳到主要內容

2014 blogger改版筆記─決戰css

為了迎接新一輪的旅程,把blogger狠狠地改了一下。這次的修改重點是,完全把blog的「氣息」去掉,變成一個純文字的ebook式的版型。亦即,除了圖和文字之外,我不希望各位受到各種各樣的訊息干擾。
兩欄式變成一欄式最大的挑戰,莫過於網友再也不能從側邊欄發掘其他資訊,為此我做了一浮動的導覽列。導覽列是參照Blogger 調校資料庫的HTML造出來,並把Ooparts最多人看的文章類型︰閱讀旅遊,分開連結。同時把搜尋網頁的自訂搜尋器放到導覽上來。
而為了補充沒有側邊欄,網友無法找到關於我的訊息和訂閱Ooparts(有人會這樣做嗎=口=?),特意用很笨的方法,做了一個首頁。可是「最新文章」無法顯示,測試時明明OK的……得再思考該怎麼做。暫時也只有這樣。
Ooparts拉到底,會有Ooparts新的G+ page FB page的連結。我並不是覺得自己紅到有需要開page讓大家成為我的「粉絲」,我只是想試一試不同的宣傳方式,看那一種行銷方法最有效。搞不好之後會覺得很煩關掉也說不定。這樣也好啦,一些漫罵和極膠言論,留在私人FB,不會給其他人看見……唔……不過Ooparts也很膠就是了。
另一個大改動是CSS。Blogger本身的文字顯示方式很醜,到最近學排版才發覺。內文編輯時好好的,出到外面的頁面就覺得痛苦了。特別是現在把文章拉長的情況下,文字和圖片很難配合。
試過雖多方法,例如
text-indent : %em,首行縮排
這個方法最大的問題是,在.post-body 內安裝,blogger會假設所有樣式都會縮排,包括圖片。文字「抵抗」的辦法是輸入0em,圖片就不知道了,隨文插圖原本有2em的距離,再加2em就非常難看。不過這個版型的圖片和圖片文字也很難看,仍未摸出方法修改。因為.post-body img 和其他元件,共用了一個樣式,我不敢動到它……因為實際上我也不是很懂……
標題樣式修改成我喜歡的樣子︰

標題h2

子標題h3

小標題h4

修改時千萬別在CSS 直接打
.h2{} .h3{}
一出去你就會發現,所有widget的名稱,全部變成你設定那個樣子,因為widget標題的程式碼長這樣︰.h2 div class。當然這不是重要目的,我只需要改內文,所以最好進入編輯HTML裡面,新增樣式
.post-body h2 {} .post-body h3{}
這就以後打文章,選擇標題,樣子就會改變,層次變化就更能幫助閱讀。
重點的內文我研究了好久仍未找到最佳解法辦法,最初我想像的樣式是縮排、鬆字距、寬行寬。就像這樣︰
.post-body{font-size:15px;line-height:1.5em;letter-spacing:0.15em;text-indent:2.3em;}
可是因為前述問題,text-indent取消了。那只好用笨法子,直接空兩個全型空格,然而分段效果仍不明顯。想了好久,覺得段距隔個2em就最好了。可是,無論用margin或padding都無法達到效果。想一想應是enter和shift enter的關係。
隨便按enter的話,段落html碼是<br \>,表示一行結束。而blogger的分行方式,還有<div> <snap>等等。所以不大好控制,除非每段文章用html調整。那也太累了吧?會死耶。固…目前調整成這個樣子,真有需要時就按兩下enter。而最好的顯示方式是,第一行頂格,第二段空一至兩格或一行。強烈效果加分隔線。不過,這些類似的設定,wordpress早就內建了……故此我整理過的文章,目前都放在worpdress,不怕字的請過去︰housescheung.wordpress.com
CSS可以參考這個網站︰梅問題教學網。

至於貼圖,目前尚未有很多圖的範例文章。故我只能說,將會使用+Joe Tsang 大大的方法來貼圖。從前都不太在意這個,隨便插入貼上了事,希望將來能夠造一篇賞心悅目的文章出來。

最後最後,改成目前這個樣子,是我相信無論怎麼改,大家都會透過Feedly等工具訂閱,或者加入G+、FB追蹤。我也會勤一點發文。那些工具都會「無視原本網站的格式」,編排一個獨有的舒服方式,供使用者瀏覽。所以我怎麼改CSS其實影響不大,甚至是毫無意義。
那……我改來幹甚麼呢?
純粹自己爽一下吧……

留言

這個網誌中的熱門文章

墨爾本旅遊交通全攻略

來墨爾本三個星期,總算搞清楚交通狀況。一如出發前的諾言,除了沒人看的遊記,旅遊攻略也會多打一些,以衝流量。


主要網站
Public Transprot Victoria: http://ptv.vic.gov.auMetro:http://www.metrotrains.com.au全路線圖:http://ptv.vic.gov.au/getting-around/maps/目錄
一、墨爾本交通概覽
二、公共交通遊玩攻略
  -全免錢! 巿中心遊玩大法
  -省錢旅遊方式
三、簡易行程規劃
  -擅用客戶服務中心
  -惱中的下班時間
另注:Skybus+酒店接駁服務

矛盾大作戰──Nikon VS Canon

我猜,問「哪一家的相機比較好」這個問題,一定比問「照片怎麼拍才好看」的人多上好幾倍。至少在還沒有選擇「敗」那一家照相機之前,大家都會猶豫、考慮、拼命上網找資料,然後懷疑網上資料不盡不實,覺得自己的「感覺」最準確,又苦無「使用」機會。去店家捧着照相機玩一兩個小時又覺得太誇張怕被罵……
想起來我頗幸運,雖然沒有單反,但我已經玩過很多器械,包括︰D90、D7000、D3100、500D、550D、5DMK2、5DMK3、Sony A99、Nex 3,而且是每一抬最少拍了三百張的程度。甚至iphone、Canon和Nikon各類型的DC……因此,我覺得自己雖然不是專業的攝影師,應該也有資格談一談器械的選擇順便衝一下流量吧。

70D 半年使用心得(內含D7100比較)

呃咳。前一陣子為衝流量而發佈的Nikon Vs Canon成功成為Ooparts點擊次數最多的文章(純粹為衝流量的爛文)。為再衝一次流量,今次來一篇真正的使用心得(不含評分)。我呀,與開箱文比較,更擅長寫時長時間使用心得⋯⋯

今次要寫的使用心得是Canon 70D。去年發佈的,Canon最新APS-C單反。呃咳,我可以暪着朋友,花了一年儲蓄換來這台機器(如果沒有它,我能夠至少再呆在澳洲多一個月吧)。




Canon官方網站:70DNikon 官方網站:D7100小惡魔詳細規格比較 詳細規格和性能比較請參閱上面的連結。我無法作出如此專業的評測,純粹以一個使用者的心得來分析哪一個機器比較適合自己。

(註:因使用時間不多,下文的D7100比較,有一半是使用D90的延伸。)

浮誇

國粵語流行曲因為同樣使用中文,因而經常出現旋律不變、更改歌詞,譜成新歌。這種「文化交流」受歌手演釋、填詞、編曲等因素影響,變數太多因而成功率只有一半。當中例子不勝枚舉,唯有忽略。最近上網查看,發現eason的浮誇居然被改成國語版,心想︰「哪個傢伙不要命了?居然改這麼困難的歌?」抱著「看你怎樣死」的心態觀看十幾遍,仔細閱讀youtube留言,發現評語大致傾向三方面︰
1) eason廣東版較好 2) 林志炫國語版不錯 3) 兩者不用比較 第三個理由基本上是屁話,沒有比較何來好音樂?批評者大概認為,如果承認林老版〈浮誇〉比不上陳醫生〈浮誇〉,林老的江湖地位勢必不保,為維護偶像尊嚴,或偶像的神光護蔭,死命認為林老版比較好聽。說不過其他人,就退而求其次︰音樂是藝術,藝術不用比較。如果不用比較,為甚麼還要辦歌唱比賽呢?比較永遠存在,可是比較之時需要認清楚︰同一首歌唱得比較差,不代表歌手本身素質不及對方。同樣,唱同一首歌比較動聽,感染力比較強,不代表歌手比其他人都厲害。比較不是否定,而在於找出歌手特質和風格,從而改進。

二手書交易平台

最近網友感嘆香港二手書很難找,感嘆之中又難免和台灣的二手書交易作比較。埋怨香港二手書交易不容易,仰慕台灣的讀書風氣云云。又問有我能不能在露天幫他們寄賣。唔,回答這個問題之前,我想先討論幾個和二手書有關的問題︰二手書在賣甚麼?平台對二手書交易的影響。

◎二手書在賣甚麼?
據我觀察,二手書大部份賣「漫畫」、「文史哲」和「二輪暢銷書」。
漫畫大概不用多談,一整套放在家裡太佔位置,是搬家或清空書櫃的頭號目標。況且連載時間很長,某些讀者專門等到連載完畢,才去買二手漫畫,一口氣讀完。
嚴肅的「文史哲」著作太「高雅」,本來就沒甚麼人買,一手巿場交投淡薄(用上金融的詞彙了= =)。很多文史哲書,出版只為了給圖書館、專家收藏,銷售並非主要目的,更休談再版。所以二手書就成為文史哲類重要(甚至超過一手)的交易巿場。當然,一些專業書也有類似傾向,只是科技發展迅速,很容易過時,二手書巿場顯得沒哪麼重要而已。
最後一類是曾經的暢銷書,我稱為二輪暢銷書。相對剛剛「上巿」的一手流行讀物,比如電影話題小說、電視劇改編小說,總之潮流一過,就不是書店主打的暢銷書,就可列入此類。流行書的定義就是「很好看,看完蓋上之後永遠不必再翻開。」放在書櫃上佔位置,不如賣出去實際。有些讀者不買一手流行小說,因為很快在二手書店出現,價格便宜一半以上。我最記得《哈利波特七》出版那天,我剛從台東回來,晚上央求學長載我去書城買,第二天中午就在學校門口的二手書店看見了!4折!超誇張!

◎二手書店的虛與實
二手書店和一手書店有點不一樣,實體地位比較牢固,不像一手書店被網站打得那麼慘。原因之一是,二手書比一手書更注重書況。加上二手書店的江湖地位和一手書店不一樣,一手書店就是商人嘛,賺錢的;二手書店是文化俠士,賠錢搞文化事業的。一手書店實體和網路的對立很明顯,除了大型出版社直營書店,如三民、商務、三聯,其他小書店很少透過網路形式賣書。最多設一個網站,供客人查詢、討論,要買,還是得去店裡。因為實體店賣書的價格比網路高,如果另開網站店,讀者可能會要求降價,利潤流低,舖面人流減少,本末倒置。這種情況香港和台灣都一樣。可是二手書店不一樣,在台灣很常見實體和網路並行的模式。原因和比價能力有關,一手書可以貨比三家,但二手書可能只此一本,同質性低,網路價格和實體價格沒差異,二手書價格低,讀者也比較不介意負擔郵資運費。