昨篇已介紹data-*基本介紹，這篇介紹data於bootstrap上的使用 關於提示框，其實工作上真的會用到，但以前都用手刻，沒仔細看bootstrap居...
大綱 要切版前當然是要先來建立環境，所以我們下一篇再來做客製化！那環境要怎麼建立？其實還蠻簡單的！只要跟著下面的步驟去做，很快就會上手啦！不過先說明一下，這篇文...
大綱 前面已經把Landing Page的設計稿設計完成了，接下來要開始切版實作！但在切版前，我們需要把設計稿上的數據都先列出來，因為切版前要先做客製化的設定唷...
設計大綱 Landing Page的主要色都偏深色，另外CTA也有用主要色作為背景顏色了，所以這邊的Footer就決定用淺色的Secondary-color來作...
設計大綱 設計CTA的用意一方面是讓結尾不會來得太突然，另一方面是想在網頁的最後再來一個「Call To Action」。 由於上面已經有蠻多不同樣式的設計區塊...
本篇要延續DataTables介紹，如何引用拓展包呈現響應式版本 好心建議要先看: 第11車廂-table界的神器!DataTables介紹篇(1)...
延續上篇<第11車廂-table界的神器!DataTables介紹篇(1)>，今日再介紹其他參數設定 好的!延續上篇<第11車廂-tabl...
設計大綱 昨天設計的「方案」區塊的背景設計是單純一個長方形＋背景顏色＋陰影。今天想來做點不一樣的，所以來寫個「進階挑戰」。這一個挑戰主要打算修改「方案的背景框」...
設計大綱 今天要來設計「方案」，外面的網站通常會有3個方案供使用者選擇。另外如果要吸引使用者註冊的話，那通常會有一個是「免費試用」方案讓使用者試用，從而引導使用...
設計大綱 在上一篇設計「Reviews」這個區塊時，有提到切版時可能會有「切不出來」的情況發生，所以只好把原本腦海裡想要的設計改成簡單兩行的卡片式去呈現。但是！...
設計大綱 原本想把Reviews做成一行六個、並且可以超出視窗，另外使用者可以用拖曳的方式去移動卡片。但看完Boostrap 5的官網，目前好像沒辦法切出超出視...
設計大綱 一個平台要成功，當然少不了圖片/照片的介紹（很愛看圖的懶人XD），所以接下來要設計一個區塊 —— 專門輪播「使用平台的過程照片」。Bootstrap...
設計大綱 稱讚完平台的優點後，接下來的區塊就要向使用者介紹使用的流程，但因為現代人都很懶得看很冗長的「說明書」，所以使用流程會採用簡約的方式去做介紹。 因為上面...
設計大綱 上一個區塊賣完小廣告後，今天馬上就給它塞個平台的優點進來，這樣可以讓使用者有「感同身受」的感覺，同時也能讓他們覺得「哇！好像真的很棒唷！」。 「優點」...
設計大綱 上一個區塊設計了使用者的「痛點」，因此接下來的區塊想要做一個「平台的小廣告」，讓使用者了解到我們這個平台可以幫助他們解決問題。由於上一個區塊並不是滿版...
設計大綱 早安！今天來設計痛點，這邊我想要做三欄式，列出三個他們目前主要可能會遇到的問題，再加上圖片，讓使用者有感到身受的感覺。另外，因為Grid system...
製作網站前，通常需要找尋相關設計靈感，有時候想破頭就是沒想法，素材對網頁內容來說很重要，好不容易找到了不錯的素材，大部分都是有著作權，不能直接使用，以下是我常逛...
設計大綱 上一集設計完header的滿版背景後，今天會設計Navigation bar。Navbar在網頁來說也是蠻重要的一個元件，通常會有LOGO、常用按鈕或...
設計大綱 今天來設計Landing page的header。這次想要做的是一個滿版的header，在header裡面會有標題、內容、以及input（提供使用者填...
什麼是好的網站設計？ 使用者使用網站時是否容易操作及有良好的動線，避免過多不必要的元素，讓使用者快速找到資訊。避免過多的動畫或圖片，導致載入速度變慢，間接影響到...
簡介 今天會講一下在設計前要怎麼建立環境，畢竟在設計前還是要先備好畫布嘛，但畫布的尺寸要怎麼挑選呢？所以下面會簡單講一下怎麼根據瀏覽器的尺寸和Bootstrap...
前言 在開賽前，先來做個小小的自我介紹好了！目前是火箭隊的網頁設計組，加入火箭隊前有上過六角學院的UI課程（上課前完全是0基礎 ><!!!），但卻從...
區塊元素(block) 預設為區塊元素的標籤有：h1~h6,p,div,section,header,nav等等… 會造成「換行的標籤(元素)」 可以設定「w...
承上篇 CSS 小筆記 漸變(淡入淡出)：CSS屬性 秒數 速度曲線範例code如下： .g-100 { filter: grayscale(100%)...
網站上線後，開始接觸網站經營相關的資訊時，才發現經營網站沒那麼簡單？ 網站最重要的工作就是招攬潛在客戶，卻有很多網站在上架後，都是站在原地等顧客上門，也因此各式...
隨著行動瀏覽成為搜尋引擎主流，響應式網頁設計也越來越重要，甚至能說在這幾年，假設你的網頁沒有響應式設計，或是響應式網頁設計不良，那你的網頁流量可謂十分不妙。 然...
簡單架設 x 不失質感 目錄 源起 : 開發者網站 開發工具 : Adobe Brackets 基礎的 html 與 css 語法 Bootstrap 前...
如果你沒有IT背景，但又想開展網頁設計的職業生涯，這篇文章可能會適合你。 這篇文章會告訴你： 我自己親身的入行經歷 零背景，在「網頁開發」這行業接Freela...
Day 30 - 這不是篇完賽廢文，我是認真發完最後一天!! 今天這篇其實是一直想做的整理拉，因為前面有寫到【第 22 個第一次】如果想找廠商做網站，我應該些準...
Day 28 - 你們服務項目有 Prototype，通常會位於流程的哪一階段呢? 在目前短暫的在外的拋頭露面當中，在 Prototype 這邊我都會多分享一些...
切版姐姐
烙詩
sunny
a841722
Jade Chang
iThome鐵人賽
看影片追技術