Elena Dolgova

Albicocca

提供各個分類的訂閱

有時候部落格的文章主題可能是分散又毫無相關的
雖然可以用標籤當作文章分類讓瀏覽者自由選擇
但由於訂閱者是訂閱整個網站的文章
因此仍不可避免地會讀到沒興趣的文章
此時可以提供各個分類的訂閱
讓訂閱者也能自由選擇

1.勾選展開小裝置範本

2.找到 (<data:label.count/>)
 在其後方加上

<a expr:href='"/feeds/posts/default/-/" + data:label.name'>連結文字或圖片</a>
<!--
基本上用相對網址的方式就可以了
當然也可以用絕對網址的方式
<a expr:href='"部落格網址/feeds/posts/default/-/" + data:label.name'>連結文字或圖片</a>
-->

Michael Cheval

Michael Cheval-official website: Surrealistic Oil Paintings, Drawings, Portraits, Books & Artist's Info

Tom Bagshaw

home - mostlywanted
tom bagshaw blog

製作網頁結構示意圖與網頁雛形

決定好網站結構之後
再來就是製作網頁的頁面結構
用來決定網頁的佈局及動線
頁面要有哪些功能與內容
以及那些功能與內容如何擺放之類的
規劃的越詳細越好
但不用畫的很仔細
若想詳細的標示出一些細節也是可以
譬如說
各區塊的大小?
各區塊之中的項目內容是什麼?
之類的

<!--
此時請不要考慮視覺的部分
-->
製作時請務必參考整理出來的資訊網站概略結構
保持一致並檢視是否有不周全之處
以及考慮一些網站使用性的相關問題
譬如說
連結方式是要另開新視窗還是在自身視窗?
若文章很長要怎麼讓使用者快速回到導覽選單?
或是要讓使用者直接到別的頁面?
之類的問題



Page Lab 的首頁與內頁之頁面結構示意圖



Balsamiq Mockups 將頁面結構示意圖製作得更詳細一點
<!--
增加了一些在收集以及整理資訊時沒想到的功能
。分頁功能
。相關文章
。回到頁首
。路徑導覽
。工具提示
。頁尾資訊
-->
<!--
Blogger 自訂性很高
可以任意地修改
所以不用去遷就 Blogger 既定的架構
首頁跟內頁內的不同呈現
就能模擬實現上篇製作網站概略結構所提到的企業網站結構
-->
<!--
由於背景不同的人
瀏覽網站的習慣也大不相同
這個部份就只能去猜想使用者的習慣
以及學習一些相關知識
優使性(Usability) | Usability Notes 優使性筆記本
也可以參照一些網站當做範本
-->
<!--
由於 Blogger 己經有了基礎的功能雛形
在這個基礎上建立一個 Prototype 比一般網站容易多了
若可以的話
建議先做出 Prototype 來進行測試
不要在乎視覺部分
只要把功能擺到大概的位置
看看功能正不正常
以及頁面動線與功能以及使用性是否符合當初的想像
雖然網頁最終都還是要進行測試
不過先做 Prototype 測試
可以提早發現問題
-->

製作網頁結構示意圖 - Balsamiq Mockups

Balsamiq Mockups
Balsamiq 公司所出的網頁頁面結構製作工具
有線上跟離線兩種版本

<!--
離線版本需安裝 Adobe AIR
-->
運用內建的 75 種常用元件
便可以快速的製作出網頁的頁面結構示意圖
不僅能明確地表示出網頁的頁面結構及各項功能
在操作上還支援許多常用快速鍵
製作起來更是直覺又容易
<!--
如果想輸入中文
請點選 View
然後勾選 Use System Fonts 即可
-->
<!--
缺點就是很耗資源...
還有不時會跳出要求註冊的訊息
-->
<!--
授權費用為 79 美元
但根據 Balsamiq - Get Mockups For Desktop For Free 的資訊
有許多方式可以取得免費授權

在部落格上寫 Balsamiq Mockups 的相關介紹
可以寫 E-mail 去申請免費授權
-->

Feed 長尾搜索引擎 - feedmil

feedmil
feedmil 的自我定位是 a "long tail" feed search engine
是一個專注在 Feed 的搜尋引擎
很適合有資訊焦慮的人

一開始先以關鍵字找到相關網站
初步篩選條件有 surprisingwellknown

<!--
根據搜尋出來的結果來看
這兩個篩選條件取決於 popularity
-->
<!--
surprising
名氣較低的網站
不過不是真的冷門
而是相對於 wellknown 條件

wellknown
相對於 surprising 條件
名氣較高的網站

topics
網站的主題摘要

popularity
名氣程度

authority
權威程度

activity
活躍程度

frequency
每星期的發文頻率

feed type
Feed 的來源類型

sort by
篩選條件為 authority

filter by
用語言為篩選條件
目前只有英文
-->
<!--
各篩選條件有微妙的相關
不過不清楚其評比的邏輯
-->
之後還可以做再次篩選
透過進一步的再次篩選條件
可以更確實地找到符合需求的網站

Zhou Fan

Zhou Fan - Chinese Contemporary Artist

製作網站概略結構

資訊收集 整理完畢之後
接下來製作網站地圖
這裡要製作的 Sitemap
不是那種由工具解析網站後產生給搜尋引擎機器人索引用的
也不是為了方便訪客瀏覽網站而建立的網站導覽
而是為了釐清網站頁面之間的關係
事先規劃出的網站整體架構
定出整個網站的層級架構
以及網站的相互連結動線

<!--
我不知道這個東西的專門名稱
也不知道用網站地圖稱呼對不對
在這裡就暫且用「網站概略結構」來稱呼
-->
<!--
由於主要是給自己看的
可以不用太仔細
在紙上畫一畫也行
只要看得懂就可以了
-->


Page Lab 的網站概略結構
<!--
我直接沿用 Blogger 的網站結構
紅藍色是區別層級架構以及內外部功能與連結
實線跟虛線用來標示連結方向與相關性
-->
<!--
我對於網站層級的理解是
是否一定要經由某個特定的連結或頁面
才能到達另一個頁面

如果是
那就算一個層級
如果不是
那就不能算一個層級
->
<!--
RSS 閱讀器」跟「外部網站」已經跟網站毫無關聯
在這裡標示出來只是為了更明瞭之間的關係而已
-->


取了幾個一般企業網站常見的項目
所模擬出來的網站概略結構
<!--
雖然用企業網站的架構不太妥切
不過跟 Page Lab 的網站概略結構相較之後
會比較容易了解差別在哪
以及為什麼要做這個什麼鬼網站概略結構
不然光看上面的 Page Lab 的網站概略結構
實在看不出有什麼製作的必要性
-->
<!--
但其實真要作的話
Blogger 還是可以做出同樣的結構就是了
-->
<!--
模擬的網站概略結構中的登入系統
是指管理者登入後台
不是會員系統
如果是會員系統
結構會再複雜一點
-->