網頁開發

UI Buttons 是個為網頁提供各種可與使用者互動按鈕的網站，每個按鈕範例均有實例展示，遇到合適的還可以直接複製其提供的 HTML 及 CSS 語法，貼到網頁想要使用的位置即可，相當方便，即便是不用，也可以從中學習 CSS 語法，增加自己排版功力。

Transform tools 是一個免費的線上工具，專為轉換用於網頁開發與數據描述格式而設計。例如將 SVG 轉成 JSX、HTML 轉成 JSX、JSON 轉成 TypeScript 或是 JSON 轉 MySQL 及 CSS 轉 TailwindCSS 等。Transform tools 平台目前可以對 SVG、HTML、JSON、JSON Schema、CSS、JavaScript、GraphQL、JSON-LD、TypeScript、Flow 及其他，例如 Markdown to HTML 等。每種主要格式可轉換的格式各有不同，例如：JSON 格式可轉出一個 Create table 的 MySQL Script，免除還要手動的改寫的麻煩。

CSS 是可以用來控制網頁排版的一種語法，多數的網頁開發工具，均有內建的 CSS 編排功能來協助排版，即便是沒有，也可以利用記事本寫出。想要讓自己寫出的 CSS 語法更容易閱讀，在傳輸的過程中檔案能更小，以便加快網頁的呈現速度時，可以來利用 CleanCss 網站所提供的 CSS Formatter and Optimiser 這個可將 CSS 語法格式化與最佳化的線上工具，只需將寫好的 CSS 語法複製並貼上，便能取得經過格式化與最佳化的 CSS語法。

CSS Scanner 是一款極具便利性和直觀性的瀏覽器擴充功能，它能夠直接顯示出網頁上任何 HTML 元素所套用的 CSS 語法，操作上，只需在網頁上滑動滑鼠游標到任意 HTML 元素上，CSS Scanner 就會立即顯示出該 HTML 元素所使用的 CSS 語法及其相關屬性，並讓使用者能夠輕鬆地複製該語法，以供後續使用。

網路上有很多免費的網頁模板可供下載，套用的方式也不複雜，但如要修改其中的版型結構，可能就有點門檻，而我們比較常見的網頁布局有表頭、內容可能區分三、二及單欄式再加上表尾，但不論利用何種版型，如要套用模板，就需要找到相類似的模板，不然就是自己改，太麻煩了。Grid-Generator 這個網站可以讓我們用所見及所得的方式，視覺化的操作網站結構分割、合併、增加、減少、調整區塊大小等，到最後產生該網頁版型的 CSS 樣式表，讓你不論用何種的網頁開發工具，都能輕鬆靈活的套用該 CSS，加快生產力。

不管有沒有接觸過虛擬電腦，現在都是個入門的好時機，微軟提供出結合 IE 各種版本的 Windows XP 及 Vista 作業系統的虛擬硬碟，只要下載也是微軟免費提供的 Virtual PC，掛載上去滿上就可以使用，不用在像以前要使用虛擬電腦就要像安裝新電腦的作業系統一步步的安裝起。雖說微軟提供 Internet Explorer Application Compatibility VPC Image 主要是提供網頁設計師與網頁開發人員測試所開發的網站在舊版本的 Internet Explorer 中，來調整相容性，但對一般的使用者而言，卻可體驗虛擬電腦的實用與方便性。

在各大瀏覽器的功能中均有提供檢視網頁原始檔的工具，在 Internet Explorer 9 瀏覽器版本裡也有提供開發者工具，可供網頁開發人員在開發網頁時檢視、分析網頁的正確性，其中的[檢視網頁原始檔]的預設工具原本都是以記事本為主，在 IE 9 改為網頁 HTML 方式來檢視，若是不習慣時，在 IE 9 是可以自訂檢視原始檔的預設工具。

Tailwindgen 這個網站則是提供 Columns、Rows 及 Gaps 三個參數快速產生基礎網格後，再讓使用者依據需求使用滑鼠拖曳出想要的網頁布局，而每次調整都能即時產出預覽網格，最後可以產生 JSX 或 HTML Code，直接複製就可以貼到應用 Tailwind CSS 框架的網頁，相當方便。

瀏覽網頁的裝置，早已不再限定是電腦，越來越多的用戶，還會選擇平板或手機，因此，對於網頁開發人員來說，網頁的設計，就必須考量多種裝置在不同解析度所要呈現的網頁內容，對開發來說可能不是問題，反倒是測試比較麻煩，所幸 Google Search Console 有提供「行動裝置相容性測試」網站，讓測試人員只需輸入網址，就能測試所開發網頁，在行動裝置上顯示的樣貌，進而節省網頁上線時間。

Chrome、Firefox、Safari、IE、Edge...等網際網路瀏覽器，各有各的不同特色與介面，就看用戶自己需求與習慣，對於想要將網站或上傳的圖片套上不同瀏覽器的外觀，以前，你可能需要在電腦安裝各家的瀏覽器，現在，只需要透過 BrowserFrame 這個網站，輸入網址或上傳圖片，就能套用 Chrome、Firefox、Safari、IE、Edge，有些還幫你區分是 Windows 作業系統，還是 Mac OS。