跳到主要內容

為新手撰寫技術文章的方法

觀察 "XYZ" for Dummies這類書籍中使用的撰寫方式：

  • 每章開頭有漫畫
  • 將要描述的觀念、步驟，條列式、分點
  • 配合圖示來標注要強調的段落
  • 採用較大的標題，標題用特別的字型
  • 儘量使用圖片說明想法
  • 另闢一區特別解釋專有名詞

其他作法：
  • 從讀者的角度去訂標題
  • 只提供一種不容易出錯的操作步驟
  • 去除非必要的程式碼與技術細節
標籤：

留言

張貼留言

這個網誌中的熱門文章

iframe DOM 被移動造成重新載入

如果用 javascript 去搬動 iframe DOM 的位置, 瀏覽器會將其內容重新載入，這是現有 HTML 規格 > When an iframe element is inserted into a document that has a browsing context, the user agent must create a nested browsing context, and then process the iframe attributes for the "first time". 範例： http://jsfiddle.net/pZ23B/ 測試結果： * Safari 3.1 / Win: reload * Opera 9.5 / Win: reload * IE10: reload * IE7 / IE8: not reload (部份摘自 https://bugzilla.mozilla.org/show_bug.cgi?id=254144 ) 參考： * https://bugzilla.mozilla.org/show_bug.cgi?id=254144
張貼留言
閱讀完整內容

ZK 與響應式網頁設計（RWD）

響應式網頁設計 (RWD) 就現今而言應該是許多網站必備的條件之一，ZK 框架可以幫你從一個抽象層次較高的角度滿足 RWD，不需要了解 CSS Media Query 的細節。 元件層級 元件層級的 RWD 是由元件內部自動完成的。每個 ZK 元件都能區分瀏覽器的種類，因此會自動依據桌上型或行動裝置瀏覽器來自動調整元件的外觀，不需開發者介入，例如 datebox 在桌面瀏覽器會跳出小月曆： 在手機瀏覽器就會自動變成下方滾動條： 頁面層級 頁面層級的 RWD 因為牽涉到版面設計，因此無法靠元件自動完成，因為畢竟每個頁面需要的版面設計皆不相同，這通常不是一個技術性的決定，而是政策性或設計性上的決定，因此 ZK 提供一些工具讓你實現 RWD。以下根據你想要達成的效果，概述你可用的工具。 寬度、版面自動調整 如果你想要做出的效果是，畫面內各區域自動調整寬度，較窄時調整位置，我非常推薦搭配 Bootstrap Grid 與 ZK 一同使用，因為 易於整合 。使用 Grid system 只要在 div 套上 CSS class，如 col-md-4 ，因此跟 ZK 整合很容易，不需要特別的設定與程式。 元件變換 如果你希望畫面寬、窄時，各用不同的元件來顯示，例如側邊欄在畫面變窄時消失並換成小的選單圖示，這時元件本身當然無法得知要做這樣的轉換，你可以透過 onClientInfo 事件 或 @MatchMedia 來偵測畫面寬度變化，並針對該變化調整畫面元件。 更多細節可以參考以下資源： Use Bootstrap with ZK: Responsive Admin Template 範例專案 線上展示
張貼留言
閱讀完整內容