SQL: 將分號分隔的客戶編號, 存成table

Validation of viewstate MAC failed

[問題]
最近網站放幾分鐘, 就會莫名出現
Validation of viewstate MAC failed

經Google 大神查了一下, 很多人都有碰到.

[原因]
參考網址(http://tw-hkt.blogspot.tw/2011/11/asp-validation-of-viewstate-mac-failed.html)

會產生"Viewstate MAC 的驗證失敗"主要是因為當你使用ViewState,Session,Forms authentication(認證)時會有 encryption(加密) 和 decryption(解密)的機制，此時會產生一組Key，這組Key會在特定時間被回收，

若前後搭不上，驗正將會失敗，這也就是Viewstate MAC 的驗證失敗的原因。

[解法]
1.到下列網站去取一組machinekey
http://aspnetresources.com/tools/machineKey




2.將這組key值,  ＜SYSTEM.WEB＞ 放到 中間

目前己經沒看到過, 正在觀察中

那些頁面排版需要了解的事情

好文章,記錄一下;資料來源: 奧革設計

http://blog.ogdesign.tw/na-xie-ye-mian-pai-ban-xu-yao-liao-jie-de-shi-qing

些頁面排版需要了解的事情

排版是什麼？

排版是將文字、圖片等元素在版面調整，使版面佈局條理化的過程。一般來說，透過來版，讓人們更容易的去閱讀、接受這些提供給他們的資訊。

為什麼要提供良好的排版？

一個良好的資訊傳遞需要幾個要素來達成，分別是對的內容與對的方式以及對的人，唯有這三個要素都成立的時候，資訊就能夠有效率的被使用者給接受。排版扮演著內容與使用者之間溝通的橋樑，良好的版面設計讓使用者不需要特別的努力、訓練就可以了解提供的內容；相反，糟糕的排版可能會讓使用者拒絕接受這些內容。

排版最重要的四個要點

排版設計中有非常多需要注意的細節，各種細節也會因為不同的情境、需求而不同，底下列出了四項排版最重要的要點，如下：

1. 對齊（Alignment）

任何東西都不能隨意擺放，每一個元素之間都有某種視覺關係。利用對齊建立一個清楚整齊的外觀。

2. 親密（Proximity）

彼此相關的內容應靠在一起，反之不相關的內容保持距離。利用親密性，強調畫面的組織與架構。

3. 重複（Repetition）

重複視覺要素的顏色、字體、大小、空間等，增強條理性，也增強了整體一致性。

4. 對比（Contrast）

避免頁面上元素太過相似，如果它們不同，哪就讓他們截然不同。讓重要的內容引人注目，讓使用者間看到它們。

參考資料：寫給大家看的設計書、完形心理學

文字排版要點

文字是內容的本質，人們透過文字、句子來闡述知識，讓我們透過了解文字排版，讓文字更容易被閱讀、被接受：

1. 使用適合閱讀的字體

字體大小與使用者螢幕大小、使用距離有關，清楚了解使用者使用的環境與習慣後，選擇一個適當的大小。

2. 選用適當的字體

有些中文字體的英文版本其實是不合適的，挑選與中文字體相對應的英文字體作為搭配的字體。

3. 設定恰當的行高

也就是「文字密度」，太擠的文字在換行時，眼睛不容易找到下一行的起點，較不容易閱讀。

4. 設定恰當的段距

清楚的段落區分，讓讀者可以清楚地了解現在正在閱讀的段落。

5. 注意段落的寬度

注意文字最後顯示的設備大小，太寬或太窄的段落寬度都會造成閱讀上的困難，一行文字以45字元~75字元是比較恰當的。

6. 清楚的區分標題與內文

使用對比的方式（例如顏色、大小、位置）將內文與標題清楚的區分開來。

從認知心理學看排版

• 人們會將鄰近的事物視為一體
• 紅色跟藍色放在一起容易疲勞
• 大寫文字難以閱讀
• 閱讀與理解是截然不同的兩件事
• 如果人們感覺這個字體不易閱讀，他們會把這種困難的感覺轉化至文意本身，並因此覺得文章所談到的內容難以執行或難以理解。
• 較長的欄寬能提高閱讀效率，但人們偏好較短的欄寬。
• 適時的應用進階展開，減少一次顯示的資訊數量
• 分類資訊
• 提供明顯的線索

  參考資料：了解人，你才知道怎麼設計

從設計法則學習排版

• 80/20法則
  不要對設計中所有的元素一視同仁。應該利用80/20法則來評估各元素的價值、鎖定重新設計與最佳化。
• 希克定律（Hick’s law）
  當選項增加了，下決定的時間也增加。
• 倒金字塔法則
  以重要性遞減的順序呈現資訊。先呈現最重要的資訊，之後才是附加的詳細資料。當呈現資料的效率很重要時，就使用倒金字塔法則。
• 提高信噪比
  同一顯示中，相關資訊與不相關資訊的比例，在不影響功能的原則下，必要元素應該儘量減到最少。
• 使用基本元素，讓使用者安心
  人們在數為世界的心智模型，常常是建立在對這些基本元素的了解，不管是網頁或者是App，畫面中的某些常見元素早已變成基本構成要素，使用者渴望或者預期他們能夠在網頁上看到些元素，已完成特定的任務，有安心的感受。
• 易視性
  只使用者於使用產品的過程中，能夠順利達成特定目標的容易程度，讓使用者可以看清楚產品的狀態，並且輕鬆推薦可以採取的動作。易視性決定了app該呈現的關鍵內容是什麼。
• 進階展開（Progressive Disclosure）
  進階展開主要強調提供給使用者當下所需要的內容，其他沒有助益的內容、控制項暫時不提供，直到使用者在各類別做選擇後，才展開更多的相關細節。
  利用進階展開的方式，可以減少使用者的認知負擔。
  把資訊內容歸納於少數幾個選項，在分階段漸漸釋出細節，簡要呈現當下所需的資訊，不只能降低使用者認知負擔，更可以避免豐富的選擇堵塞使用者的思緒。
• 分組（Grouping）
  完形心理學
  分組是一種組織資訊的技巧，將眾多的資訊依照特定方式分類為幾組，在同一組的內容相關性較高，不同組內容差異性大，面對龐大資訊時，可以利用這個方式減少壓迫感。

  參考資料：設計法則

從遙控器上學習排版

DVD 遙控器是一個極度複雜的工具，上頭除了電源、播放、暫停等基本功能外，還會參雜著其他各式各樣的功能，零零種種加起來大約有40多個按鈕，每個按鈕對應各種功能...
我們可以從以下幾種方式，來簡化複雜的遙控器：
- 刪除 - 去掉不必要的按鈕
- 組織 - 按照有意義的方式分組
- 隱藏 - 隱藏不必要的按鈕
- 轉移 - 轉移不必要的功能到其他地方

其他要點

• 儘量使用單列版型而不是多列版型
• 使用良好的預設值而不是給使用者選擇
• 使用良好的預設值減少使用者的操作
• 界面要有鮮明的對比讓使用者容易區分
• 精簡表單的內容
• 不要在頁面上放太多的連結，這樣會分散使用者的注意力
• 提供直覺的操作
• 不要過度使用邊框，這樣會讓界面四分五裂
• 使用基本元件而不是重新設計
• 將有關聯的事物進行分組
• 讓點擊區域大一點
• 如果提供太多的選擇，使用者反而一個都不會選
• 使用社群驗證的方式，讓
• 易讀的標題
• 易於閱覽的文本
• 善用留白，營造清爽乾淨的感覺
• 界面風格一致性很重要
• 注意文字的密度
• 突出畫面上重要元素
• 一圖勝千言
• 把文字看作是使用者界面（UI）的一部份
• 儘量不需要scroll就能看到主要的內容
• 藍色往往是最適合連結的顏色
• 搜尋框盡可能為27個字元的寬度
• 留白讓內容更容易被理解
• 大多數的人視廣告為無物
• 少即是多
• 限制頁面內容的長度.
• 參考設計規範
• 觀察界面的視覺動線
• 導航列要放在清楚的位置，如果導航列的項目是網站的核心，請勿必讓導航列出現在每一個畫面上
• 使用響應式設計
• 把重要的資訊放在列表的最上方
• 在輸入欄位旁提供提示、範例
• 在送出表單前進行欄位錯誤的檢查
• 讓使用者清楚知道點擊哪裡進行下一步
• 在所有的頁面上顯示你的服務名稱、Logo
• 避免使用全大寫的英文，除非是特別用來強調的標題內容
• 為各種設備調整適當的字體大小
• 你要考慮不同設備的閱讀距離的不同
• 把你的Logo放在固定的位置上，並確保點擊它能夠返回到最初的頁面

  Good UI : [https://goodui.org/]
  10 Useful usability findings and guidelines [http://www.smashingmagazine.com/2009/09/24/10-useful-usability-findings-and-guidelines/]
  How to achieve a good website layout [http://naldzgraphics.net/tips/how-to-achieve-a-good-website-layout/]

關於Label的位置

在表單排版設計中，標簽的位置如何擺放是一個很常見的問題，SitePoint上有一篇文章，完整地分析各種擺放的好處與壞處，非常值得閱讀。

[http://www.sitepoint.com/definitive-guide-form-label-positioning/]

圖片來源 : [https://www.flickr.com/photos/samodrole/5588196735]

不用廻圈組字串

又是記一下, 自己以後上來查方便的文章.

需求很簡單.
就是先select 出來的Table , 把Table 某一欄位值當字串組起來.


create table #tmp_listppl (empno varchar(7), ppl nvarchar(500))

 insert into  #tmp_listppl (empno, ppl) select '1',  cname from dbo.v_epaperauth

--這時Table 會長的這個樣子
-- 1,王大明
-- 1,張小芉
-- 1, 李大
 
declare  @list as nvarchar(500),@no as char(7)
set @list =''
set @no=''

update #tmp_listppl
set @list = ppl = (CASE WHEN @no <> empno THEN rtrim (ltrim(ppl))  ELSE @list + ';' + rtrim (ltrim(ppl)) END),
@no = empno



select empno,max(ppl)as auditno into #tmp from #tmp_listppl group by empno

select * from #tmp

--這時會這樣子  1, 王大明;張小芉;李大

drop table #tmp
drop table #tmp_listppl

記錄一下, 用Tree 架構轉階層..好文, 找了好久..

http://www.dotblogs.com.tw/caubekimo/archive/2010/07/20/16654.aspx

1. 設計資料庫欄位，包括左邊界、右邊界、PK、其他資訊等等
2. 編寫節點搬移、插入、刪除的SQL語法(我的做法是放到預存程序裡面再用ADO.NET呼叫)
3. 設計界面(我的做法是使用TreeView，至於Data Binding請參考這邊)

http://mikehillyer.com/articles/managing-hierarchical-data-in-mysql/

這是java script 可以合併table 的!
http://www.redips.net/

如何清除Facebook 分享產生的catch

最近快要上線的網站, 有個新功能. 就是Facebook分享!

對! 分享連結出去到個人的FB裡.   很簡單的功能! 

但是Facebook 好聰明.把分享出去的meta data 給記下來了!!

只要有第一個人分享過. 對... 之後再連同網址的人分享. 也是像下圖錯的訊息

還好找到方法
只要到這個網址
https://developers.facebook.com/tools/debug

在上面輸入分享的連結. 就可以讓Facebook 重新抓取了!!
還好找到這個工具..

不然上線就慘了!

__dopostback 套 masterpage 不work

上週請同事教我用colorbox , 想要做的事情很簡單.
跳出一個視窗, 讓使用者選擇個選項後. 就依使用者選的選項.來做導頁的動作.

很簡單的事, 就碰上的莫非
用了一個linkbutton , 後端cs  寫導頁.
colorbox closed 的事件 , function 是呼叫postback 事件.

id="ctl00_ContentPlaceHolder1_LinkButton1" href="javascript:__doPostBack('ctl00$ContentPlaceHolder1$LinkButton1','')"

因為知道有套Master page , 也知道Browser 會編過id,
我們也把呼叫物件的[LinkButton1]改成了[ctl00_ContentPlaceHolder1_LinkButton1]
 
誰知道Browser把呼叫的doPostBack 物件名稱 改為'ctl00$ContentPlaceHolder1$LinkButton1'
 
把function 中的呼叫名稱. 改為'ctl00$ContentPlaceHolder1$LinkButton1' 就可以了.(泣)
 
前端呼叫colorbox function如下:
function DoNew(link, ht) {


$.colorbox(

{ href: link,

iframe: true,

width: "80%",

height: "80%",

transition: "none",

opacity: "0.5",

width: "500px", height: ht,

innerWidth: "500px",

//onClosed: function () { location.reload(true); },

onClosed: function () { __doPostBack('ctl00$ContentPlaceHolder1$LinkButton1', ''); },

overlayClose: false

});

}
這Bug花了我二天時間. 一定要寫一下記下來!