HTML cleaner轉(zhuǎn)換
<p><strong>二、課程目標(biāo)</strong></p>
<p>透過混合學(xué)習(xí)及體驗(yàn)式學(xué)習(xí)培養(yǎng)學(xué)生以下能力:</p>
<ul>
<li>能夠從<strong>用戶體驗(yàn)</strong>框架,描述網(wǎng)頁設(shè)計(jì)與制作主要概念,包括頁面結(jié)構(gòu)、網(wǎng)站結(jié)構(gòu)、界面設(shè)計(jì)、圖形設(shè)計(jì)及圖像和視頻等</li>
<li>能熟悉產(chǎn)業(yè)標(biāo)準(zhǔn)生態(tài),活用<strong>HTML5</strong>及<strong>CSS3</strong>的產(chǎn)業(yè)技術(shù)標(biāo)準(zhǔn)</li>
<li>能描述<strong>響應(yīng)式網(wǎng)頁設(shè)計(jì)</strong>的功能、特征及技術(shù)實(shí)踐常用標(biāo)準(zhǔn)作法</li>
<li>能運(yùn)用設(shè)計(jì)與制作<strong>工具</strong>及區(qū)分工具<strong>使用</strong><strong>情境</strong></li>
<li>能認(rèn)識相關(guān)<strong>實(shí)踐社群</strong>及學(xué)科,習(xí)得最佳實(shí)踐及技巧的更新途徑</li>
</ul>
<p><strong>四、教學(xué)進(jìn)度計(jì)劃表</strong></p>
<p>說明:<strong>教學(xué)活動(dòng)</strong>除有額外說明,均為混合學(xué)習(xí)及體驗(yàn)式學(xué)習(xí)</p>
<table width="583">
<tbody>
<tr>
<td width="59">
<p><strong>周次</strong></p>
</td>
<td width="270">
<p><strong>課程要點(diǎn)</strong></p>
</td>
<td width="95">
<p><strong>教學(xué)活動(dòng)</strong></p>
</td>
<td width="161">
<p><strong>閱讀資料</strong></p>
</td>
</tr>
<tr>
<td width="59">
<p>1</p>
</td>
<td width="270">
<p>網(wǎng)頁設(shè)計(jì)與制作與工具介紹</p>
</td>
<td width="95">
<p>?</p>
</td>
<td width="161">
<p>RWD1</p>
</td>
</tr>
<tr>
<td width="59">
<p>2</p>
</td>
<td width="270">
<p>從用戶體驗(yàn)切入響應(yīng)式設(shè)計(jì)實(shí)踐</p>
</td>
<td width="95">
<p>?</p>
</td>
<td width="161">
<p>RWD2, WSG0</p>
</td>
</tr>
<tr>
<td width="59">
<p>3</p>
</td>
<td width="270">
<p>HTML基本元素:碼云Pages搭建</p>
</td>
<td width="95">
<p>?</p>
</td>
<td width="161">
<p>w3school, 碼云Pages</p>
</td>
</tr>
<tr>
<td width="59">
<p>4</p>
</td>
<td width="270">
<p>頁面結(jié)構(gòu)(Page Structure)</p>
</td>
<td width="95">
<p>?</p>
</td>
<td width="161">
<p>WSG6</p>
</td>
</tr>
<tr>
<td width="59">
<p>5</p>
</td>
<td width="270">
<p>頁面制作案例一<br /> ☉<strong>期中在線考查</strong> <strong>A</strong></p>
</td>
<td width="95">
<p>教室外實(shí)踐或?qū)I(yè)分享</p>
</td>
<td width="161">
<p>WP2,WSG4,DMMT</p>
</td>
</tr>
<tr>
<td width="59">
<p>6</p>
</td>
<td width="270">
<p>圖像和視頻(Images&Video)</p>
</td>
<td width="95">
<p>?</p>
</td>
<td width="161">
<p>WSG11, 12</p>
</td>
</tr>
<tr>
<td width="59">
<p>7</p>
</td>
<td width="270">
<p>彈性布局與響應(yīng)式圖片</p>
</td>
<td width="95">
<p>?</p>
</td>
<td width="161">
<p>RWD3</p>
</td>
</tr>
<tr>
<td width="59">
<p>8</p>
</td>
<td width="270">
<p>HTML5與響應(yīng)式</p>
</td>
<td width="95">
<p>?</p>
</td>
<td width="161">
<p>RWD4</p>
</td>
</tr>
<tr>
<td width="59">
<p>9</p>
</td>
<td width="270">
<p>CSS3新特性</p>
</td>
<td width="95">
<p>?</p>
</td>
<td width="161">
<p>RWD5</p>
</td>
</tr>
<tr>
<td width="59">
<p>10</p>
</td>
<td width="270">
<p><strong>☉</strong><strong>期中考查</strong><strong> B</strong></p>
</td>
<td width="95">
<p>?</p>
</td>
<td width="161">
<p>?</p>
</td>
</tr>
<tr>
<td width="59">
<p>11</p>
</td>
<td width="270">
<p>網(wǎng)站結(jié)構(gòu)(Site Structure)</p>
</td>
<td width="95">
<p>?</p>
</td>
<td width="161">
<p>WSG5</p>
</td>
</tr>
<tr>
<td width="59">
<p>12</p>
</td>
<td width="270">
<p>CSS3高級技術(shù)</p>
</td>
<td width="95">
<p>?</p>
</td>
<td width="161">
<p>RWD6</p>
</td>
</tr>
<tr>
<td width="59">
<p>13</p>
</td>
<td width="270">
<p>介面設(shè)計(jì)(Interface Design)</p>
</td>
<td width="95">
<p>教室外實(shí)踐或?qū)I(yè)分享</p>
</td>
<td width="161">
<p>WSG7</p>
</td>
</tr>
<tr>
<td width="59">
<p>14</p>
</td>
<td width="270">
<p>圖形設(shè)計(jì)(Graphic Design)</p>
</td>
<td width="95">
<p>教室外實(shí)踐或?qū)I(yè)分享</p>
</td>
<td width="161">
<p>WSG8</p>
</td>
</tr>
<tr>
<td width="59">
<p>15</p>
</td>
<td width="270">
<p>SVG與響應(yīng)式Web設(shè)計(jì)<br /> ☉<strong>期中在線考查</strong><strong> C</strong></p>
</td>
<td width="95">
<p>教室外實(shí)踐或?qū)I(yè)分享</p>
</td>
<td width="161">
<p>RWD7</p>
</td>
</tr>
<tr>
<td width="59">
<p>16</p>
</td>
<td width="270">
<p>CSS3過渡、變形和動(dòng)畫</p>
</td>
<td width="95">
<p>?</p>
</td>
<td width="161">
<p>WSG9</p>
</td>
</tr>
<tr>
<td width="59">
<p>17</p>
</td>
<td width="270">
<p>☉期末應(yīng)用項(xiàng)目開發(fā)成果展示考查</p>
</td>
<td width="95">
<p>?</p>
</td>
<td width="161">
<p>?</p>
</td>
</tr>
<tr>
<td width="59">
<p>18</p>
</td>
<td width="270">
<p>☉期末應(yīng)用項(xiàng)目開發(fā)成果點(diǎn)評總結(jié)</p>
</td>
<td width="95">
<p>?</p>
</td>
<td width="161">
<p>?</p>
</td>
</tr>
</tbody>
</table>
上述文件中的標(biāo)簽功能分類及描述:
<p> 標(biāo)簽定義段落。
<strong>定義語氣更為強(qiáng)烈的強(qiáng)調(diào)文本。
<ul> 定義無序列表。
<li>定義列表的項(xiàng)目。
<table>定義表格。
<tbody>定義表格中的主體內(nèi)容。
<tr>定義表格中的行。
<td>定義表格中的單元。
<p><strong>三、課程資料:</strong></p>
<p><strong>(一)教科書</strong></p>
<p>Frain, B. (2017). <a ><em>響應(yīng)式Web設(shè)計(jì):HTML5和CSS3實(shí)戰(zhàn)(第2版)</em></a>. (奇舞團(tuán)譯) 人民郵電出版社。<strong><u>說明:簡稱RWD,本課程內(nèi)容為全書1,2,3,4,5,6,7,8,9章</u></strong></p>
<p>Lynch, P. J., & Horton, S. (2016). <a ><em>Web Style Guide : Foundations of User Experience Design</em></a><em> (4th ed)</em>. New Haven: Yale University Press. <strong><u>說明:簡稱WSG,本課程內(nèi)容為5,6,7,8,11,12章</u></strong><strong><u> ?WSG4 1,2,3,4, <br /> </u></strong><strong>網(wǎng)頁版:</strong><strong>http://webstyleguide.com/index.html</strong></p>
上面是教學(xué)大綱:三、課程資料中的(一)教科書的HTML轉(zhuǎn)換文本
比較兩者我們可以明顯看出三種文本的部分區(qū)別:其中的標(biāo)簽多為相同,而又有著各自新的標(biāo)簽,這說明大多數(shù)的標(biāo)簽都是通用的!
實(shí)踐心得:
通過這一課的系統(tǒng)學(xué)習(xí),我初步的了解網(wǎng)頁設(shè)計(jì)的基本原理,同時(shí)也學(xué)會了簡單的實(shí)際操作。關(guān)于響應(yīng)式網(wǎng)頁設(shè)計(jì)知識點(diǎn),身為學(xué)生的我積極的去了解并操作響應(yīng)式網(wǎng)頁科技及原理。