<table><tbody>
除了乾貨，其它什麼也沒有
職場
數據
新媒體
設計
極客
本文教學內容由「奇點新媒體研究中心」的琪音（上海大學成員）撰寫，視頻則是計老師講授的高階排版入門方法論。相關課程為 JZ 的知識付費視頻，每期可通過支付 ¥9.9 的小額費用收看學習。
工具準備
工欲善其事必先利其器。很多品牌運營人經常閱讀我們的教程卻遲遲不下手，往往是沒有獲取到合適的工具開始實踐。
SVG相關知識涉及前端開發，需要前端開發編輯器，比如 sublime Text、Adobe Dreamweaver、Notepad++。微信後臺編輯需要瀏覽器，推薦可以查看查看源碼和檢查網頁元素的Chrome 瀏覽器，還有一些設計類軟件，如 Adobe Photoshop、Adobe Illustrator 等等。
那麼具體下載哪款？又怎麼使用？我們來了解。
❶ PS&AI
先從最熟悉的軟件開始，我比較喜歡拍照，所以較早接觸了 LR、PS 來後期，Adobe Illustrator 的使用和 PS 很類似，但本質上有很大的不同。
矢量圖和位圖
左為矢量圖，右為位圖
位圖很常見，我們手機裡的照片都是位圖，常見格式為 .jpg、.png、.gif、.tif、.psd等。位圖是由一格一格的像素所構成的，每塊代表一個純色像素點，所以顏色豐富逼真，但位圖清晰程度依賴於分辨率，分辨率小，圖像會模糊。
矢量圖沒有像素限制，可以無限放大，而且佔空間小。常見格式為 .eps、.ai、.svg，AI 是標準的矢量圖軟件。
在 PS 裡，將矢量圖轉換為位圖的操作叫做柵格化。在 AI 中，將位圖嵌入，選擇圖像臨摹，擴展即可轉為矢量圖。
導出形式SVG文件
SVG文件中文字元素可以選擇直接輸出，也可以輪廓化轉為路徑。具體內容可見【教程】SVG入門基礎筆記1.3，圖片最好是轉為矢量圖，保證清晰，以嵌入形式，代碼量也不會特別大。
Sublime Text
Sublime Text官方網站提供了各系統各版本的下載，雖然是一個收費閉源軟件，不過不購買也足夠使用。
點擊獲取 SVG 代碼後，可以複製粘貼到 Sublime Text 中，以 .html 格式保存網頁到桌面，當添加動畫後，可以刷新網頁直接查看交互效果（當然如果你有時間，也可以配置一下自動刷新功能）。記得用 Chrome 瀏覽器打開網頁，這樣保持同步，確保導入到後臺沒有問題。
Adobe Dreamweaver
Adobe系列中用於網頁製作和管理網站於一身的所見即所得的網頁代碼編輯器。在DW的主頁面中，有代碼、拆分、實時視圖三個選項，選擇拆分，可以更好的看到代碼與它的圖形界面。
後來棄用 DW，主要原因是同時打開 PS、AI、DW，電腦實在卡的厲害...很氣。
❸ Chrome 瀏覽器
在代碼編輯器中完善好代碼，測試好後，就可以導入到後臺。如果是比較簡單的可以利用 135 編輯器或者 i排版，點擊 html 按鈕，將代碼複製粘貼過去，然後回到樣式頁面，依舊複製粘貼到後臺。這種直接複製粘貼樣式的操作有時候會引起一些問題。
所以，介紹另外一種專業級（JZ 團隊所使用）的方式。打開 Chrome 瀏覽器開發者工具，編輯網頁，將代碼導入進去。
如何使用開發者工具？
快捷鍵：
win—F12/Ctrl+Shift+I
Mac—command+Opt+I
打開後選擇左上方按鈕，在圖文區域選擇要查看代碼的位置。然後進行修改、添加等操作。
擴展程序
擴展程序是可以增加、增強Chrome瀏覽器功能的一些小程序，與微信編輯有關的有壹伴插件、新媒體管家等等。可以幫助你一鍵排版、快速添加樣式。
❹ Markdown
忘記是什麼原因，可能因為懶，可以因為 Mac 的控制面板很順手。我在開始有自己的筆記本後，幾乎就沒有使用過鼠標，不過現在它年事已高，給它配備了 Wacom 的入門級數位板。
懶是能促進文明發展的，如果要編輯的文章類型大置相同，那最好就都用一個樣式。清晰明確，簡潔，所以排版方式越簡單越好，越快越好。然後，我就被安利了Markdown。
Markdown是一種輕量級標記語言，它可以用簡介的語法代替排版。它的格式語法很簡單。如下圖▼
如果不追求排版華麗的話，一篇文章寫下來幾乎是可以鍵不離手。用Markdown編輯好文章後，可以利用 Chrome 瀏覽器的 markdown here 插件一鍵渲染，完美！
在學習 LINUX 系統的時候，還接觸了 Vim，它是文本代碼編輯器，最大的特點就是使用鍵盤命令進行編輯。Vim 可以和 Markdown 結合使用，目前還在研究中。
關於代碼編輯器，一開始學 Python 的時候，老師推薦了 Visual stadio code，後來沒有用，用的 pyCharm，如果有接觸其他編輯器再介紹。
話說，一開始看代碼頭疼的不行，甚至妄想找個程序猿小哥哥來做男朋友。那麼，首先你得稍微懂一點點，才能有話題，對吧。然後，就開始認真看，然後就沒有然後了...不得了，感覺自己要成為程序媛了...
-END-
閱讀更多 JZ多媒體解決方案 的文章
