關於響應式網頁設計(RWD)

2019-04-18 17:12:48.21

分類: 字體產品與應用

RWD淺談

先前我們在介紹Web Font時曾經提過:「RWD網頁可以針對不同的載具選擇不同粗細的字型,讓小螢幕上顯示的字不會糊成一團」,除了道出了Web Font的優點,也點出了一個好的RWD網站,應該要將載具適合的字級大小考慮進去,而今天我們就繼續介紹,什麼是RWD(Responsive Web Design)式的網頁。

根據Google Developers對於RWD的介紹中解釋:「任何解析度的裝置,伺服器傳的都是同一份的HTML,透過CSS來判定裝置的解析度後,生成適合該裝置大小的畫面顯示。」,因此一個網站可以用電腦、平板、手機來瀏覽,且都會得到最適合的畫面與內容。

任何解析度的裝置,伺服器傳的都是同一份的HTML。

 

早在RWD概念盛行前,就已經有許多購物與行動網站注意到,根據電腦螢幕所顯示的內容架構,可能不適合在手機上,因此他們購買了第二個網域,建立專給手機的頁面,以COSTCO網站為例,如果你看到的網域包含了特殊的前贅字(http://m.costco.com),可能就是這樣的方式。但早先HTML與CSS並未發展到目前的階段,因此這樣形式的網頁多採WML(Wireless Makeup Language)語法所編寫,然而該語法是以XML為基礎,有點類似簡易版的HTML,因此在許多功能的撰寫上都會受限。

在智慧型手機流行後,各家瀏覽器廠商如Chrome, Firefox, Safari, Opera等,也都有針對手機版本所開發的瀏覽器,這時,開始有了以偵測瀏覽器是哪種版本來決定對應內容的方式,而這種方式由於各廠商與各版本間有太多不同的組合,因此在會需要針對許多的版本做設定,甚至要定義不同的手機解析度就是個大議題。

因此在HTML5和CSS3出現之後,許多可以自動偵測螢幕大小與根據大小調整內容比例的語法,就成為了RWD概念的核心技術:簡單的說就是取得裝置的螢幕大小,設定每個標籤的內容該出現的比例與位置。這樣的方式,讓網站工程師只需要針對一個網站開發,就可以讓拜訪者(Visitor)根據其裝置得到最佳的畫面呈現,除了畫面美觀外也更有效的吸收網站資訊,因此成為了近年來製作網頁的熱門詞彙。

HTML5和CSS3是RWD概念的核心技術。

 


字體產品與應用

如何合法取得文鼎字型

相信現在還是有很多人會在網路上搜尋免費字型下載使用,這些免費字型的提供者也許是抱著好東西要與好朋友分享的心態,把字型放在網站上供人下載。下載方式非常簡單,但是點擊下載的動作已經違法。

 

也許在許多人的認知上字型只是輔佐文件的素材,但是每套字都是字體設計師一筆一畫勾勒出來的心血結晶。以台灣所使用的繁體中文Big5字集為例,一套字的開發,若只投入一個人,可能耗費一年半的時間都沒有辦法完成。有人說一塊錢的製作成本遠遠超乎他的現價,這個理論套用在字型上似乎是相同的。近年來台灣的版權意識越來越高,尊重創作者的心血、使用者付費也是文鼎一直在宣導的。

 

該如何取得正版文鼎字型呢?。除中國地區外,皆可透過文鼎iFontCloud網站選購。在台灣,也可透過文鼎的代理商展碁及其經銷商購買。此外,我們在Momo, PChome, Yahoo, Friday以及博客來等電商平台也有銷售文鼎雲字庫的實體卡。而在中國則可透過邑石網選購,或直接聯絡文鼎上海分公司。除以上通路,文鼎並沒有在任何網站上提供免費字型下載,請務必小心!透過合法的管道取得字型資源,不但能給予字體設計師支持與鼓勵、轉化為繼續設計好字型的動力,字型公司也才能有資源提供更多字體。這樣的正向循環,需要您我共同努力。

字體產品與應用

罕用字

罕用字是指不常見到或不熟悉的漢字,又可稱為生僻字、冷僻字、罕見字等,最早出現在商代的甲骨文,前些日子有一首大家朗朗上口的歌-生僻字,用輕快的旋律唱出一些歌詞乍看之下根本不會念的字詞,沒錯,這些就是罕用字,罕用字通常是一些字典不會收入的字,經常出現在罕見人名、地名、古詩中的押韻。

但這些看似古代字的罕用字,在古代未必不常被使用,因為在古代這些我們現在幾乎用不到的字,以前可能是熱門精選也不一定,罕用字沒有一個標準,至古至今有不少人的姓名中包含罕用字,在古代,由於避諱的傳統,很多人都會使用僻字來避免麻煩他人,不少皇帝的名字包含罕用字就是為了避免擾民。

然而,在這個電腦普及的現今,很多的罕用字並未收入Unicode,而導致電腦無法正常輸入這些漢字,因而造成在辦理銀行業務或護照上的種種麻煩,以前如需要解決這個問題,最根本的方法就是使用常用漢字命名,以避免姓名中罕用字難以處理的情況而引起爭議。

由於罕用字實在不常用到,所以在發音或是查找上有些許困難,在文書處理上有個小小秘訣,以windows 10作業環境為例,可以使用拼音輸入法先將罕用字的部件拆開看,舉例說明,以”垚”為例,是由三個”土”字組成,所以可以用拼音輸入法先打一個”u”後面加上”土”字的拼音三次,這個字將會顯示出來,這個小小的方法可以讓人對罕用字更加有興趣,您也可以試一試。

字體產品與應用

如何快速在軟體中找尋文鼎字型?

電腦安裝太多字型,每次都要花很多時間從頭開始,卻還是找不到要使用的字型,令人覺得頭痛,再加上不同軟體讀取字型名稱的方式不同,有時候明明安裝中文字型,但是字型清單顯示的卻是英文字型名稱。

 

以下我們以在台灣使用繁體中文介面的Windows作業系統說明如何在軟體中找到文鼎字型。

文鼎字型的中文名稱大多以「文鼎」這兩個字開頭做顯示,英文則是「AR」,在iFontCloud文鼎雲字庫網頁或iFontCloud字庫管理工具中有提供字型的中文和英文名稱,讓您清楚知道字型的名稱,搜尋字型更容易。

常用的Office 軟體,如:Windows 2013 word、Excel和PowerPoint,在顯示字型的下拉選單中,輸入字型名稱的第一個字「文」或「AR」即可快速到達相同名稱字型的位置,此時點開下拉選單就能更換為其他字型。這裡有一個字型語言及作業系統語言的變數要注意一下,一般來說,繁體中文字型名稱大多為中文顯示,而簡體中文的字型名稱則為英文;如果作業系統是是Windows簡體中文版,則規則相反,繁體中文的字型名稱以英文顯示,簡體中文字型名稱則是中文。

而設計師常用的Adobe系列軟體,在Photoshop、Illustrator中,繁體或簡體字型的字型名稱都是用中文顯示。在字元視窗中,輸入任一字型的名稱關鍵字後,Adobe的字型運算機制即會將該關鍵字相關的字型列出,這樣就加快了使用者找字的效率。倒是要特別題一下,在InDesign裡,若在繁體中文的作業環境,簡體中文字型是以英文的字體名稱做顯示。

從上方簡要的說明,我們可以這樣說,在字型公司的字型工程做業端要兼顧到字型使用的各個環節,確保在任何環境上字型產品都能被正確的顯示與使用到,這確實是一件專業的工作,也是整體造字工藝中重要的一環。