"August, 2016" 有18篇文章

首頁  /  2016  /  August

不受平台與瀏覽器限制的測試工具BrowserStack

當網站建置完成後,便是要開始進入測試階段。而在進入測試階段過程裡多少都會在不同平台、瀏覽器上測試,但其實這是件滿困難的事(特別是網站有響應式設計),畢竟不太可能在同一台電腦上安裝不同版本的作業系統與瀏覽器,或是買入各廠牌不同型號的智慧型手機及平板來逐一進行測試。   所以今天Astralweb就為大家介紹BrowserStack這個測試工具,在這裡分成桌機和行動裝置來做介紹,一起來看看吧!   桌機 本範例所選用的作業系統及瀏覽器分別是Windows 10和Chrome

常見的EDI種類說明

今天我們要來介紹一些常見的EDI格式及種類。   還不知道什麼是EDI的請參考這裡:EDI電子資料交換 還有可安全傳輸EDI的傳輸協定AS2:一次搞懂AS2   EDI的格式標準有很多種,有些是現今商務上常用的標準格式,有些是其他特定專業領域用的特定格式,目前較為常見的格式有以下幾種:     ANSI ASC X12:   於1979年由美國國家標準協會所制定,用於不同產業之間的電子商業資料交換,爾後被廣泛地用於世界各地,是現今常用的EDI標準之一,也是線上電子商務最常用的標準,提供各種文件如訂單、收據、出貨、推貨等文件格式。  

購物網站設計趨勢(四):輕鬆找到商品,選單就是篩選器!

歐斯瑞今天要與大家談談有關網頁選單結合篩選器,並分享一些案例,看看他們快速找到商品的方式,一起來看看吧! 當商品到達一定數量或商品類型不同時,就會需要將商品作分類,讓使用者可以依照分類來選擇,商品篩選器可以幫使用者繼續過濾當下不想要的商品,也就是透過一層層分類,來選出想要的商品。根據不同的商品數量、類型和客戶群等,所制定的分類方式與所使用的篩選器也就有所不同,要注意讓使用者的操作過程越輕鬆,越能讓你的商品賣出去!我們在前面文章中提過關於選單設計趨勢的多樣性,以設計的角度來看,選單的選擇方式其實就是一種篩選機制,今天先從幾個選單與篩選結合的案例作分享,看看這些品牌利用選單達到篩選的效果。

如何使用 Sass 開發專案

今天來談談如何用Sass來開發專案,包含開發前的安裝作業。 開發前我們大概了解一下為什麼要用Sass開發 Sass是一套生成CSS的工具,支援變數、函數、繼承等功能,讓我們更輕鬆地組織及維護CSS樣式表。比起用傳統的CSS慢慢撰寫,用SCSS開發真的可以節省掉很多時間。   Sass開發前要先安裝以下工具 Ruby Sass Compass   步驟1.安裝Ruby Windows使用者,直接到http://rubyinstaller.org/downloads/下載RubyInstaller,64位元的使用者、記得要將add ruby executables to

如何在Magento 2 執行Reindex

在Magento2內,要如何執行Reindex呢? 讓我們一起來看看吧! 在安裝完Magento2之後,第一次進入後台,Magento馬上送給我們一個驚喜。 “One or more indexers are invalid. Make sure your Magento cron job is running.”   根據提示、我們必須執行Reindex的動作,但是後台已經沒有Reindex 的操作選項了,那該怎麼辦了。Magento2 將很多的後台操作都取消了、改成使用命令行的方式,Reindex 就是其中一項。

Magento 進階客製化應用 – 審核與記錄功能

Magento 平台提供了非常豐富的商品上架功能、網站內容管理以及促銷功能,不過也因為功能眾多,在設置時需要格外注意是否有遺漏或是輸入錯誤,以一般中小型公司來說,可能在輸入過程中多檢查幾次即可。但若是在規模較大型的公司或企業來說,可能就會需要更進一步的檢驗機制了,這樣的機制在 Magento 中要如何實現呢?   上級審核機制,減少錯誤增加保障! 就如同產品出廠前,會有QA人員作品值得把關一樣,我們也可以讓商品、內容或是促銷方案發出前,要經過一道確認程序。舉例來說,今天公司有A、B兩位員工,員工A負責商品的上架及修改,員工B則是商品部門主管,這兩人都各自擁有 Magento

簡易SEO入門(四)-SEO基礎心法

「要利用網路搜尋引擎,建構最佳的行銷策略,其中之一的重點就是體驗人心所想。只要能抓住目標市場正在尋找的焦點,你也可以很有效率的找到並保有那些潛在客戶。」 我們必須這樣說:「要為了人們而做,而非搜尋引擎。」根據簡易SEO入門(三)前文所述,下列有三種人們常用的檢索目標: 行動方面,如資訊交易檢索(Transactional Queries):我想做一件事,如買一張機票或聽一首歌 知識方面,如資訊查詢(Informational Queries):我想要「知道」!像是一個樂團的名子,或一家全紐約最知名的餐廳 引導方面,如導航查詢(Navigation

Photoshop教學【入門篇】PS的取代文字與檢查拼字

相信大家都使用過Word裡的取代文字的功能吧!其實Photoshop也有取代文字功能喔!當我們做好畫面時也可以使用這個修改喔,一起來看看如何製作吧! ※本教學使用版本Adobe Photoshop CC 2015 ※本教學需先對工具使用有基本認識     開啟我們製作好的檔案 選擇 編輯>尋找與取代文字 此時會出現設定視窗 可以輸入要尋找的目標和要更改的文字

安裝完 Magento2 之後,ICON不見了怎麼辦?

您有沒有這樣子的困擾,在安裝完 Magento2 及 sample date之後,興沖沖地開啟 Magento2 的頁面、確發現版面似乎有點奇怪。”少了Logo及縮圖”   解決的方法非常的簡單 只要在Magento的根目錄執行底下的命令就可以了 php bin/magento setup:static-content:deploy 成功的話、您會得到這樣的訊息:New version of deployed files: xxxxx   現在我們回到Magento 2 的頁面、按下F5重新整理一下畫面,您可以發現,Logo及圖示都回來了。

如何設計 Magento佈景主題 (2) – 使用sass開發

上一篇 我們教大家把 Magento佈景 主題的基本環境設定好了,今天來談談如何使用sass來開發 Magento佈景 主題。在開發magento前請先安裝sass+Compass,還沒安裝sass的朋友,可以參考http://blog.shihshih.com/installing-the-sass-and-compass 監控magento專案 接下來我們就要來使用compass來監控這個新的佈景主題。 在上一篇的教學文章中、我們在rwd底下新增了一個study的資料夾。現在我們要複製了rwd > dufalt資料夾裡的所有內容到study資料夾裡。 rwd >

如何設計 Magento佈景主題 (1) – 開發前的準備動作

歐斯瑞準備了一系列「如何開發 Magento佈景主題 」的文章,這一篇文章首先要帶著大家一起進行正式開發前的第一步 ー 建立一個新的Store View。在接下來的示範中、我們要新增一個名為study的Store View。 如何設計 Magento佈景主題 (1) – 開發前的準備動作 首先我們需要建立二個資料夾 app/design/frontend/my_interface/my_theme/ 這個資料夾包含layout、templates 還有翻譯的語言文件 skin/frontend/my_interface/my_theme/ 這個資料夾包含css,

Photoshop教學:【基礎篇】製作燈塔投射光效果

今天astralweb要與大家分享使用Photoshop CC 2015來製作投射光效果,一起來看看如何製作吧! ※本教學使用版本Adobe Photoshop CC 2015 ※本教學需先對工具使用有基本認識   1. 置入要修改的照片 2. 先將照片修暗,調整 亮度/對比 3. 調整 色彩平衡 4. 調整 色相/飽和度 5. 複製燈塔中發光的區域 6. 調高亮度與色彩平衡 7. 使用橡皮擦將邊緣修飾 8. 複製出相同圖層,製做更亮的區域 9. 調高亮度/對比 10. 使用橡皮擦修飾 11. 複製剛剛做好的圖層,來做光暈部份 12. 將兩圖層合併 13. 使用高斯模糊 14.

使用SelectBoxIt.js自訂你的下拉選單

CSS無法影響下拉選單展開的選項,如果希望自訂選項的樣式,我們需要使用一些外掛來改變下拉選單的結構,SelectBoxIt.js就是其中的一個選擇。 SelectBoxIt.js 的使用非常簡單、只要跟著底下的步驟就可以了。   引入 CSS files 底下是SelectBoxIt.js 的四個樣式、只要挑一個來用就可以了。當然您也可以使用您自己的CSS樣式。 預設CSS <link type="text/css" rel="stylesheet"

Google 發佈最新的網路搜尋分析指標

網路分析指標中的「排名指標」(positions)已非各家臆測,Google在說明文件中,已經寫下多種分析指標以及案例的定義。 在2016/08/02早上,Google發佈了新的說明文件,定義了多項分析指標的根據,讓你以及眾多網路分析師可以在Google Search Console中找到並閱讀。 特別重視的是對「曝光次數」(Impressions)、「排名」(Positions)、「點擊次數」(Clicks)三項指標的描述。  

如何使用 Varnish 來增加你的網站速度

隨著電子商務的快速成長,網站的瀏覽速度已經是非常重要的一個項目,過慢的顯示速度會讓瀏覽者有不好的體驗,進而影響到他對你的網站評分,如果您網站的速度太慢,甚至會讓網頁跳出率大幅上升,時間久了沒有改善,就沒有人會想再度造訪你的網頁。 今天教大家使用 Varnish 來增加你的網站速度,讓我們一起來看看吧! 關於 Varnish Varnish 是caching的反向proxy、於2006年被釋放出來,它的設計是專門用來改善web-application效率的問題。 Proxy vs 反向 proxy   在一般cache上會碰到的問題

如何修改Google Analytics 網站速度的取樣率

Google Analytics 有個網站速度的功能可以追蹤單一個網頁從點擊連結到在瀏覽器上完整顯示的時間。 在預設的情況下,Google Analytics會固定抽出您使用者的 1%,做為計算網站速度﹙網頁操作時間﹚指標使用的數據。但如果您網站的流量較少、這1%的數據就顯得不夠了。在這種情況下、您可以修改網站速度的取樣率。 如果您使用的是舊版的分析碼 (ga.js) 那麼就要在_gaq.push();之前加上修改取樣率的設定 _gaq.push(); _gaq.push();   如果您使用的是新版的分析碼analytics.js 修改的方式如下: ga('create',

Windows內建的錄影工具-步驟收錄程式

相信大家都有過遇到求救問題時,該如何表達才能讓技術人員馬上明白問題所在的情況吧!!不管是身為一名QA測試人員,要將所測到的Bug陳述出來,但有些卻很難用文字描述就能表達清楚。又或者是使用者碰到問題時,需要尋求協助解決,比如說在操作過程中不知道哪個環節操作錯誤,導致無法得到所想要的結果等等,這些都不是幾個字或幾句話就能解釋清楚的。 此時如果有實際的操作畫面可以提供給技術人員,那麼技術人員就可以很清楚地知道問題點並加以解決,所以歐斯瑞要為大家介紹Windows內建的錄影工具-步驟收錄程式。步驟收錄程式(Problem Steps