上網衝浪是現代人人具備的技能，您是否曾在某些商業網站看過一些炫酷異常的動畫？就拿Apple（台灣）的官網來舉例，隨便點選進入它們任意商品的頁面，往下滑動，便會有...
今天來説說切版時主要用到的技術之一：HTML5。HTML最為人熟知的就是，常用於設計網頁、行動裝置、應用程式等介面設計，網頁瀏覽器能讀取HTML並轉譯成視覺化網...
※這裡看上一篇文章↝ [DAY1]網頁設計與實作使用工具介紹 好久不見（因為最近比較忙加上設計稿一直沒處理好所以現在才更新之後可能也沒辦法按時更但我會慢慢做完的...
上一篇中，我們淺談了JavaScript的基礎，但想要更加深入JS的領域，光有基礎的概念是遠遠不夠的。因此，本篇將為您借紹JS中的最受歡迎的元老級插件 ── j...
嗨～接下來要開始進入切版了，開始切版前，有些必須知道的知識必須了解。之後切版會使用VSCode來做程式撰寫，今天先帶大家認識VSCode這個強大的前端開發軟體吧...
在前面的七篇中，我們講解了構成網頁設計的基礎要素：CSS。但這遠遠是不夠的，CSS只能賦予網頁靜態的美術效果與資訊展示。然而，我們對現代網站的期望通常都具備動態...
終於來到第10天啦！今天再接再厲！網頁設計過程中，其實是很大的工程，往往都不是一天就能完成，今天就要來推薦一些網路上好用的工具、網站，適當配合能夠減少許多不必要...
在前幾日中，我們總共講解了六篇CSS的基本屬性，內容之多，但都僅是蜻蜓點水的帶過而已，可見CSS的上限非常之高，學習它必然是一段漫長之路。 以前在設計網頁時，我...
今天是最後一天的Figma教學，前面幾天介紹了Figma，並以Wireframe為例說明了主要功能的使用方法，應該都有感受到Figma的操作有多簡易、方便了吧！...
擷自 digitalsynopsis.com 在前面的篇章中，我們學習了如何撰寫CSS的各個屬性來設計出精美的網頁，但您是否有想過：「用電腦設計出來的網頁，為...
在上一篇中，我們提到了CSS中，快速排版向的屬性：display: flex 。但有時，flex並不適用於較小且單一的元件，也無法協助我們更精細地刻出我們所想要...
第八天！今天要繼續Figma教學，接下來會先設定好視覺稿尺寸，再依據前面繪製的Wirefame並結合在Day4確定下來的網站風格、用色，忘記的可以回去複習。Da...
影片教學 重點回顧 昨天的教學影片當中，我們了解如何轉寫CSS來套用到指定的選擇器當中，而昨天我們使用HTML的元素作為選擇器來套用，今天將要介紹其他選擇器，...
嗨大家好，前面幾天內容有點多，今天來談談比較輕鬆的。Figma有許多強大的功能之外，也有許多神人提供插件，可以更多樣、方便製作想呈現的效果，這邊來介紹幾個我常用...
在本篇中，我們將介紹CSS中的flex。如同它的名字flex般，這個屬性非常具有彈性，有著能夠適應各個網頁縮放比例的自適應能力，可以說是我們在做網頁設計中的排版...
網站設計工具 - Figma Figma是一個非常流行的設計和協作工具，特別適用於設計師和團隊。它允許使用者創建、共享、評論和協作設計項目。以下是對Figma...
嗨～從今天開始就是Figma教學了！不知道大家對網頁設計是否有初步的概念了呢？今天會簡單介紹Figma及基本操作方法，再用穿插教學的方式帶著大家使用Figma繪...
在上一篇中，我們學習了如何選擇並指定我們所需的元件並對其進行客製化。本篇我們來將淺談一些CSS基本、又好用的樣式，了解這些屬性，保證能讓您在網頁設計上更加得心應...
到Day5啦！已經到個小段落了，那就再說明一下，這次的挑戰是以我的作品集為範例，分享給大家RWD靜態網站從頭到尾的製作過程，希望過了這30天你也能創造屬於自己的...
本篇文章中，將講述CSS的基本的使用方法。在此之前，我們要先了解甚麼是CSS？ 什麼是CSS？ CSS（層疊樣式表，Cascading Style Sheet...
在上一天篇的貼文中，想必你各位都已經把環境給設置好了吧。是不是迫不期待想開發一個屬於你的網頁了呢？別急，就讓我們開始吧！ 首先，想要學習網頁，必須要先認識 HT...
有了靈感以後，就要開始規劃網站要放入什麼內容啦！每個人的方式不太一樣，可以善用「5W1H」來思考，也就是Why、What、Where、When、Who、How，...
建立網站時，選擇適當的主機和設計軟體是一個重要的步驟。本文將指導你如何選擇最適合自己的WordPress主機和設計軟體。 首先，需要了解什麼是WordPress...
俗話說的好：「工欲善其事，必先利其器。」這句格言在各個領域都有著深刻的意義。 好比如，在寫作業的時候，先整理桌面和環境，可以使我們的思緒更加清晰，以提升工作效率...
做任何事一開始總是最困難的，做網站也一樣，當不知道從何開始時，會很需要一些靈感來激發自己的創意，所以可以養成在日常生活中常常留意看過的設計、網站等等，將喜歡內容...
所謂：「知己知彼，百戰不殆。」，在設計一個網頁之前，先充分了解其外部的各項特性，才能避免在實作時因千萬頭緒使您一時無從下手，而陷入窘境。 因此，本篇將為您介紹在...
前一篇有簡單介紹自己、參賽原因及提及主題今天要來說明這次主題的大綱及預計會有的內容，首先先提供作為範例的我的線上作品集參考。那就開始吧！Luna的線上作品集 使...
教學影片 網頁前端三巨頭 說到網頁前端，一定會聽到及碰到這三種語言，分別是：HTML,CSS以及JavaScript，而這三者對於網頁前端的地位簡單比喻可以如...
雖然不小心錯過了鐵人賽的報名，還是希望可以利用此機會複習過去所學內容並養成學習的習慣，因此這邊將利用30天的時間，從製作設計稿開始，一步一步做出自己設計的網頁，...
在現今的數位時代，無論何時我們都能夠輕鬆地打開手機或電腦，即時連接並接收到全球資訊和社交網路。這種網路的可及性已經深深地融入至我們的日常生活，可以說，網路徹底地...
ttdragon0722
luna0228
Ericostco
pellok
iThome鐵人賽
看影片追技術