格友來信詢問:
我的部落格文章手機版看起來,排版都怪怪的。如上圖。
不知道如何改善?
這個一看就是按了enter「分行符號」的問題。
直接舉個例子說明:
電腦版的版面比較寬,假設一行可以有40個字
手機版的版面比較窄,假設一行可以有20個字。
例如,你一段中有120個字(中間沒有分行符號),這在電腦版中就是3行,手機版中就是6行,到這邊都OK,正常。
但如果你一段有120個字,然後你自己按Enter(分行),這樣在電腦版中看起來正常,但在手機版中就會出現格友問的這種問題,怎麼莫名奇妙自己換行了。
說穿了,這就是你自己在不該分段的地方按Enter造成的。
我問格友:你是不是先在word中寫,然後在COPY到部落格中來?你把你的word檔寄來我看看。
格友:是。
▲這是格友的Word,明明是同一段,但不知道為什麼卻有分段的標記。
所以當格友直接copy到部落格的編輯器時,會連同分段的標記一起copy過去,這在電腦版上看沒差,正常,跟在word看起來一樣,但在手機版因為版面窄的關係就會出現奇怪的「空白」。
這就是格友一開始問的問題,為什麼手機看文章,會出現奇怪的空白。
好,我特地寫這一篇文,我主要想說三點:
一、不需要在WORD中先打文章,直接在部落格編輯比較省事
因為你在WORD中打,無論你怎麼排版,到部落格中又亂掉,那還不如直接在部落格中打,還沒打完你就設定「隱藏」就好了。
另外在WORD中不要做任何的排版(字體顏色、大小這些都不要),排版統一由部落格的CSS設定控制,這樣你日後要改版型時,才會能自動調整。
舉例,你在WORD中把文字設定成黑色+12級字,你貼到部落格就是黑色+12級字,而且永遠12級字,你改天換版本你要變成其他的級字,可以,你要一篇一篇修改,這樣會很累。
二、實體文章跟網文的分段是不同的概念
舉例,實體文章是每一段的前面要空二格表示分段,但在網文中是直接「空一行」表示分段,這個在CSS中的設定就是<P>的意思,而另一個<BR>是換行。
問:分段<P>,跟換行<BR>差別在哪裡?
答:一般分段在CSS中會設定直接空一行,而<BR>就是單純的換行,沒有空一行。請參考: 文章排版注意事項
三、文章排版必需考量在手機版中的觀感
以前沒有這種問題,但現在用手機瀏覽的用戶比用桌機的還多,以我的部落格來說,我花了那麼多的心思在版面設計上面,我還特地把所有的廣告都關掉,但你看看,手機54%,桌機47%。
也就是說,我自己平常也要用手機看看部落格,這樣才能知道大部份的用戶在我看我的部落格時是什麼感覺,然後再調整文章的排版。
好,以上說明給您參考。
格友詢問:
以上的說明我看了,但是我還是看不太出來要怎麼後調整。
請問後台可以直接去除word格式嗎?謝謝!
歐飛回覆:
現在只能一個一個「純手工」去除,並沒有一個指令可以讓你把所有的文章一次搞定,這也就是為何我說,你應該直接在部落格後台的編輯器寫文章即可。
而且寫完後,不光是電腦版,你連手機版也要看一下,這樣就算你遇到這種問題,因為一開始你就遇到了,你就可以當場調整,這樣下次你在寫文章的時候就會避免這樣的問題。
就不會發生現在這種事情,因為你已經寫了N篇文章了,現在如果要改,等於是要一篇文章一篇文章的純手工調整,這樣會很累,但也沒辦法,就是「花時間」調整一下,把「分行符號」去掉。
2024年11月更新
用電腦看文章,版面比較寬,每一行的字數可以比較多,
用手機看文章,版面比較窄,每一行的字數就會比較少,
同一篇文章,因為每一行字數的不同,看起來就不會同,特別是行數的不同。
這就會產生一個問題,我大約是要打幾個字就換行(enter鍵),這樣才不會發生在手機版上看文章時,一段文字就好多行,反而不方便閱讀。
這個問題,我沒有答案,這個要看情況,看著辦。
這就是目前寫部落格會遇到的問題,大部份的人是用電腦寫部落格,但現在反而是用手機看部落格的人比較多。
再來,要寫部落格,建議直接在部落格寫,先存在「草稿」,都寫好了再「公開」即可。
而不要像本文網友這樣,先在word寫,這樣問題更大,因為你把文章貼到部落格後還要「重新排版」,這樣反而麻煩。
懶人包:部落格實戰全系列
_______________________________
留言列表