Front-end Design
網站切版
行動裝置的普及因此有良好的行動版網頁提供友善的瀏覽畫面,才能提升使用者好感度進而增加消費者的停留在網站的時間及互動率。所以您有好想法也有設計稿,我們可以成為您的切版師將畫面轉為 AWD(Adaptive Web Design)多套 css 或是 RWD (Responsive Web Design) css 一套用到底,有人說 AWD 對於 SEO 不友善但這兩種寫法絕對好與壞最重要的是建站的目的,畢竟採用 RWD 其建置速度較快維護也方便,但對於需簡化的手機介面資訊或許 AWD是個不錯的選擇,而我們也提供協助規劃ux及ui的友善瀏覽模式。
設計規範
*.ai (向量檔)須附簡單的說明文件或 Figma免附說明文件,但有其「特別性」仍須附說明文件,例如:特定色調的編碼。而若沒特別說明手機設計稿,將以 RWD 特性來呈現畫面。並請務必確認畫面字級單位是要以 px 或是 rem ,目前主流是以 rem 為單位。
設備資訊
切版原則是以原始的切版設定為主,何謂”原始”?例如:電腦和瀏覽器沒有設定放大此為一般模式定義為100%的設計模式。不同設備同樣的RWD畫面會有不同的呈現,尤其是小筆電在畫面的呈現高度有視覺影響,加上瀏覽器在支援效果也會不同。
請企業主提供主要使用設備品牌、尺寸、設定(畫面解析度)等設備資訊。
基礎版型
第一步驟確認後將先行製作畫面的「天地版」為上方選單和下方版權(內頁基礎版型),此天地版」注意在於〝選單〞字元是否過多影響手機板”漢堡選單”呈現,確認無誤後即刻進行內頁的內容切版。有時會有過多的表單無法壁面時就會於手機板呈現水平軸。