{"id":10556,"date":"2020-10-22T20:18:22","date_gmt":"2020-10-22T12:18:22","guid":{"rendered":"https:\/\/ihower.tw\/blog\/?p=10556"},"modified":"2025-07-04T08:07:26","modified_gmt":"2025-07-04T00:07:26","slug":"refactoring-ui","status":"publish","type":"post","link":"https:\/\/ihower.tw\/blog\/10556-refactoring-ui","title":{"rendered":"Refactoring UI \u8b80\u66f8\u6458\u8981"},"content":{"rendered":"\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2021\/06\/book-cover-sm.png\"><img loading=\"lazy\" decoding=\"async\" width=\"824\" height=\"962\" data-attachment-id=\"10730\" data-permalink=\"https:\/\/ihower.tw\/blog\/10556-refactoring-ui\/book-cover-sm\" data-orig-file=\"https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2021\/06\/book-cover-sm.png\" data-orig-size=\"824,962\" data-comments-opened=\"1\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"book-cover-sm\" data-image-description=\"\" data-image-caption=\"\" data-medium-file=\"https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2021\/06\/book-cover-sm-257x300.png\" data-large-file=\"https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2021\/06\/book-cover-sm.png\" src=\"https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2021\/06\/book-cover-sm.png\" alt=\"\" class=\"wp-image-10730\" srcset=\"https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2021\/06\/book-cover-sm.png 824w, https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2021\/06\/book-cover-sm-257x300.png 257w, https:\/\/ihower.tw\/blog\/wp-content\/uploads\/2021\/06\/book-cover-sm-768x897.png 768w\" sizes=\"auto, (max-width: 824px) 100vw, 824px\" \/><\/a><\/figure>\n\n\n\n<p><a href=\"https:\/\/refactoringui.com\/book\/\">Refactoring UI: The Book<\/a> \u883b\u4e0d\u932f\u7684\u4e00\u672c PDF \u5c0f\u66f8\uff0c\u8b1b\u7db2\u9801\u7684 UI \u8a2d\u8a08\u3002\u7279\u5225\u662f\u524d\u5e7e\u7ae0\u8b1b Hierarchy, Layout, Text \u7684\u90e8\u5206\uff0c\u5de5\u7a0b\u5e2b\u4e5f\u5f88\u9069\u5408\u4e86\u89e3\u4e00\u4e0b\u3002<\/p>\n\n\n\n<!--more-->\n\n\n\n<h2 class=\"wp-block-heading\">Starting from Scratch<\/h2>\n\n\n\n<ul class=\"wp-block-list\"><li>\u5148\u6c7a\u5b9a\u597d\u529f\u80fd\u3001\u518d\u756b\u5716<\/li><li>\u5148\u756b\u8349\u5716\uff0c\u7d30\u7bc0\u4e4b\u5f8c\u88dc<\/li><li>Agile way \u8a2d\u8a08<\/li><li>\u9078\u64c7 Personality: \u5b57\u578b\u3001\u984f\u8272\u3001\u5713\u89d2\u3001\u8a9e\u8a00<\/li><li>\u9078\u64c7\u8981\u6709 system \u9650\u5236\uff1a\u984f\u8272\u3001\u5927\u5c0f\u2026etc<\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">Hierarchy<\/h2>\n\n\n\n<ul class=\"wp-block-list\"><li>\u5143\u7d20\u7684\u968e\u5c64\u5f88\u91cd\u8981\uff0c\u9664\u4e86\u7528\u5927\u5c0f\u4e4b\u5916\uff0c\u9084\u6709\u5f88\u591a\u65b9\u5f0f\u53ef\u4ee5\u770b\u51fa\u6709\u968e\u5c64<\/li><li>font-weight \u8ddf\u984f\u8272\uff0c\u4f8b\u5982 \u4e3b\u5167\u5bb9\u6df1\u8272\u3001\u6b21\u5167\u5bb9\u7070\u8272\u3001\u66f4\u6dfa\u7684\u7070\u653e\u7b2c\u4e09\u5c64<\/li><li>\u6709\u984f\u8272\u7684\u80cc\u666f\u4e0a\uff0c\u4e0d\u8981\u7528\u7070\u8272\u5b57\uff0c\u61c9\u7528\u80cc\u666f\u8272\u7684\u6dfa\u8272\u7248\u4f86\u505a \u6b21\u5167\u5bb9<\/li><li>\u8981\u52a0\u5f37\u7684\u5167\u5bb9\uff0c\u9664\u4e86\u672c\u8eab\u984f\u8272\u6216\u5927\u5c0f\u4e4b\u5916\uff0c\u4e5f\u53ef\u4ee5\u5f31\u5316\u5176\u4ed6\u90e8\u5206\uff0c\u4f8b\u5982 tabs \u8b8a\u6dfa<\/li><li>\u8cc7\u6599\u4e0d\u4e00\u5b9a\u90fd\u9700\u8981\u6709 label \uff0c\u5982\u679c context \u672c\u8eab\u6216\u52a0\u4e0a\u53e5\u5b50\u5c31\u4e0d\u9700\u8981\u4e86\u3002\u4f8b\u5916\u662f\u5728\u898f\u683c\u8868\u4e0a\u5247\u9700\u8981 label\u3002<\/li><li>h1 \u4e0d\u4e00\u5b9a\u8981\u6700\u5927\uff0c\u8981\u770b app \u7684\u9700\u6c42<\/li><li>weight \u8ddf \u5c0d\u6bd4\u7684\u5e73\u8861: icon \u901a\u5e38\u6c92 weight\uff0c\u53ea\u80fd\u964d\u4f4e\u5c0d\u6bd4\u3002\u5321\u7dda\u82e5\u6dfa\u8272\u592a\u4e0d\u660e\u986f\uff0c\u53ef\u4ee5 weight \u7c97\u4e00\u9ede<\/li><li>\u6309\u9215\u8a2d\u8a08: \u6b21\u8981\u6309\u9215\u53ef\u7528\u4f4e\u5c0d\u6bd4\u984f\u8272\u3001\u4e0d\u91cd\u8981\u6309\u9215\u53ea\u7528\u9023\u7d50\u5c31\u597d\u4e86<\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">Layout &amp; Space<\/h2>\n\n\n\n<ul class=\"wp-block-list\"><li>\u7559\u767d\u5f88\u91cd\u8981\uff0c\u79d8\u8a23\u662f\u5148\u591a\u7559\u7a7a\uff0c\u518d\u780d\u7a7a\u767d\u3002\u800c\u4e0d\u662f\u5148\u4e0d\u7559\u767d\uff0c\u518d\u52a0\u7a7a\u767d<\/li><li>spacing \u8981\u6709\u7cfb\u7d71: 4,8,12,16,24,32,48,64,96, 128,192,256,384,512,640,748<\/li><li>\u4e0d\u9700\u8981\u586b\u6eff\u6574\u500b\u87a2\u5e55\u3002\u5982\u679c\u5167\u5bb9\u5c31\u6c92\u9019\u500b\u591a\uff0c\u4e0d\u5982\u5167\u5bb9\u5c31\u9650\u5236 max-width\uff0c\u9019\u6a23\u6bd4\u8f03\u597d\u95b1\u8b80\u3002hedaer \u6c92\u95dc\u4fc2\u4ecd\u53ef\u4ee5 full-width<ul><li>\u4e5f\u53ef\u4ee5\u7528 RWD \u96d9\u6b04\u8a2d\u8a08<\/li><\/ul><\/li><li>Grid \u7cfb\u7d71\u4e0d\u662f\u842c\u80fd\uff0c\u4f8b\u5982\u5074\u6b04 sidebar \u5167\u5bb9\u5c31\u6c92\u9019\u500b\u591a\uff0c\u61c9\u8a72\u56fa\u5b9a\u5bec\u5ea6\uff0c\u800c\u4e0d\u662f\u7528\u6d6e\u52d5<\/li><li>\u5143\u7d20\u7684\u5927\u5c0f\u5728\u684c\u6a5f\u3001\u624b\u6a5f\u4e0a\u4e0d\u662f\u6bcf\u500b\u90fd Scale \u4e00\u6a23\u7684\u3002\u4f8b\u5982\u6a19\u984c 2.5em \u5728\u684c\u6a5fOK\u3001\u624b\u6a5f\u4e0a\u5c31\u592a\u5927\u4e86\u3002\u6309\u9215\u5927\u5c0f\u8ddf\u88e1\u9762\u7684\u5b57\u578b\u5927\u5c0f\u4e5f\u6709\u4e00\u6a23\u7684\u8003\u91cf\u3002<\/li><li>\u7528\u4e0a\u4e0b\u7559\u767d\u4e0d\u540c\u4f86\u5340\u9694\u5167\u5bb9<\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">Text<\/h2>\n\n\n\n<ul class=\"wp-block-list\"><li>\u6587\u5b57\u5927\u5c0f\u8981\u6709\u7cfb\u7d71\uff0c\u5efa\u8b70 12, 14, 16, 18, 20, 24, 30, 36 ,48 ,60, 72px<ul><li>\u4e0d\u8981\u7528 em \u4f60\u6703\u5f97\u5230\u5c0f\u6578px\uff0c\u7528 px \u6216 rem\uff0c<\/li><\/ul><\/li><li>\u6587\u7ae0\u7684\u6587\u5b57\u5bec\u5ea6\u8981\u9650\u5236\uff0c\u5efa\u8b70 20-35em (45~75 characters)\u3002\u5373\u4f7f\u6587\u5b57\u6df7\u8457\u5716\u7247\u6216\u5176\u4ed6\u5143\u4ef6\u4e5f\u4e00\u6a23\u3002<\/li><li>\u5b57\u578b\u5927\u5c0f\u4e0d\u540c\u7684\u6587\u5b57\uff0c\u61c9\u7528 baseline \u5c0d\u9f4a<\/li><li>line-height \u884c\u9ad8\u6709\u6bd4\u4f8b\u7684\uff0c\u4e00\u822c\u4f86\u8aaa\u662f 1.5\uff0c\u4f46\u4e0d\u662f\u7d55\u5c0d\u7684\uff1a<ul><li>\u5167\u5bb9\u6bd4\u8f03\u5bec\u3001\u53ef\u4ee5\u8003\u616e\u7528 2 \u500d<\/li><li>\u5b57\u578b\u5927\u5c0f\u8d8a\u5c0f\uff0c\u5247\u9700\u8981\u5927\u4e00\u9ede\u4f8b\u5982 1.75 \u4f86\u8b93\u773c\u775b\u80fd\u770b\u5230\u3002\u5982\u679c\u5b57\u5f88\u5927\u4f8b\u5982\u6a19\u984c\uff0c\u5247 1 \u500d\u5c31\u5920\u6e05\u695a\u5340\u9694\u4e86<\/li><\/ul><\/li><li>\u4e0d\u662f\u8aaa\u9023\u7d50\u90fd\u9700\u8981\u6709\u984f\u8272: \u5728\u5e7e\u4e4e\u6bcf\u500b\u90fd\u53ef\u4ee5\u9ede\u7684\u5167\u5bb9\u4e4b\u4e2d\uff0c\u53ef\u4ee5\u7528\u4e0d\u540c\u5b57\u578b\u3001\u6df1\u4e00\u9ede\u7684\u984f\u8272\u3001\u6216\u662f\u4e00\u9ede weight\u3001\u6216 underline\u3001\u6216 hover \u8b8a\u8272\u6216 underline \u5373\u53ef<\/li><li>\u6587\u5b57\u5c0d\u9f4a\u4e00\u822c\u662f \u7f6e\u5de6<ul><li>\u7f6e\u4e2d\u5c0d\u6a19\u984c\u6216\u77ed\u5b57\u5f88\u597d\uff0c\u4f46\u9577\u6587\u7ae0\u4e0d\u8981\u7f6e\u4e2d\u3002\u9084\u662f\u60f3\u8981\u7f6e\u4e2d\u7684\u8a71\uff0c\u53ef\u4ee5\u628a\u5b57\u6539\u77ed\u5230\u5169\u884c\u3002<\/li><li>\u6578\u5b57\u8981\u7f6e\u53f3<\/li><li>\u6a21\u4eff\u5370\u5237\u8a2d\u8a08(\u96dc\u8a8c\u3001\u65b0\u805e\u7b49)\u7684 justified text \u8981\u7528 hyphenate\uff0c\u4e0d\u7136\u6703\u7559\u767d\u6703\u5f88\u5947\u602a<\/li><\/ul><\/li><li>Letter spacing \u6587\u5b57\u9593\u8ddd\u3002\u901a\u5e38\u5b57\u578b\u8a2d\u8a08\u7684\u6642\u5019\u6709\u504f\u597d\u9069\u5408\u6a19\u984c\u6216\u5167\u6587\u3001\u539f\u672c\u9069\u5408\u5167\u6587\u5b57\u578b\u62ff\u4f86\u653e\u6a19\u984c\uff0c\u6703\u592a\u5bec\uff0c\u8981\u8abf\u5c0f<ul><li>\u539f\u672c\u9069\u5408\u6a19\u984c\u7684\u5b57\u578b\uff0c\u901a\u5e38\u4e0d\u9069\u5408\u5167\u6587\uff0c\u5373\u4f7f\u8abf\u5927\u9593\u8ddd<\/li><li>\u5168\u90e8\u5927\u5c0f\u7684\u5b57\uff0c\u6587\u4ef6\u9593\u8ddd\u9069\u5408\u5927\u4e00\u9ede<\/li><\/ul><\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">Color<\/h2>\n\n\n\n<ul class=\"wp-block-list\"><li>Hex, RGB \u5e38\u898b\uff0c\u4f46\u63a8\u85a6\u7528 HSL<\/li><li>\u5149\u9760 color palette \u9078\u5e7e\u500b\u984f\u8272\u662f\u4e0d\u5920\u7684\uff0c\u4f60\u9700\u8981\u5f88\u591a\u984f\u8272\uff0c\u5206\u6210<ul><li>\u7070\u8272\uff0c\u7528\u5728\u6587\u5b57\u3001\u80cc\u666f\u3001\u8868\u55ae\u7b49\u7b49: 8-10 \u7a2e<\/li><li>\u4e3b\u8272\u8abf: 1~2\u7a2e\uff0c\u6df1\u6dfa 5-10\u7a2e\uff0c\u7528\u5728 active \u5c0e\u89bd\u5143\u7d20\u3001overall look<\/li><li>\u5f37\u8abf\u8272: \u9ec3\u8272\u3001\u7c89\u7d05\u3001\u85cd\u7da0\u8272 \u4f86\u5f37\u8abf\u522a\u9664\u3001\u7dca\u544a\u3001\u6210\u529f\u8a0a\u606f<\/li><\/ul><\/li><li>\u662f\u5148\u5b9a\u7fa9\u597d shades\uff0c\u5148\u627e\u5230\u6700\u6df1\u3001\u6700\u6dfa<\/li><li>\u5225\u8b93\u4eae\u5ea6\u84cb\u904e\u98fd\u548c\u5ea6\u3002\u984f\u8272\u7684\u611f\u77e5\u4eae\u5ea6 != HSL \u7684\u4eae\u5ea6<\/li><li>\u7070\u8272\u4e0d\u4e00\u5b9a\u8981\u7d14\u7070\uff0c\u52a0\u4e0a\u984f\u8272\u98fd\u548c\u5ea6\u6703\u66f4cool<\/li><li>\u89aa\u548c\u529b\u8a2d\u8a08\u4e0d\u4ee3\u8868\u6703\u5f88\u919c<\/li><li>\u4e0d\u8981\u53ea\u4f9d\u8cf4\u984f\u8272\uff0c\u53ef\u4ee5\u52a0\u4e0a icon \u6216\u662f contrast\uff0c\u7167\u9867\u8272\u76f2\u7528\u6236<\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">Depth<\/h2>\n\n\n\n<ul class=\"wp-block-list\"><li>\u5982\u4f55\u8a2d\u8a08\u6d6e\u8d77\u6216\u51f9\u4e0b\u7684\u5143\u7d20<\/li><li>\u7528\u9670\u5f71\u50b3\u9054\u6d6e\u8d77\u8981\u6ce8\u610f: \u5c0f\u9670\u5f71for\u6309\u9215\u3001\u4e2d\u9670\u5f71for dropdown\u3001\u5927\u9670\u5f71 for modal dialog\u3002\u8a2d\u8a08\u9670\u5f71\u7cfb\u7d71\uff0c\u4e94\u7a2e\u5c31\u597d\u3002<ul><li>\u9670\u5f71\u53ef\u4ee5\u642d\u914d\u4e92\u52d5\uff0c\u4f8b\u5982\u7528\u6236\u9ede\u64ca\u6309\u9215\u3001\u62d6\u62c9<\/li><\/ul><\/li><li>\u5169\u5c64\u9670\u5f71\u6548\u679c<\/li><li>flat designs \u4e0d\u7528\u9670\u5f71\u4e5f\u53ef\u4ee5\u5275\u9020\u6df1\u5ea6\uff0c\u7528\u8ddf\u80cc\u666f\u984f\u8272\u7684\u6df1\u6dfa\u5dee\u7570\u3001\u6216\u662f solid \u9670\u5f71\u7dda<\/li><li>\u7528\u5716\u5c64\u91cd\u758a\u7684\u65b9\u5f0f\u4e5f\u53ef\u4ee5\u5275\u9020\u6df1\u5ea6<\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">Images<\/h2>\n\n\n\n<ul class=\"wp-block-list\"><li>\u7528\u597d\u7167\u7247: \u8acb\u5c08\u696d\u62cd\u3001\u6216\u662f\u8cb7\u5716\u5eab<\/li><li>\u5982\u4f55\u62ef\u6551\u8a2d\u8a08\u6a19\u984c\u6587\u5b57\u5728\u5716\u7247\u6642\uff0c\u6587\u5b57\u770b\u4e0d\u6e05\u695a: \u5716\u7247\u52a0\u9ed1\u8272\u534a\u900f\u660e\u3001\u6216\u662f\u964d\u4f4e\u5716\u7247\u5c0d\u6bd4\u3001\u6216\u662f\u55ae\u8272\u8abf\u5716\u7247\u3001\u6216\u662f\u6587\u5b57\u52a0\u9670\u5f71<\/li><li>\u6771\u897f\u6709\u5927\u5c0f : \u4e0d\u8981\u653e\u5927 icon\u3001\u4e0d\u8981\u7e2e\u5c0f screenshot (\u53ef\u622a\u5716 smaller screen \u6216 partial\uff0c\u6216\u662f\u79fb\u9664\u6587\u5b57\u7528\u793a\u610f\u5716)\u3001\u4e0d\u8981\u7e2e\u5c0f icon (for favicon)<\/li><li>\u5c0f\u5fc3\u7528\u6236\u4e0a\u50b3\u7684\u5167\u5bb9: \u63a7\u5236\u5927\u5c0f\u6bd4\u4f8b\u88c1\u5207\u3001\u5c0f\u5fc3 avatar \u80cc\u666f\uff0c\u4f8b\u5982\u525b\u597d\u767d\u8272\u8ddf\u80cc\u666f\u4e00\u6a23 (\u53ef\u52a0\u4e0a box \u9670\u5f71 \u6216\u534a\u900f\u660e\u5321\u7dda)<\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">Touches<\/h2>\n\n\n\n<ul class=\"wp-block-list\"><li>\u53ef\u4ee5\u8b93\u9810\u8a2d\u6a23\u5f0f\u66f4\u6709\u8a2d\u8a08\u611f\uff0c\u4f8b\u5982 bullets \u6539\u7528 icon\u3001blockquote \u52a0\u4e0a quote \u8996\u89ba\u3001\u7279\u5225 link \u52a0\u4e0a\u7279\u5225\u6a23\u5f0f\u3001\u8868\u55ae\u7684 checkbox, radio buttons \u5ba2\u88fd\u5316<\/li><li>\u7528\u7c21\u55ae\u7684\u984f\u8272 border \u5c31\u53ef\u4ee5\u52a0\u5f37\u91cd\u9ede\uff0c\u4f8b\u5982 \u4e0a\u5321\u7dda\u3001active navigation \u7684\u4e0b\u5321\u7dda\u3001\u8b66\u544a\u7684\u5de6\u5321\u7dda\u3001layout \u4e0a\u5321\u7dda\u7b49\u7b49<\/li><li>\u8a2d\u8a08\u592a\u5e73\u7684\u8a71\uff0c\u53ef\u4ee5\u88dd\u98fe\u80cc\u666f\u52a0\u4e0a\u984f\u8272\u6216 patterns \u6216\u7279\u5225\u5716\u7247\uff0c\u7279\u5225\u662f panel<\/li><li>\u8a2d\u8a08 empty state<\/li><li>\u8868\u683c\u5321\u7dda borders \u7528\u5c11\u4e00\u9ede: \u53ef\u7528\u4e0d\u540c\u7684\u80cc\u666f\u8272\u3001\u52a0\u4e0a\u984d\u5916\u7684\u9593\u9694\uff0c\u5c31\u53ef\u4ee5\u62ff\u5230 border \u7dda<\/li><li>\u8df3\u51fa\u56fa\u5b9a\u601d\u7dad:<ul><li>dropdown \u53ef\u4ee5\u5206\u6b04\u3001\u52a0\u4e0a\u6587\u5b57\u63cf\u8ff0\u8ddf\u984f\u8272 icon<\/li><li>\u8868\u683c\u5982\u679c\u4e0d\u9700\u8981\u6392\u5e8f\uff0c\u53ef\u4ee5\u52a0\u4e0a \u7b2c\u4e8c\u5217\u6587\u5b57\u3001\u53ef\u4ee5\u6709\u5716\u7247\u3001\u984f\u8272label<\/li><li>radio button \u53ef\u4ee5\u8b8a\u6210 button groups \u6309\u9215<\/li><\/ul><\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">Leveling Up<\/h2>\n\n\n\n<ul class=\"wp-block-list\"><li>\u89c0\u5bdf\u5225\u4eba\u7684\u8a2d\u8a08<\/li><li>\u91cd\u5efa\u81ea\u5df1\u7684 UI<\/li><\/ul>\n","protected":false},"excerpt":{"rendered":"<p>Refactoring UI: The Book \u883b\u4e0d\u932f\u7684\u4e00\u672c PDF \u5c0f\u66f8\uff0c\u8b1b\u7db2\u9801\u7684 UI \u8a2d\u8a08\u3002\u7279\u5225\u662f\u524d\u5e7e &hellip; <\/p>\n<p class=\"link-more\"><a href=\"https:\/\/ihower.tw\/blog\/10556-refactoring-ui\" class=\"more-link\">\u95b1\u8b80\u5168\u6587<span class=\"screen-reader-text\">\u3008Refactoring UI \u8b80\u66f8\u6458\u8981\u3009<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":false,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[4],"tags":[],"class_list":["post-10556","post","type-post","status-publish","format-standard","hentry","category-web-design","entry"],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"","jetpack_shortlink":"https:\/\/wp.me\/p1q6tG-2Kg","jetpack_sharing_enabled":true,"jetpack_likes_enabled":true,"_links":{"self":[{"href":"https:\/\/ihower.tw\/blog\/wp-json\/wp\/v2\/posts\/10556","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ihower.tw\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ihower.tw\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ihower.tw\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ihower.tw\/blog\/wp-json\/wp\/v2\/comments?post=10556"}],"version-history":[{"count":6,"href":"https:\/\/ihower.tw\/blog\/wp-json\/wp\/v2\/posts\/10556\/revisions"}],"predecessor-version":[{"id":10731,"href":"https:\/\/ihower.tw\/blog\/wp-json\/wp\/v2\/posts\/10556\/revisions\/10731"}],"wp:attachment":[{"href":"https:\/\/ihower.tw\/blog\/wp-json\/wp\/v2\/media?parent=10556"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ihower.tw\/blog\/wp-json\/wp\/v2\/categories?post=10556"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ihower.tw\/blog\/wp-json\/wp\/v2\/tags?post=10556"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}