課程目標
<p><strong>二、課程目標</strong></p>
<p>透過混合學習及體驗式學習培養(yǎng)學生以下能力：</p>
<ol>
<li>能夠從<strong>用戶體驗</strong>框架，描述網(wǎng)頁設計與制作主要概念，包括頁面結構、網(wǎng)站結構、界面設計、圖形設計及圖像和視頻等</li>
<li>能熟悉產(chǎn)業(yè)標準生態(tài)，活用<strong>HTML5</strong>及<strong>CSS3</strong>的產(chǎn)業(yè)技術標準</li>
<li>能描述<strong>響應式網(wǎng)頁設計</strong>的功能、特征及技術實踐常用標準作法</li>
<li>能運用設計與制作<strong>工具</strong>及區(qū)分工具<strong>使用</strong><strong>情境</strong></li>
<li>能認識相關<strong>實踐社群</strong>及學科，習得最佳實踐及技巧的更新途徑</li>
</ol>
教學進度計劃表
<p><strong>四、教學進度計劃表</strong></p>
<p>說明：<strong>教學活動</strong>除有額外說明，均為混合學習及體驗式學習</p>
<table width="583">
<tbody>
<tr>
<td width="59">
<p><strong>周次</strong></p>
</td>
<td width="270">
<p><strong>課程要點</strong></p>
</td>
<td width="95">
<p><strong>教學活動</strong></p>
</td>
<td width="161">
<p><strong>閱讀資料</strong></p>
</td>
</tr>
<tr>
<td width="59">
<p><strong>1</strong></p>
</td>
<td width="270">
<p>網(wǎng)頁設計與制作與工具介紹</p>
</td>
<td width="95">
<p>?</p>
</td>
<td width="161">
<p>RWD1</p>
</td>
</tr>
<tr>
<td width="59">
<p><strong>2</strong></p>
</td>
<td width="270">
<p>從用戶體驗切入響應式設計實踐</p>
</td>
<td width="95">
<p>?</p>
</td>
<td width="161">
<p>RWD2, WSG0</p>
</td>
</tr>
<tr>
<td width="59">
<p><strong>3</strong></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><strong>4</strong></p>
</td>
<td width="270">
<p>頁面結構（Page Structure）</p>
</td>
<td width="95">
<p>?</p>
</td>
<td width="161">
<p>WSG6</p>
</td>
</tr>
<tr>
<td width="59">
<p><strong>5</strong></p>
</td>
<td width="270">
<p>頁面制作案例一 ☉<strong>期中在線考查</strong> <strong>A</strong></p>
</td>
<td width="95">
<p>教室外實踐或專業(yè)分享</p>
</td>
<td width="161">
<p>WP2,WSG4,DMMT</p>
</td>
</tr>
<tr>
<td width="59">
<p><strong>6</strong></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><strong>7</strong></p>
</td>
<td width="270">
<p>彈性布局與響應式圖片</p>
</td>
<td width="95">
<p>?</p>
</td>
<td width="161">
<p>RWD3</p>
</td>
</tr>
<tr>
<td width="59">
<p><strong>8</strong></p>
</td>
<td width="270">
<p>HTML5與響應式</p>
</td>
<td width="95">
<p>?</p>
</td>
<td width="161">
<p>RWD4</p>
</td>
</tr>
<tr>
<td width="59">
<p><strong>9</strong></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><strong>10</strong></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><strong>11</strong></p>
</td>
<td width="270">
<p>網(wǎng)站結構（Site Structure）</p>
</td>
<td width="95">
<p>?</p>
</td>
<td width="161">
<p>WSG5</p>
</td>
</tr>
<tr>
<td width="59">
<p><strong>12</strong></p>
</td>
<td width="270">
<p>CSS3高級技術</p>
</td>
<td width="95">
<p>?</p>
</td>
<td width="161">
<p>RWD6</p>
</td>
</tr>
<tr>
<td width="59">
<p><strong>13</strong></p>
</td>
<td width="270">
<p>介面設計（Interface Design）</p>
</td>
<td width="95">
<p>教室外實踐或專業(yè)分享</p>
</td>
<td width="161">
<p>WSG7</p>
</td>
</tr>
<tr>
<td width="59">
<p><strong>14</strong></p>
</td>
<td width="270">
<p>圖形設計（Graphic Design）</p>
</td>
<td width="95">
<p>教室外實踐或專業(yè)分享</p>
</td>
<td width="161">
<p>WSG8</p>
</td>
</tr>
<tr>
<td width="59">
<p><strong>15</strong></p>
</td>
<td width="270">
<p>SVG與響應式Web設計 ☉<strong>期中在線考查</strong><strong> C</strong></p>
</td>
<td width="95">
<p>教室外實踐或專業(yè)分享</p>
</td>
<td width="161">
<p>RWD7</p>
</td>
</tr>
<tr>
<td width="59">
<p><strong>16</strong></p>
</td>
<td width="270">
<p>CSS3過渡、變形和動畫</p>
</td>
<td width="95">
<p>?</p>
</td>
<td width="161">
<p>WSG9</p>
</td>
</tr>
<tr>
<td width="59">
<p><strong>17</strong></p>
</td>
<td width="270">
<p>☉期末應用項目開發(fā)成果展示考查</p>
</td>
<td width="95">
<p>?</p>
</td>
<td width="161">
<p>?</p>
</td>
</tr>
<tr>
<td width="59">
<p><strong>18</strong></p>
</td>
<td width="270">
<p>☉期末應用項目開發(fā)成果點評總結</p>
</td>
<td width="95">
<p>?</p>
</td>
<td width="161">
<p>?</p>
</td>
</tr>
<tr>
<td width="59">
<p><strong>19</strong></p>
</td>
<td width="270">
<p><strong>?</strong></p>
</td>
<td width="95">
<p><strong>?</strong></p>
</td>
<td width="161">
<p><strong>?</strong></p>
</td>
</tr>
<tr>
<td width="59">
<p><strong>20</strong></p>
</td>
<td width="270">
<p><strong>?</strong></p>
</td>
<td width="95">
<p>?</p>
</td>
<td width="161">
<p>?</p>
</td>
</tr>
</tbody>
</table>
HTML代碼"標簽"
- <p>:定義段落
- <li>:定義列表的項目
- <tr>:定義表格中的行
- <strong>:定義語氣更為強烈的強調文本
- <ul>:定義無序列表
- <table>:定義表格
- <style>:定義文檔的樣式信息
其他WORD文書轉換或換出HTML格式的方法和結果比較
打開需要轉換的word文檔，點擊左上角的【文件】，然后選擇【另存為】并選擇存儲路徑，再點擊【保存類型】，選擇【網(wǎng)頁】，保存后便已把該文檔轉換成“HTML”
將兩種方法都操作一遍過后，感覺當可以復制文本信息的情況下還是第一種方法更方便
實踐心得
使用https://html-cleaner.com/進行word文書轉換很方便很簡單，更有效率。為了完成本周學習任務，通過閱讀響應式網(wǎng)頁設計懂得了一些最基本的東西，另外上網(wǎng)查閱相關知識，發(fā)現(xiàn)這片“大海”里面還有許多沒有探索過的區(qū)域，我們學到的僅僅是九牛一毛，想要掌握這技能還需要很多很多，這次的實踐我有不少的收獲，希望在未來的路能學會更多。
