真正的「個人電腦」

最近覺得很衝擊的事:很多年輕人家裏根本沒有電腦,只有自己的智慧型手機⋯⋯真正的「個人電腦(PC)」其實是手機啊!

(然後多數網站依然還是以桌機設計為優先考量)
Read More...

[#偶爾正經] 談談最近很多畫家在意的Facebook觸及率下降問題,以及我認為該怎麼做。






[#偶爾正經] 談談最近很多畫家在意的Facebook觸及率下降問題,以及我認為該怎麼做。
 
 
先說結論,如果畫家還在猶豫要不要開一個部落格,那麼我完全建議目前還沒有部落格的畫家去開一個,真的很懶的話開在痞客邦也比什麼都沒有還要好。
 
 
談Facebook觸及率下降然後被要求下廣告,理由很簡單:
 
1. Facebook的初衷就是交朋友(以及知道對方有沒有正在交往的對象XD)。
 
2. 專頁本來就是商業的一部分(就算你是畫畫的,難道不想用畫畫來賺錢嗎),免費讓你用本來就是施捨的。
 
 
而越多人(或專頁)用Facebook的話,動態塗鴉牆上的內容會被理所當然的平均稀釋,少互動(少按讚、少留言)的人或專頁自然慢慢被淡出觀眾的視線,看看光臺灣多少畫圖的人開專頁?甚至我偶爾會嚇到說怎麼會有四五十萬的讚的畫家我從來沒看過XD
 
再來關於到底要不要自己架站,推薦先讀讀天下為暢訪談我是馬克這篇( https://wendellyu.com/p/388 )文之後,再看我的結論,我建議畫圖的人(照推薦順序排列):
 
1. 不怕花錢的話,自架站(推薦Wordpress.org不是Wordpress.com),每年網域+主機大概1600元起跳,流量高像我是馬克的話可能一個月就破萬元。
 
2. 只願意花點小錢的話,自架站搭配Flickr或Google圖床,.com網域每年固定花費500~700(看你在哪買)。
 
3. 想比2更省而且更省腦力的話,買網域搭配Blogger或Wordpress.com或Tumblr(絕對不要用Wix),.com網域每年固定花費也是500~700(看你在哪買)。
 
4. 省錢省腦力也可以考慮痞客邦,但它掛網域要另外花錢。
 
我自己是選3,我從2013年開始就是Blogger搭配買網域,只要Facebook有發的作品我的站內一定要有(而且會比Facebook豐富),像我站內有放廣告,只算Google Adsense的部分雖然累積只賺兩萬多而已,但賺來的廣告費完全付得起網域費還有剩(多的錢要拿來投廣告也可以),而畫圖的人如果越多人架站的話整個環境的廣告費也會更好,大家也就能賺得更多。
 
只開在Instagram或Plurk或G+或Twitter或巴哈姆特⋯⋯等其他未來可能出現的社群網站都早晚要面對跟Facebook一樣的問題;我的基本原則是:自己的網域才是自己的家,其他都是擴散平台而已。
 
 
最後,有問題歡迎留言或私訊問我,而且我會盡可能的幫忙;雖然我不是什麼很知名的畫家,但至少我也在網路業打滾了10年,同時有畫家和工程師經驗應該能解答不少問題了吧XD
 
 
#滷味與本文無關
#如果有想到什麼會繼續補充😎
Read More...

RWD版本Share Button分享功能(LINE、Facebook、Twitter、LinkedIn、Google+)懶人包(Wordpress和Blogger可用)


這組分享按鈕包含了原生的LINE、Facebook、Twitter、LinkedIn、Google+的分享功能,而且是RWD的唷!

怎麼用呢?不囉嗦!直接把本文下面的原始碼複製,貼上到Wordpress或Blogger的小工具(Widget)就可以用了,簡單吧?

對了,雖然我標題只寫了Wordpress和Blogger可用,但理論上所有網站只要可以給你貼Html、CSS、JS的話都可以用。

Read More...

一場夢提醒自己其實很害怕時間的流逝

一場夢提醒自己其實很害怕時間的流逝

我夢到了我的媽媽

很老

非常非常地老

我想大概是我太長期在外地工作所以夢中的我忘了我媽媽為什麼變得這麼老

看媽媽的樣子大概70多歲吧

也就是說

夢中的我有20年沒有好好關心我的媽媽

我抱著媽媽

一直哭

對不起我沒有常常陪你

一直哭

媽媽

你還有沒有力氣跟我玩

媽媽

你是不是老了就沒力氣了

我抱著媽媽

我的身體開始越變越小

回到小朋友的大小

那個還能勾著媽媽脖子

跳在他身上那麼小

我的媽媽也越來越年輕

媽媽抱著我

我越來越小

媽媽

我奪去了你的時間嗎

————————————

時間一直往前走

我自己年紀也越來越大

有那麼一天我也會老到動不了


Read More...

手機輸入框第一個英文字母大寫

Paul Li
方才聽到一個有趣的問題, 由於 iOS 對於 input field 輸入時, 預設小鍵盤都會針對第一個英文字母作大寫的動作, 這時候 back end 對於該欄位的檢查寫的比較不靈活, 不會幫 user 轉為小寫再檢查時, 就會出現錯誤! 其實這類的問題可以透過 front end 來解喔! (當然 back end 的修正與檢查亦不能少), 以下介紹相關的解法

※ CSS:
input[type="text"] {text-transform: lowercase;}

※ HTML:
<input autocapitalize="off" autocorrect="off" type="text">

對於該 element 只要掛上 autocapitalize & autocorrect 這兩個 attribute 就可以有效阻止 OS default 的行為喔!

希望對大家有所助益!
Read More...

MAC OSX更新Yosemite之後,調整音量的「啵啵啵」聲音不見了!


MAC OSX更新Yosemite之後,調整音量的「啵啵啵」聲音不見了!

這樣調音量就不知道現在多大聲了啊⋯⋯
好在有開啟方法!

系統偏好設定/聲音/音效,將「當音量變更時播放回饋音」打開,才會有聲音~
(預設把勾勾拿掉了)

不過聲音變成「哆哆哆」了⋯⋯
Read More...

在面試時告訴企業主「不加班」是錯的嗎?談里程碑設置法

我是一個工作三年剛邁入第四年的人,今年我不小心進到一家「要加班的公司」。
所以我積極想逃走,而且我會說明不喜歡加班(找死?XD)


我認為加班最大的原因是「設置了錯的里程碑」。


舉例來說,一個活動網頁要上線,一開始擬定上線日期如果是一星期後必須上線,那麼該員工原本負責的工作呢?如果該員工本來被安排的工作量都已經要稍微加班才能完成,那新加入的活動網頁肯定會讓該員工的工時加長。


如果無法吃下那麼多工作量,為何要緊逼員工的「下班後產能」呢?


我理想中的里程碑設置法:

  1. 先粗估完成日期
  2. 將粗估的完成日期當作查核點
  3. 將完成日期設為查核點後一星期,作為突發狀況調整、除錯之用
  4. 設定提前完成獎勵(我偏好用特休而非獎金獎勵)
  5. 若完成日期有難度,請該專案負責人在完成日期之前就要提出說明及預定完成日




如此一來,超過完成日期又沒有說明或尋求幫助的話表示能力不佳;但在完成日期之前完成的話,員工士氣高昂,專案又順利進行,和樂融融。







不過我只是個小小網頁前端,雖然當過小小公司的網站專案經理,但要走到管理這步還早還早⋯⋯
Read More...

Steve Jobs在Standford大學的演講文字稿

只要你是Mac電腦,在Finder中同時按下Command + Shift + G,就會出現「前往檔案夾」的對話框,貼上以下路徑:
/Applications/Pages.app/Contents/Resources/
就會找到Apple.txt,裡面的文章是Steve Jobs在Standford大學的演講文字稿,全文如下:

Read More...

[筆記] 在Mac安裝Compass


雖然據說在Mac下安裝Compass只要打開終端機貼上指令就好,但我的電腦不知道為甚麼全部都要加上sudo才能裝⋯⋯以下記錄步驟,如果不會卡住的話就自己拿掉sudo吧ˊ_>ˋ

Read More...

安裝Compass遇到的的錯誤「 ERROR: While executing gem ... (Gem::FilePermissionError) 」解決方法


最近在裝Compass時遇到了這個錯誤:
ERROR:  While executing gem ... (Gem::FilePermissionError)
    You don't have write permissions for the /Library/Ruby/Gems/2.0.0 directory.

Read More...

選字的時機——臺灣vs.台灣

直立招牌


這次是因為被要求,我才用了右邊的「台灣」作為最後定稿。


其實我一直是個捍衛正體中文字的有志青年(?)
我不僅寫「臺灣」,還寫「新臺幣」、「臺東」、「臺北」、「臺中」、「臺南」,對我來說本來就該寫「臺」,所以看到任何寫「台」的都覺得可惜:




不過,相比之下也可以發現保留「臺」這個字的單位越來越少:





台灣的漢字正式書寫為「臺灣」,而「」為正體字,但與異體字」通用,現今民間與媒體多用「灣」[23],在官方國書、文件中則使用正式的「灣」[24]臺北市政府馬英九擔任市長推動「正體字運動」時,全面於相關機關的公文與文件使用「」字[25]中華民國教育部在2010年考據字源後宣布,以後教育部公文一律使用「臺灣」用字,並建議中央其他部會跟進[26]。而俗體字」的發音實為「 yi 」,意思和「怡」字通用[27]
中文維基百科
 


不過像我這次做招牌的時候,對方的理由我倒也覺得很有道理:

「寫『台』灣,看的人才能一下子看出台灣啊!要是寫臺灣的話,臺都糊在一起了!」

模擬一下:從很遠的地方看臺灣與台灣會如何⋯⋯


好吧,我被說服了。

既然臺灣台灣大家都看得懂,那用在招牌或一些宣傳場合,台灣好像真的比較容易辨識?甚至日本人寫臺灣漢字時也是寫「台湾」,「台湾大哥大」就是用日文漢字⋯⋯

看來「臺」與「台」的戰鬥將繼續下去⋯⋯XD
Read More...

我把Facebook留言板變活了!Facebook Comment Responsive Design!


最近在做Responsive Design(響應式設計、自適應設計)的網站時,意外發現Facebook的留言板無法用%來設寬度,只能用pixel固定寬度。

雖然Facebook的留言板預設在手機上會把寬度變成100%,但其實有的時候會出現不是在手機上用,卻想把網頁縮小一點點的情況,例如上班偷看網頁所以我很不懂為甚麼Facebook要強制用px?

我用「facebook comment responsive」的關鍵字在Google上查了很多資料後,本來有看到用CSS強制覆蓋Facebook提供的屬性來讓留言框可以變成Responsive的狀態,但有用的人應該會發現已經在2014年3月失效了⋯⋯

為甚麼我知道是2014年3月呢?因為後來我又繼續爬,發現了一個頗簡單的解法!而提問的人大多是在3月發生的XD

Read More...

浮動側欄動態選單簡易教學



最近趁過年時,幫綜合口味的關於頁面做了「浮動側欄動態選單」,如果想看效果的話可以先去綜合口味的關於頁面玩玩看~喜歡的話再來照這個教學做XD



step1:

將想要有「浮動側欄動態選單」的網頁或文章,從「撰寫」模式(預設)切換到「HTML」模式,並在文章最前方貼入以下內容:

<!--浮動右側欄位Start-->

 <!--part1Start-->
<style>
.floatMenu{
 width:110px; //如果每個區塊的字數較多,請自行調大這裡的數值。
 margin-left:672px; //如果沒有剛好吸附在右邊的話,請自行調整這裡的數值,數字越大越右邊。(想吸附在左邊的話請見附註4)
 position:fixed;
 top:20%; //如果想要更改出現的高度的話,請自行調整這裡的數值,數字越大越下面。
}

 .pointer {
 //這段之下是讓效果變柔和的效果,可自行修改「.25」的數值調整速度,若不需要可拿掉XD  
 -webkit-transition:all .25s ease-in-out; -moz-transition:all .25s ease-in-out; 
-o-transition:all .25s ease-in-out; transition:all .25s ease-in-out;
 //這段之上是讓效果變柔和的效果,可自行修改「.25」的數值調整速度,若不需要可拿掉XD 
 
 background-color:#fff; //每個項目的顏色。
 text-indent:0;
 display:inline-block;
 font-size:1em; //項目的字體大小,若單位不習慣em可自行改為px。
 font-style:normal;
 height:40px; //每個項目的高度。
 line-height:40px; //行高,請跟項目的高度一樣。
 width:100px; //每個項目的寬度。
 text-decoration:none;
 text-align:center;
 margin-bottom:5px//每個項目的間距。
 border-left: #31BBBB 10px solid; //每個項目前面的那條顏色及寬度,想換色就修改#的內容,改粗細則修改10px這數值。
}

 .pointer:hover{
 border-left: #f64c83 5px solid; //滑鼠經過時,每個項目前面的那條顏色及寬度;想換色就修改#的內容,改粗細則修改5px這個數值。由於滑鼠經過時會從10px變成5px,所以會產生動態效果,若只想單純換色就將數值改為10px即可。
}
</style>
<!--part1End, made by chodaict-->

 <!--part2Start-->
<script>
$(function(){
 $('#aboutA').click(function(){ $('html,body').animate({scrollTop:$('#about').offset().top}, 800); }); //這邊注意,一個是「aboutA」,另一個是「about」,可自行命名。
 $('#nameA').click(function(){ $('html,body').animate({scrollTop:$('#name').offset().top}, 800); }); //這邊注意,一個是「nameA」,另一個是「name」,可自行命名。
 $('#authorA').click(function(){ $('html,body').animate({scrollTop:$('#author').offset().top}, 800); }); //這邊注意,一個是「authorA」,另一個是「author」,可自行命名。
});
</script>
<div class="floatMenu">
<a class="pointer" href="#about" id="aboutA"> 關於我們</a><!--這邊id要有A,href則不必。-->
<a class="pointer" href="#name" id="nameA">  名稱由來</a><!--這邊id要有A,href則不必。-->
<a class="pointer" href="#author" id="authorA">作者簡介</a><!--這邊id要有A,href則不。必-->

</div>
<!--part2End, made by chodaict-->

 <!--浮動右側欄位End, made by chodaict-->





step2:

接下來,一樣在Html模式,把文章的段落用div標籤分隔開來:
<div id="about">
區塊文章內容,文章寫在這區域內!
</div>

 <div id="name">
區塊文章內容,文章寫在這區域內!
</div>

 <div id="author">
區塊文章內容,文章寫在這區域內!
</div>
⋯⋯依此類推。如此一來,就擁有跟綜合口味的關於頁面一樣的浮動側欄動態選單了!







附註:

  1. 樣式歡迎自行修改!
  2. 在step1中橘色字的部分,如果會在很多頁面用到的話,可以考慮直接貼到範本的程式碼內,到搜尋</head>並貼在前一行。
  3. 在step1及step2中引號內的aboutaboutA皆可以自行修改,但要注意名字要一樣,例如改成hellohelloA是沒問題的,否則會沒有效果。
  4. 如果希望浮動欄改到左邊的話,把margin-left:672px;這段改成margin-right:672px;然後數值自己設定,數值越大就變成越右邊!
Read More...

給blogger用的語音搜尋框

這個搜尋框在chrome可以用語音搜尋,

效果可參考綜合口味的搜尋區~開放給需要的人使用:)

以下直接複製並貼到html/javascript小工具即可,如果想放在除了側邊欄以外的地方就請自行去範本小工具內貼囉!


複製開始!

<!--madeBy-chodaict-->

<div id='searchBar'>
<style>
#search-box {
position: relative;
margin: 0;
padding: 0;
float:right;
}


#search-form{
width: 220px;
height: 30px;
border: 1px solid #ccc;
background-color: #fff;
overflow: hidden;
margin: 0 70px 0 0;

-webkit-border-radius: 30px 0 0 30px; //搜尋框的圓角,四個數字分別是左上、右上、右下、左下
-moz-border-radius: 30px 0 0 30px; //搜尋框的圓角,四個數字分別是左上、右上、右下、左下
border-radius: 30px 0 0 30px; //搜尋框的圓角,四個數字分別是左上、右上、右下、左下
}

#search-text{
font-size: 14px;
color: #ccc;
border-width: 0;
background: transparent;
}


#search-box input[type=&quot;text&quot;]{
width: 90%;
padding: 10px 0 10px 1.5em;
color: #333;
outline: none;
}


#search-button {
position: absolute;
top: 0;
right: 0;
height: 32px;
width: 70px;
font-size: 26px;
color: #fff; //搜尋符號的顏色
text-align: center;

-webkit-border-radius: 0 30px 30px 0; //搜尋按鈕的圓角,四個數字分別是左上、右上、右下、左下
-moz-border-radius: 0 30px 30px 0 ; //搜尋按鈕的圓角,四個數字分別是左上、右上、右下、左下
border-radius: 0 30px 30px 0 ; //搜尋按鈕的圓角,四個數字分別是左上、右上、右下、左下

border-width: 0;
background-color: #666;//搜尋按鈕的顏色
cursor: pointer;

-webkit-transform: scaley(-1);
-moz-transform: scaley(-1);
-o-transform: scaley(-1);
transform: scaley(-1);

line-height: 0px;
}

#search-button:hover{
background: #999; //滑鼠經過搜尋按鈕時的顏色
}

</style>

<div id='search-box'>
<form action='/search' id='search-form' method='get' target='_top'>
<input id='search-text' name='q' placeholder='想找點什麼嗎?'
size='30' type='text'
x-webkit-speech='true' //這個就是語音功能!
/>
<button id='search-button' type='submit' value='Google Search'><span>&#9740;</span></button>
</form>
</div></div>
<!--madeBy-chodaict-->

複製結束!


如果想調整的話請自便~XD
Read More...

如何在Mac OS X 10.9 開啓Root權限?步驟截圖!

由於Apple官方的步驟流程不夠詳盡,想當初我也研究了很久才看懂;
這次剛好有網友詢問,就來幫Apple整理一下截圖吧XD!



  1. 從 Apple 選單中選擇系統偏好設定...。
  2. 從顯示方式選單中選擇使用者與群組。
  3. 按一下鎖頭圖案,以管理者帳號的身分進行認證。
  4. 按一下「登入選項...」。
  5. 按一下右下方的「編輯...」或「加入...」按鈕。
  6. 按一下「打開目錄工具程式...」按鈕。

  7. 按一下「目錄工具程式」視窗中的鎖頭。
  8. 輸入管理者帳號名稱和密碼,然後按一下修改設定
  9. 從編輯選單中選擇啟用 Root 使用者。
  10. 輸入您要在「密碼」與「驗證」欄位中使用的 Root 密碼,然後按一下「好」。
  11. 接下來重新開機就會看到一個叫做「其他」的使用者!
  12. 點擊後,帳號輸入root,密碼就打剛才輸入過並驗證的密碼。
  13. 成功以root身份進入!
  14. 若要停用root,請從步驟1走到步驟8,選停用root即可!

以上步驟截圖完畢!希望能幫助到一樣困惑的使用者囉!
Read More...

假日曆:2014臺灣假期&請假攻略 vacation of taiwan


假日好少,怎麼放假最好?讓「假日曆」成為壓倒請假理由的最後一根稻草!

這是2014年臺灣的請假攻略,請參考!
PS. 如果把農曆新年的的那兩個3天都請下去的話,就變成:請6天放16天了⋯⋯超多天的啊!

2014年假日曆(new!)

2013年假日曆

============================



假日曆:臺灣假期&請假攻略

因為我傻傻的轉貼了一個來自香港的放假指南,被朋友指正,為了贖罪而誕生XD

此為2013年啓用,期能讓大家輕鬆瞭解假期及請假攻略,進而掌握並訂定自己的假期。
目前暫無完全公開編輯的計劃,如有心成為維護者,請寄信到:chodaict@cver.net,謝謝!

----------------------------
使用指南:

1. 所有的節日都已經標示上去,但不表示所有節日都有放假。
2. 「放假」兩字只要在出現就表示放假,含所有的週休。
3. 「請」字只會出現在有高效益連續假期之間,只是建議,別影響您的人生抉擇。

Enjoy it!

小技巧:儲存到自己的日曆後,可以用搜尋的方式搜「請」這個字,可以找到請假建議唷!
----------------------------
網址:
http://www.chodaict.com/p/calendar.html
內提供ical及xml格式供下載,如有需要請自行取用,謝謝!
Read More...

下載無名小站相簿方法(Mac用戶適用)

Mac用戶下載無名小站相簿

//20131210更新:新增Dropbox載點
//20130904更新:修改bug、載點改為github

各位用Mac的朋友們啊!當年我們一起用過無名小站,但無名小站卻只提供Windows的備份方法,太令人悲憤啦!

強者我朋友SC,趁著下午茶時間寫了一個給Mac用的備份工具,快來看看怎麼用吧!



1. 首先,你要去下載你的網誌備份檔案(你的無名帳號-data.zip),解壓縮後會得到「你的無名帳號-data」資料夾。


2. 接著,下載今天的主角--「download.py」(無法下載的話請改用Dropbox載點


3. 把「download.py」放到「你的無名帳號-data」裡的「album」資料夾內!


4. 打開mac的「終端機」!
Mac終端機Terminal
這個就是終端機!



5. 把這串指令複製貼到終端機內:

cd /Users/你的Mac用戶名字/Desktop/你的無名帳號-data/album/

6. 再把這串指令複製貼到終端機內:

python download.py

7. 開始下載!您會看到album資料夾內開始自動出現所有相片!




8. 接下來?您可以考慮像我一樣搬家到blogger







致青春

All these trifling things.. collectively form that pleasing je ne sais quoi, that ensemble. 
所有這些小事... 共同組成了令人愉悅、難以言喻的事物, 成了一曲合奏。

 ~ Lord Chesterfield, 1748



//本篇程式由SC製作並授權非商業使用,教學文由chodaict撰寫,歡迎「透過網址分享」或在「保留整篇文章」的情況下進行轉載。
Read More...

魂淡公車!



我要先說清楚,我會盡可能平靜的敘述,但是我打這篇文章時我真的快氣炸了,因為我搭錯公車。


「什麼?搭錯公車有必要這麼生氣嗎?自己搭錯的還怪誰?」



對!我搭錯,可是到底為甚麼--公車的區間車是把數字用兩種顏色區分?

以我今天搭的306為例子,我從「南京建國路口」要搭到「徐匯中學站」,在沒有出任何差錯的情況下,照理說我可以爽爽的搭上車,在完全不用換車的情況下「渡沽(打瞌睡)」到目的地再下車;可是當我被司機提醒說「到終點站囉,你要去哪裡?」時,我才發現我在「臺北橋」站!就因為我該死不是搭「紅色字的306」,而是搭到「綠色字的306」!



綠色306,圖片來源

紅色306,圖片來源


當我把這件事跟我同事分享後,他只笑笑的告訴我:「你知道嗎?262有三個顏色哦,我也不只一次搭錯。」

哇咧,三種啊啊啊啊!Threeeeeeeeee啊啊啊啊啊!

有必要這樣子嗎?公車明明可以顯示四位數字,有0000~9999共一萬種組合,到底為甚麼要增加平民百姓的生活挫折感?甚至,這世界上很多人是色盲,最大宗又是紅綠色盲啊!



我不曉得其他國家怎麼處理,但我們國家不覺得用區分是一個爛透了的主意嗎?長久以來沒有人要改善這個問題嗎?
Read More...

[電影短心得] Elysium 極樂世界/一個醫療水準爆高但仍然充滿病痛的世界

圖片來源:官方Google+

2013年8月11號,週日。和幾個朋友去京華城看了《極樂世界》(Elysium),有一些感觸與心得,簡單條列如下。

以下有劇情透露請注意!

Read More...

iOS 7 beta 6 now available,看來不會再做太多調整了?


20130816:iOS 7 beta 6 now available,看來不會再做太多調整了?

只有小小的進行修正
看來不會再做太多調整了?我好希望從畫面下方往上拉的手勢可以啓動多工介面哦⋯⋯









20130807:iOS 7 beta 5 now available,可以更新囉!


開發者們已經可以更新了!

如果是開發者身份,可以直接從設定>一般>軟體更新,直接透過OTA的方式進行更新⋯⋯

凌晨三點多寄出來的通知信!

必須要連上Wi-Fi才能下載

開始更新!那個齒輪會旋轉唷


這次更新後,最大的區別在於設定裡面的圖示吧?

右:beta4,好科技感?左:beta5,好繽紛啊!



另外我覺得很有趣的一點,信件內的圖檔名稱叫做「ios7beta5hero.png」,意思是說用的人都是英雄嗎?XD
ios7beta5hero.png
Read More...