工作室网页(推荐10篇)
一、网页版面尺寸规范
1.网页的宽度,根据主流显示器的分辨率减去滚动条宽度和左右填充;
2.网页的长度,一般以不超过2.5屏幕为标准
3.网页文件大小,一般单个页面控制在35k以下
4.广告尺寸
二、文件夹、文件命名规范
1.文件夹名一般采用英文小写字母,特殊情况可以使用中文拼音; 2.文件名称统一用小写的英文字母、数字和下划线的组合; 3.主页文件命名为index.html,主内容页命名为main.html;4.菜单名称采用菜单名的英文单词或组合英文单词命名; 5.图片文件、动画文件的命名以英文单词或汉语拼音缩写命名。图片的命名可以分为两个部分:
(1)表示图片的类型,例如广告命名为banner,标志命名为Logo,按钮命名为button,标题图片命名为title,菜单图片命名为menu,照片命名为photo;
(2)表示图片的名称或者编号,用下划线连接;
三、字体使用规范
1.文字粗细的确定,一般设置为默认,标题加粗,值700即可,加粗一般使用14.7px效果较好;
2.文字字号的确定,正文一般14px,标题16px-18px,页脚12px即可;
3.文字的字间距和行间距的确定;
4.正文一律使用系统默认的中西文字体,如果有特殊需要则可以把使用了特殊字体的对象制作成图片;
5.字体颜色要和背景色对比分明,使用户便于阅读
四、变量命名规范
1.ID变量应使用能代表其具体功能的有意义英文缩写或拼音; 2.CSS的类名应能体现出其设置范围的有意义单词;
3.所有变量名应严格遵守其语言变量声明规范,一般采用匈牙利命名法;
其他注意事项
1.网页色彩要清新,布局要大方;
2.网页作品的整体性、一致性等要合理,包括色彩的统一,板式的统一,机构的统一和字
体的统一等等;
3.整个作品要和谐,页面符合美得法则,页面的元素要协调有序,浑然一体;
4.网页布局应主次分明,中心突出,大小搭配,相互呼应,图文并茂,适当的空白和利于
阅读;
5.LOGO要严格遵守CIS要求,使用允许的变体和字色以及字体
6.合理应用色彩带来的情感心理反应,针对不同的主题使用合理的色系;
7.色彩搭配总体原则是“总体协调、局部对比”,但应注意严格控制色彩的数量,优先使
教育部教高[2006]16号文指出:高等职业教育培养高端技能型人才, 注重培养学生的实践、应用能力, 利用已经发现的规律、定理为经济社会提供直接服务。本人通过多年教学发现, 打破传统课程模式, 构建以培养学生综合素质为中心、以企业实践项目教学为主体的高职课程模式, 是满足高职教育培养目标行之有效的方法。
CDIO的教育模式凭借其完善的人才培养理念给中国高等教育尤其是高等职业教育注入了新的活力, 其构思 (C) -设计 (D) -实现 (I) -运作 (O) 的人才培养模式非常适用于当前国内高职教育实践性课程的教学改革。CDIO工程教育模式遵循从产品研发到产品运行的生命周期, 通过工程模式积极培养学生的理论知识、综合素质、团队协作和工程系统四个层面的能力。网页设计作为一项创意工程, 规划-设计-制作-测试-发布-管理的设计与实现的过程恰恰符合CDIO的教育理念。
所谓“工作室制”教学模式是以工作室为载体, 将课程内容与实际应用融为一体, 将传统的课堂教学变成面向实际应用的开放式教学。在教学过程中, 以知识为基础、应用为核心、教师为主导、承接技术项目为主要任务, 在完成技术项目的过程中完成课程内容的学习和综合技能的训练。作为我院一门公共基础课程, 网页设计课程的教学并不存在与企业合作、承接实际项目的必要, 但工作室制的教学管理方法却切实可行。在教师的引导下, 可以采取成立虚拟公司的培养模式, 模拟一些实际的网页设计需求, 学生全程参与到虚拟公司的运行, 在公司内部进行分工与协作。
因此, 针对当前网页设计类课程教学模式中存在的问题, 以CDIO理念为指导、工作室为载体, 探讨分析基于CDIO的工作室制网页设计课程教学改革与创新, 对学生工程能力与综合素质的培养及同类课程的建设具有重要意义。
2 教学现状分析
通过对多年教学成果的分析及与其他院校同类课程相对比, 目前我院网页设计课程教学存在以下问题:
2.1 理论与实践脱节, 学生主动学习意识薄弱
目前, 很多教师仍在采用传统垂直型授课模式, 参照教学大纲或课程标准, 以知识为主线, 按照理论知识的层次递进方式组织教学。理论教学结束后实践的内容一般也都是对上课所讲理论的验证或是一些简化了的应用, 和实际项目相差甚远。这种“满堂灌”的教学方式, 虽然可以完成教学任务, 但形式单一, 缺乏工程背景, 与实际应用脱节, 学生难以领悟真实的工作需要具备哪些能力。更可怕的是, 这种单一的教学模式容易导致学生丧失学习兴趣甚至产生厌学情绪, 加上高职学生的大部分自控力不强, 学生因而没有了学习的主动性, 学习基本停留在课堂上吸取教师讲授的部分内容, 这远远不能满足实际能力的需要。
2.2 注重软件使用方法的讲解, 课程相关知识的关联度低
网页设计课程的教学内容覆盖规划-设计-制作-测试-发布-管理等多个环节, 然而目前, 虽然网页设计类课程的教材不断推陈出新, 但大部分都是以网页制作软件的使用方法为主, 很少有经典案例的分析和网站整体规划设计的内容;加上授课教师也多数是从一个校门踏入另一个校门, 绝大部分都没有项目经验。因此课堂教学不得不偏重于教材知识点的讲解, 在授课过程中孤立了工程设计思维的培养, 将网页设计课程当作某一应用软件的讲授进行授课。这种现象很容易造成学生所学知识系统性的缺失, 不利于学生综合素质的培养, 其结果只能完成课堂单元作业, 而不能进行完整的网页设计, 网页作品苍白无力, 缺乏表现力。
2.3 不能实施分层教学, 两极分化严重
由于学生对课程的接受能力参差不齐加上学生个人产生兴趣的程度不同, 对于同一门课程不同学生的学习存在明显差异。作者曾在《网页设计基础》课程结束时做过一项关于教师的授课进度是否合适的调查, 结果有18%的学生认为太慢, 16%的学生认为太快, 显然这34%的学生的积极性都会降低。传统的垂直型教学模式限制了分层教学活动的开展, 每个学生都完成相同的任务, 却产生了分化严重的学习效果。
2.4 偏重个人技术的培养, 缺乏团队协作意识
传统网页设计的教学由于注重应用软件的授课, 使得教学效果偏向于学生个人技术的培养及个人能力的提高, 但往往由于个人综合能力的不均衡, 导致设计的作品过于狭隘。现今市场对于网页设计的需求早已摆脱了个人英雄主义, 团队制作才更符合行业发展需求, 而且不论学生的专业是什么, 用人单位对于学生与他人协作甚至团队协调管理能力也有一定的需求。因此在教学中加深团队教育意识是必要的, 也是务实的。
3 尝试做出的改革与创新
3.1 教学模式的改革
CDIO工程教育理念要求的课程学习不再是单纯的知识叠加, 而是在知识和能力的发展中锻炼实施系统工程及团队协作的能力。这就需要借助“工作室制”的教学模式, 将一个班级分为多个项目组成立“虚拟公司”, 由各项目组开展模拟市场调研、接受模拟客户任务、按照客户需求给出设计方案并展开详细的项目制作, 工程的实施开放性地贯穿课堂与课外。
在项目组构建之初, 利用“霍德兰职业兴趣测验”帮助学生发现和确定他们的职业兴趣和能力所长, 指导各项目组的角色分工, 让学生选择自己感兴趣的角色投入到学习之中, 这样有助于发挥学生个性特长, 并帮助学生建立自信, 从而提升学习兴趣。项目实施期间, 教师可以平行参加各模拟公司的项目, 对之提出修改意见, 改进项目计划。
3.2 教学内容的改革
建设一个功能完善又美观的网站需要多方面的知识, 比如Flash和Photoshop等动画、图像处理软件及软件工程学、美学的学习。然而有限的教学学时不允许所有相关知识点的逐一讲授;即使在教学学时允许的情况下, 也容易忽视对学生综合素质及能力的培养。CDIO人才培养模式不仅要求学生能够掌握一定的基础知识, 更重在培养学生工程实践的综合素质及能力, 同时在工程实践的过程中帮助学生更好地理解和接受课程标准中的知识点。因此, 需要对教学内容做出适当的调整:考虑以一个既定工程项目的构思-设计-实现-运作 (即CDIO) 为主线贯穿整个教学过程, 重点介绍工程开展过程中涉及到的相关知识, 知识点覆盖课程标准80%左右, 工作量约占整个学习过程的20%-30%;同时由各“工作室”自由选取工程项目, 在教师的引导下由学生分工协作完成, 实践CDIO的项目开发过程, 项目所涉及的知识点可能包含课程标准剩余20%, 工作量则占到60%-70%。
由于现行的教材大多数是根据软件的特点及使用方法进行编写, 因此要谨慎选取, 最好是以一个完整的工程项目为主线, 更符合CDIO教育理念的核心。在教学过程中, 将教材变成学习的“字典”, 条件成熟后可以适当编写讲义, 甚至编写校本教材。
3.3 教学方法的改革
根据CDIO的教育理念, 教学改革围绕培养学生的知识、能力、素质三者集成的目标, 并重点培养学生的自主学习能力、信息获取能力、软件应用能力及团队协作能力。因此, 对网页设计课程的教学方法做出如下改革:在工作室制的工程模式下, 形成教学主导工程项目 (以下简称“主导项目”) 与虚拟公司工程项目 (以下简称“公司项目”) 的教学方法创新体系:
(1) 自主学习能力的培养:采取引导式、启发式的教学方法, 结合主导项目讲授知识点;同时在公司项目中引导学生主动学习知识, 发现知识;
(2) 信息获取能力的培养:实施公司项目过程中, 由学生自发获取相关的信息资源;
(3) 软件应用能力的培养:在主导项目和公司项目的同步实施过程中掌握开发软件的灵活运用;
(4) 团队协作能力的培养:虚拟公司内部分工, 项目主管协调各成员工作。
3.4 考核方式的改革
课程考核是教学活动的一个重要环节, CDIO教学理念下的学生的成绩不能再单纯依赖一份所有人都一样或是相似 (比如分层考核) 的试题决定, 而应根据教学方法的特点选用适当的考核方法, 这样也能促使学生根据考核方法调整学习方法, 激励学生的学习动机。在CDIO工程理念的引导下从工程基础知识、个人能力、团队协作能力及工程系统能力四个层面展开, 可采用学生笔试、报告、答辩、互评和自评等多样化的评价方法:
在主导项目的教学过程中, 可采用笔试和上机的方式考察学生对基础理论和软件使用方法的掌握;
公司项目完成后, 由各“工作室”项目主管向其他工作室展示项目成果并作报告, 详细说明项目实施的全过程、项目组的具体分工及项目组成员完成情况、在实施过程中遇到的问题及解决的方法等, 接受教师与其他项目组的提问;项目组成员就个人在项目中承担的工作任务和完成情况逐一答辩。项目主管对各成员的完成情况给出客观的评价, 项目组之间互评, 各成员自评。
4 改革与创新的可行性分析
4.1 教师群体与学生群体的角色转型
要彻底摆脱“满堂灌”的传统教学模式, 只有采用工程化教学模式开展教学, 使教师不仅成为知识的传播者, 同时更要成为问题情境的创设者、尝试点拨的引导者、知识反馈的调整者。只有这样, 学生才能真正成为学习的主角和主人, 在协作完成“一项工程”的过程中学习知识、发现知识, 进行自主学习。
4.2“工作室”制度全面培养学生的综合素质
根据学生不同的兴趣点和能力点引导学生成立“工作室”, 成立项目组并推选项目主管, 有助于学生在自主学习过程中的互助与相互监督;学生的合理分工则能充分发挥学生各自所长, 发展学生各方面的技能, 同时又间接让学生发现自身的不足, 确定努力的方向;全方位地锻炼学生的组织协调与沟通能力, 为将来学生走上实习就业岗位面向社会提供了一定的素质准备。
4.3 全方位的教学评价体系
项目的考核评价采用包括教师评价、项目组互评和自评的综合三级评价体系, 如果单凭项目评价分数作为每个学生的项目得分, 对于学生在项目中充当角色的重要性不同, 显然是不公平的。因此应对各成员所承担的工作及在项目实施全过程中的表现进行综合评价。这样不仅体现了公平、公正、合理的原则, 也较好地激发了学生的学习热情, 同时也有效避免了项目组中个别学生依赖其他成员的表现获取分数, 不劳而获, 督促每一个学生都认真参与到项目的开发过程中。
由三级评价体系评价产生的最优秀的项目可以作为代表作品上传至校园网进行展示, 给学生以美的欣赏和智慧的碰撞, 激发学生的学习兴趣, 培养学生的创新精神及团队合作精神。
摘要:高等职业教育培养高端技能型人才, 注重培养学生的实践、应用能力, 利用已经发现的规律、定理为经济社会提供直接服务。CDIO的教育模式凭借其完善的人才培养理念给中国高等教育尤其是高等职业教育注入了新的活力。网页设计作为一项创意工程, 规划-设计-制作-测试-发布-管理的设计与实现的过程恰恰符合CDIO的教育理念。“工作室制”教学模式是以工作室为载体, 将传统的课堂教学变成面向实际应用的开放式教学。针对当前网页设计类课程教学模式中存在的问题, 本文着眼于探讨分析基于CDIO的工作室制网页设计课程教学改革与创新。
关键词:CDIO,工作室制,网页设计,改革,创新
参考文献
[1]于延等.CDIO模式下C语言程序设计实践教学改革[J].计算机教育, 2016 (2) :122.
[2]谢志明.高职院校“网页设计与制作”课程的教学改革与构建——以“双项目双中心教学模式”进行探究[J].继续教育, 2013 (8) :39.
[3]季恒.基于CDIO理念的网页设计教学改革与实践[J].湖北函授大学学报, 2012, 25 (3) :82.
关键词:工作过程 网页制作 课程开发
【分类号】TP393.092-4
《网页设计与制作》课程是一门技术性,实用性及操作性很强的课程,已经成为众多高职院校网站开发、电子商务、计算机等相关专业开设的热门课程,网站建设与维护也已成为相关专业学生必备的一门技能。当今网络时代,Internet以网站的形式存储了海量的信息,通过网页的形式进行信息展示、互动交流、产品购买已渗透到人类社会生活的诸多领域。目前,社会各工作领域中网站建设、开发与维护的技术人才需求量极大,亟需要具有相应技能的岗位人才。
《网页设计与制作》这门课程培养的是学生的网站策划能力、网页设计与制作能力及网站的管理与维护能力。在整个网站建设与开发过程中,该课程起到基础性及支撑性的作用。传统的课程教学方式通常按照知识技能的学习顺序进行教授,学生在每一部分相对独立的教学内容中只能学到网页制作中的局部内容和技术,这种方式使整个学习过程变得零碎,最终学生缺乏整体建设网站制作项目的能力。因此,基于工作过程进行课程的开发,使学生能够在项目中熟悉工作流程,提高网站建设的综合能力,将极大的有利于学生职业能力的培养。
1、课程的地位与作用
《网页设计与制作》课程是山东传媒职业学院网站规划与开发技术专业、计算机多媒体技术专业的一门专业核心课程。根据我院立足广播电视行业、面向社会、培养高端技能型人才的总体培养目标,这些专业均要求面向广播电视(网络电视、手机电视)、各企事业单位网站、网站开发公司、广告公司和中小型网络推广公司等单位,培养能够在网站策划与编辑、网站前端工程师、网站程序开发工程师、网站运维及手机客户端开发等岗位上立足的技能人才。《网页设计与制作》课程作为培养以上岗位人才的主干课程,主要是培养学生在从事网站开发设计及网站管理等技术支持行业,针对网站策划与编辑、网站前端工程师等岗位,培养具有网站策划与编辑、网页设计与制作、网站管理及维护等技能,并具备一定的综合分析解决问题的能力,创造创新能力,及具备团队精神和责任感的全方位职业素养的人才。
分析该课程在以上专业岗位课程体系中的地位,如图1所示,该课程处于整个课程体系的中间环节,具有极其重要的地位和作用。其前导课程是计算机应用基础、计算机网络技术、计算机图形图像(Photoshop)、Flash动画设计,后续课程是Javascript、动态网页设计(php)与mysql数据库技术、网页设计综合实训等。该课程所处的地位具有至关重要的作用,它要求学生在掌握前导课程的知识技能基础上,要具备一定的综合应用能力;同时该课程的学习又与后续其它专业课程的学习有着千丝万缕的联系,并给它们提供一个重要的知识基础平台,实现网页前端设计代码与交互效果代码、后台功能代码的融合。该课程在岗位课程体系中具有重要的作用,课程培养的关键职业能力是网站策划、网页设计制作及网站管理维护能力,因此该课程直接面向的具体岗位有网页美工设计师,网页前端设计师,网站交互设计师、网站管理维护人员等。
2、基于工作过程的课程开发理念
根据高职高专院校培养高端技能型人才的培养目标,坚持以培养职业能力和职业素质为本位的课程观,树立基于职业岗位工作过程的课程开发理念。课程设计始终贯彻以“工作过程为导向”、“工学结合”的思想。通过深入网站设计开发的公司企业进行岗位职业能力与工作过程的调查。在课程设计时采用模仿实际的工作过程及工作任务进行课程开发。
课程设计采用基于工作过程的项目化课程教学设计。依据工作过程将课程内容按岗位职业能力进行整合、划分与安排,将课程內容划分成若干个项目学习模块,并在每个项目模块下设置多个学习任务,将岗位职业技能融入到其中,实现“以项目为导向,以工作任务为基础,以任务驱动方式”引领学生进行技能的学习。项目模块的内容既要符合实际的工作过程,也要在教学顺序上兼顾学生的认知规律,使学生循序渐进的全面掌握课程知识技能。教学过程本着“以学生为主体,教师为主导,训练为主线”的方式,坚持以学生动手为主,配合讲练结合,师生交流、学生协作等方式在专业实训室完成相应的工作任务,培养学生的实践应用能力,设计创造能力及团队合作能力,养成学生良好的职业行为习惯、职业能力与职业素养。
3、课程开发过程中教学项目的组织与设计
要学习网页设计与制作,首先必须先进行网站的规划,并掌握本地站点及WEB站点的安装与配置,在此基础上才能进行网页的制作与预览。然后再遵循由单一网页设计到主题网站设计的思路进行由单一到复杂的教学项目的设计,同时在网页设计及网站设计项目中又分别根据网页的布局方式,网站的主题等进行分类学习和制作。最后在通过课程学习所掌握的能力基础上,由学生分组完成一个主题网站的设计与制作,使学生的专业能力、自主学习能力、职业能力得到进一步提升和锻炼。
因此,结合课程的培养目标,遵循循序渐进的学习规律,基于工作过程进行课程开发,对教学内容进行整合与排序,把课程内容设计成一系列由点到面教学项目,共分为以下六个项目模块,分别是:(一)网站规划基础、(二)HTML CSS简单网页制作、(三)DIV CSS高级网页制作、(四)个人网站制作、(五)公司网站制作、(六)网站综合实训。每个项目模块的教学内容又包含若干个学习任务。六个项目模块及所包含的任务始终围绕课程的培养目标展开,在教学过程中由易到难的培养学生网站整体规划能力、网页效果图设计能力、网页素材制作能力、网页布局技术、网页交互效果制作、网站测试及网站的管理维护技能等。教学项目的开展依据工作过程,并在整个教学项目设计中实现由易到难,由单一到综合递阶式的学习方式,便于学生接受和学习。教学项目设计的层次结构如图2所示。
在课程开发设计过程中,教学内容的选取尤为重要,首先课程内容要与行业企业的岗位技能需求相一致,保持教学内容的先进性,实用性,及与工作岗位的一致性,做到“学以致用”;教学项目的学习顺序既要符合工作过程,也要充分考虑学生的认知规律,按照六个模块分阶段循序渐进的展开教学;教学重点的选取遵循课程培养目标,同时主张为后续课程的学习打下夯实的基础,教学重点内容主要有HTML网页结构的制作、CSS样式表的制作及网页布局技术等,这在每一个教学项目中都占有较大的学习比重。教学内容的制定始终体现以职业能力培养为目标的课程教学。
4、总结
2017年,又是一个新工作的开始,也是一个充满挑战、机遇与压力并重开始的一年。我要调整心态,增强责任意识,努力提高技术水平并做好本职工作,尽快成长为一名优秀的员工。
回顾2016年的工作,主要围绕以下内容:
一、新版直销平台所有页面切片,保证页面与效果图的一致性和页面在各个浏览器中的兼容性;
二、新版直销平台品牌logo尺寸的重新定义;
三、新版直销平台网站模板尺寸重新定义以及模板页面代码重写;
四、直销平台网站商家品牌页面的焦点切换图(以及顶部banner等);
五、调试保险微信后台样式;
六、缺少的品牌名片模板设计;
七、其他的一些设计工作:微信配图设计、新版直销平台考试通过页面设计、年会设计、其他banner设计等;
在这段时间的工作,我学到了很多以前没有接触的知识,能力也得到了一定的提升,同时也有很多不足的地方: 1)在切片的时候只考虑了效果图的样式,没有注意实际数据,有些样式写的比较复杂,没有注意实用性;
1、负责公司网站的页面设计及美观优化;
2、负责网站各类专题模板的设计及制作;
3、负责网站各类活动的宣传广告、标语的图片设计;
4、负责网站产品的美工设计,对交互体验有较为深入的了解;
5、对页面进行持续的优化,不断提升访问者的用户体验;
6、编写可复用的用户界面组件;
7、协同其他技术部门,做前端开发技术支持。
网页设计师岗位要求
1、熟练使用各类设计软件PS、DW、FL;
2、对网页设计的构图、色调、质感、有独到的见解;
3、熟悉web标准,精通HTML/XHTML、CSS,能手写规范代码,能解决多浏览器兼容问题;
4、对网站整体架构有较为清晰的认识,熟悉网站建设的流程和网页设计制作流程;
5、熟悉html,javascript,div+css,jQuery;
6、熟悉服务器(windows和linux)的配置、安全和维护。
延伸阅读:
网页设计师职业规划
网页设计师是每个网站不可或缺的角色,但确实有很多网页设计师会想,我们的职业成长空间如何呢?
网页设计师首先要熟悉网页制作流程,能独立完成各级页面设计,动画以及HTML静态页面制作,精通PhotoShop,Dreamweaver, FLASH等软件。
下面先谈谈网页设计师的职业规划,然后谈一谈职业规划中发展所应具备的知识、技能和业务经验。
一、成长路线
在一个互联网公司中,大体上,网页设计师有二种职业发展路线:
1、技术-产品路线:
网页设计→高级网页设计师→UI→UE→产品策划→产品经理→产品总监
2、技术-运营路线:
网页设计→高级网页设计师→SEO→SEM→运营主管→运营经理→运营总监
二、专业技能
1.技术-产品路线:
这条路线初期主要是按要求实现页面预期效果,中期的UI设计更多则需要图形设计技能。用户体验师UE则会涉及产品的前期规划,设计,开发,测试和迭代过程,熟悉各种用户研究方法和设计方法。产品经理是这些职位的综合体,需要对把控产品的整个生命周期,这时,就需要你学习一些项目管理和营销运作方面的技能。
[必不可少]
l HTML超文本标记语言
l Flash CS6动画软件
l 响应式Web设计
l CSS网页样式布局
l Illustrator矢量图形软件
l JavaScript脚本基础
l Fireworks网页作图软件
l Photoshop图像处理软件
l Dreamweaver网页制作
l JavaScript框架编程
l 版式设计原理与应用
2、产品--运营路线:
由设计向SEO搜索引擎优化师发展,需要掌握网站流量数据统计与分析,研究搜索引擎的规则,制定SEO策略,走向运营,中间还需要有一个对SEM搜索引擎营销的过渡,要从统计分析过渡到执行策略,随后,才可以更容易进入运营的角色。
网页设计人员自身就具备优化的技能,熟悉网页优化标准,这些都为你转型到搜索引擎优化师打下良好的技能基础。
[必不可少]
l 数据分析
l 统计学
l Web Analytics网站统计分析工具
l HTML超文本标记语言
l 市场调研
l 电子商务网站数据化营销
1 课程培养目标与企业用人标准
《网页设计与制作》课程侧重培养学生的网页的基本设计能力及制作能力的训练,要求学生熟练掌握网站制作中的各种基本技能,具备设计、开发、维护中小型网站的基本知识和能力,使学生能够具备从事职场工作的综合素养。
1.1 企业用人标准
通过网上调研及与企业专业人士探讨,对企业招聘的“网页设计师”的大体要求总结为以下几点:
1)要求具备良好的职业素养及个人素养,具有较强的团队合作意识,对工作认真负责。
2)具有创新意识,能够较好的把握网站的整体设计风格和网站内容整体规划。
3)熟练使用Flash、PS、Dreamweaver等相关工具,能够熟练地使用HTML+CSS对网页进行代码的编写,对从业人员要求具备系统的专业知识和具备一定的实践经验。
4)要求从业人员具备一定的代码优化能力和网站维护能力。
1.2 课程达到的教育标准
根据企业用人标准及本专业的的培养目标、理论和实践教学目标形成了本课程所应达到的教育标准,通过本课程的学习和实训,学生能够具备以下能力:web站点的规划、网站策划、构建及发布的能力;网页设计与制作能力;Flash动画的创意及制作能力;HTML+CSS代码编写能力;简单的网站优化能力。
2《网页设计与制作》课程的教学设计
2.1 明确教学目标,优化教学内容
高职院校的人才培养目标和模式必须要迎合市场对人才的需求,培养具有创新意识、团队合作能力、分析问题、解决问题能力的综合素质的人才。为了提高本课程的教学效果,我们必须优化教学内容。
根据我院网站专业及计算机相关专业的人才培养方案要求学生具备相应的专业知识外,还应具有相应的专业素养。为此,我们将对课程的教学内容进行优化、细化,增加与实际工作相关的学习内容,删除或弱化与工作联系不密切的内容。使得课程教学内容包括以下五部分:①网站入门;②DW软件使用;③HTML+CSS代码的学习;④网站策划与开发;⑤网站测试与维护;⑥网站优化(SEO),同时还要根据市场需求对课程进行随时的修订。
2.2 教学模式的选择
由于做网站对学生的创意能力及制作能力要求较高,所以本课程的课堂教学采用了多元化的模式:班级授课、互联网+教学、个别化教学、实训指导。班级授课是在实训机房教师模拟真实的工作场景,结合讲授,以多媒体信息展示教学内容,并根据学生的反馈及时调整教学进度,重点指导,强化重点;学生需要根据老师提出的项目任务进行分析、分解、优化并制作。互联网+教学是以课后学生需要通过互联网来复习、预习课程内容,并且能根据老师提出的问题进行思考为主要手段的一种方式,教师还应通过互联网能学生进行适当的指导。
2.3 教学方法的设计
教学过程中充分利用先进的教学技术和方法,在实训机房模拟真实的工作环境,从小的任务开始,让学生一开始就有一种职场的环境,并采取团队合作的方式,三五人一组,实行同学间帮扶、老师指导、团队合作的方式逐步提高同学们的专业职业能力。
2.3.1 模拟工作环境,精心为学生设计典型的工作任务
在知识的学习中,以“任务”为引导的真实工作环境教学,真实地模拟工作环境,给学生切实可行的工作任务。同时,还要对任务中的学生进行了解和观察,根据他们的兴趣设置合理的任务,把实际工作的场景带到课堂中去,让学生不单单是处于课堂的学习,更要有一种置身于工作的体验。使学习与工作融为一体,更加有效地驱动学生前进。
2.3.2 工作场景中的“项目”导向学习
在学生掌握了基本的知识后,就应让学生真正置身于工作环境中,在工作过程中提高自己的水平,在工作过程中学习的另一个方法就是给其设定“项目开发”的工作任务,工作场景中以“项目”为主导的核心理念是“以学生为主体,以项目为推动学生前进的动力,以教师指导为辅助手段”,它强调在工作过程中以项目开发为整个工作任务,把所学知识综合运用到给定项目的开发中,在整个开发过程中他们会发现自己的薄弱环节,能够更清楚自己在哪方面的欠缺,从而提高他们自己在此方面的学习动力,并且能提高他们团队合作的意识。
3《网页设计与制作》课程的考核标准
3.1 课程考核标准
本课程的考核标准由以下三部分构成:学生的职业素养、学生的专业基础知识、学生的专业技能。各部分的具体内容如下:
学生的职业素养:学生在工作中的工作态度、团队合作精神、再学习的精神及职业道德。
学生的专业基础知识:各种文件的设计规范、命名规范、HTML+CSS的编写规范、图像处理规范,整站建设、维护及优化等专业基础知识。
学生的专业技能:网站策划能力、网站规划能力、图像处理能力、网站的设计与制作能力、网站的开发能力、网站维护能力及网站优化能力。
对学生的专业基础知识考核主要以日常的教学基本目标为准则,对职业素养的考核主要是以学生在团队中的表现为基准对其进行多方位的考核。
考核的原则以学生掌握的专业基础知识和专业职业技能为重点,以职业素养为辅的考核原则,对于职业素养,一般是在平时的团队合作中完成,对于专业基础知识的考核主要是在平时的工作任务中进行,而对于专业职业技能则主要是在开发的项目案例中进行。各部分考核的比重如下:专业职业素养(10%)+专业基础知识(30%)+专业技能(60%)=100%。
传统的《网页设计与制作》课程考核标准侧重于对专业的基础知识的考核,目前我们对于学生能力的培养主要以职业能力为目标,所以我们制订的新标准应侧重于对学生职业能力的考核,更加注重对学生走向职场的综合素质的培养。
3.2平时成绩考核
1)出勤和课堂案例策划:对于缺勤、迟到或早退都要扣相应的分数,对到课堂上布置的案例进行分析的同学都有记录,会有加分。
2)平时作业:课程最初阶段我们是以小的任务作为课堂作业,而当课程进行到接近一半的时候,我们会要求学生选一个主题作为网站的名称,开始网站的建设之路。这个简单的网站制作和平时的工作任务作为平时的成绩。
3.3 期末考试成绩
期末考试的作品对学生的要求比较高,教师提前一个周对学生布置一个主题,要求制作一个中小型的网站,要求在一个周内完成。以公司对员工作品的要求的标准对学生的作品进行考核,检测学生对整站创作的理解、对创意、设计、题材理解、网站内容规划、图像处理能力、动画制作能力、色彩理解能力、网站布局、站点管理、网站上传下载、网站优化等综合能力。
关键词:网页布局;网页编程;课程衔接
中图分类号:G712文献标识码:A文章编号:1005-1422(2015)12-0073-02
国家近年来大力发展职业教育,习近平总书记强调:职业教育是国民教育体系和人力资源开发的重要组成部分,是广大青年打开通往成功成才大门的重要途径,肩负着培养多样化人才、传承技术技能、促进就业创业的重要职责,必须高度重视、加快发展。在珠三角洲,IT行业(互联网)的发展需要大批低端工作人员,而中职学校设立计算机专业,目的是为IT行业输入预备和基层人员。网页布局(Div/Css)和网页编程(C#)作为计算机两门专业课,分别在第二第三学期展开教学,但两门课程分别面对前端和后台,侧重有所不同,而且一个是过程性语言,一个是面向对象语言,如何做好课程之间的衔接,让学生从前端走向后台,完成一个网站工作人员的转变,笔者身为计算机专业一线老师,为两门课程之间顺利和有效衔接做出一番研究。
一、按照学习环境和中职学生特征设置课程
中职学生是研究对象,特征是思想未成熟,理论基础不扎实,抽象思维差,学习方法效率低,学习自主性差,但身体和心理处于年轻态,对新生事物敢于尝试,敢于接受,接受老师鼓励和表扬等正能量,有兴趣的科目可以坚持学下去,大多数理科学生心理素质好。学习环境是经过第一学期学习之后,已经完全熟习中职学习环境和规律,从应试教育转变为技能教育,掌握计算机基本使用技能,培育了一定计算机素养,在第二个学期可以展开网页布局的学习。
网页布局,从网页基本操作入手,利用工具Dreamweaver,掌握网页各要素(html标签、表单各要素、模板页)到可以独立完成静态网页的制作,熟习Div/Css的基本概念,并能被用来完成网页布局,期间涉及到网站前端知识。课程要求是:学生可以掌握布局的技能,在给出的页面设计图的前提,可以独立完成切图,并用Div/Css作出具体布局,可以实现二级菜单,并在页面加入flash或JavaScript等广告banner。
当学生熟练前端知识之后,有了理论和实践基础,进入第三个学期的加深学习,正式进入有关后台的学习。针对目前最流行的开发平台Visual Studio和开发语言C#,本校采用了上述环境和语言,要求是掌握Webform的开发,内置对象、表单和控件、SQL server数据库以及一个小型后台开发。制作后台一般有登陆、注册、发布新闻、增加修改删除新闻的功能。在学习过程中,让学生在学习编程基本理论和思路,培育面向对象编程的素养,提高学习的兴趣和自主能动性。为第四学期小组合作完成一个有前端和后台的网站而打下基础。
二、如何做好衔接工作的具体举措
Div/Css属于网页前端知识,Asp.Net属于后台开发语言,如何做好两者之间的衔接,让学生可以从网页前端世界从容进入后台开发,这就是笔者在实际工作中遇到的问题,经过一番研究,特将研究结果列出如下:
1.课前要做好战略上的准备
在所有的网页课程展开之前,做好战略准备。要跟学生陈述清楚本课程的最终目标:无论是前端Div/Css,还是后台的Asp.Net,它们都是为网站而服务的,也是一个完善的网站要包括前端的与客户视觉交互,还包括后台各项核心功能的实现。举个例子,人要有外表和内心才是一个真正的人。按照Web标准提倡的表现、结构和行为分离原则,前端主要体现在表现和行为,后台可以体现在结构和行为。两者要既相互独立,又互相联系。思想在前行动在后,战略目标一旦提出,一切有根有据,有章可循,有理可依。
2.讲授Div/Css要做好启后工作
Div/Css和包含它本身的html是过程性语言,对于初学语言的中职生来说,由于学习者自身有抽象思维不强,逻辑分析能力不够的弱点,Html和Div/Css不失为比较好学的入门语言。学生可以在可视即可得的视图中接触语言编程过程,既可以学习编程的基础知识,又可以培养编程的长期兴趣。不过,Div/Css不过是中期目标,也是中介和过渡手段。因为就根本而言,过程性语言有其简单易用的优点,也有提炼不够,封装不够好的缺点,面对复杂多变的编程世界,还是需要面对对象语言来提炼,才有更好的可读性和可扩展性。好比一个人光有学会数数和算数其实不够,还需要更多数学知识才能对现实进行归纳。光有前端而无后台网站,很难吸引浏览者长期的兴趣,生命力不强。
3.讲授Asp.Net要做好承前工作
C#是一个语言,.net是一个平台,上面支持用C#语言。C#不但可以开发基于.net的应用程序,也可以开发基于WinForm的程序。C#是事件驱动的,完全面向对象的可视化编程语言。前面说了,一个网页光有缤纷绚烂的前端效果是不够的,还需要功能强大的后台作为持续发展。举个例子,正如人不但要一个美丽的外表,更需要一个强大的内心,才能在人世间走得更高更远。在进入C#学习之前,可以先复习一到两周的Div/Css和JavaScript,做一些简单的复习,才正式进入。复习可以是盒子模型,div页面居中,一级菜单,插入图像,图片列表等。这种承前工作是必须的,才令到C#的学习不显得突兀和生硬。
4.可以用一个网站作为项目教学实习两门课程的衔接
对于职业教育,理论不是最终目标,技能的掌握才是目的,所谓纸上得来终觉浅,百讲不如一练。在讲授中,有个网站可以实现前端到后台的衔接,是最好的教材和最合适的展示。笔者亲自制作了一个网站,可以实现前台的Div/Css布局,JavaScript的动态效果,还有后台的登陆和注册,后台管理页面的展示,密码的修改等功能。在讲授Div/Css的实训阶段,可以将网站界面设计图交给学生进行切图后进行布局,作为项目教学的一部分,增强学生的布局能力,提高学生布局熟练程度;在Asp.Net的实训阶段,将静态网页交给学生之后,再将静态页面转换为动态页面,而且可以将后台分模块:登陆模块、注册模块、后台管理页面模块、密码修改模块、新闻编辑模块和新闻发布模块,完成静态到动态的衔接。在网站不断完善过程中,完成知识讲解和技能训练, 达到以面带点的效果。
5.行动研究证明:衔接带来的效果
笔者从计网13级到14级,通过两个年级6个班的网页布局和编程教学,经过两轮行动研究表明:顺利和有效做好网页布局和网站编程的衔接,有助于提高学生网站前端效果制作能力,增强后台建设能力,为第四学期学生小组合作完成网站打好基础。以下是学生最后网站作品之一。
三、总结
教学无小事。笔者在中职学校已经有15年的一线教学经验,感受到过程比结果更重要。只要能留心日常教学的一丝一毫,发出疑问,经过思考,是可以帮助到学生更好地学习,从而改变思考习惯,改变人生。顺利和有效做好课程衔接,是促进学生学习,提高学习效率的途径之一。本着初衷,笔者继续投入职业教育工作,为国家职业教育事业尽一份力量。
参考文献:
[1]韩琦,张建军.中、高职课程体系的衔接设计[J].长沙铁道学院学报(社会科学版),2014(08).
[2]周仕德.课程衔接:亟待研究的课程视域[J].教育理论与实践,2010(25).
[3]胡春光.课程衔接:含义分析、学理基础及主要问题[J].武汉商业服务学院学报,2010(04).
1、网站设计和运营维护中的设计工作;
2、网站的FLASH和GIF动画设计制作;
3、网站发展中涉及到的视频处理和片头动画。
任职资格
1、会优化网站;
2、具备三年以上网站设计工作经验;
3、从事过大型门户或专业性网站的设计工作;
4、有全面精通应用Photoshop、Flash、Illustrator、CorelDraw等软件的能力;
5、具有较高的平面设计表现力和创意能力;
所以我们的问题是自由网站设计者未来的5年会怎样?这会对你有什么影响?下面有5方面的预测:
全球化程度越来越高
互联网上的世界简直是太缤纷多彩了。我曾经遇到来自东欧的杰出程序员、来自澳大利亚的的不可思议的博客、来自南美的杰出美工。不难看出,全球化正在给商业带来巨大的影响。自由职业者可以给自己一个定位,通过做外包更快的成长,同时你可以利用充足的人力资源库。所以,如果你的最佳承包商来自印度,你的顶级客户来自西班牙,你的网站最忠实的访问者来自加拿大,也不要感到惊讶。
富界面应用程序的崛起
正如在最近的海报的提到的,WEB应用程序正变得更加深入,更具互动性。正是由于这些技术,越来越多的软件和数据都在往互联网上转移。对于自由网站设计者,这意味着:第一,那些已经接受了互联网文化的人会有更多的需求;第二,想要继续把握住机会,继续有饭吃,就必须与时俱进。在九十年代后期“懂一点HTML和图像处理”仍能找到一份很好的工作,当然,现在这句话早就不适用了,
所以,当你展望未来的时候,当心类似的陷阱,要时刻关注和吸收新技术。
战略家站得住脚
说实话,同样的工作,可能有人比你做得好,可能有人比你收费低,也可能有人既比你做得好又比你收费低。正因如此,现在越来越多的网络工作人员把自己定位为“战略家”。一个Flash或者CSS程序员很容易找到外包项目(以后几年正能会更容易)。所以,超越仅仅只做一件事的层面吧。做一个能够在遇到问题时拿出解决方案的人。拥有你自己的承包商和客户。把你自己变成一个能够让客户第一个想到的人。如果你做到这一点,你将变得很难替代,你就能够在未来的互联网领域叱咤风云。
门槛越来越高
在八十年代初,当PC游戏业仍处于起步阶段的时候,许多个人开发者和他们的小团队靠做一些很酷的游戏(如理查德‧盖瑞特的创世纪系列和席德梅尔的文明)出了名。然而到了九十年代和现在,游戏都变成了需要有数百万美元预算和上百人的开发团队的庞大产品。行业的成熟意味着门槛的提高。网络设计也会遵循同样的规律。尽管许多任务,比如付款处理和购物车技术已经变得比较简单,但大部分网站的解决方案都包括像搜索优化,搜索引擎营销,社会营销,内容管理模块,与其他网站交互等一些复杂的技术。这意味着必须接受更多的培训,积累更多的经验,才能在网络世界里驰骋。所以尽管通过一定的学习和经验还是能够很容易的闯入网络设计领域,但你要明白,学习曲线仍然在增长。
更多机遇
由于该类软件非常多,今天笔者就为大家推荐几款功能比较强大,但又十分容易操作上手的网页特效软件。只要你学会了这些软件的使用方法,一定会使网页有旧貌换新颜的惊人变化!
有声有色2007
《有声有色》(下载地址:http://cn.coolboo.com/musrea.htm)是一款功能强大的网页特效软件,它集合了518个十分精彩的JavaScript小程序,每一个特效制作窗口均为可视化制作界面。所有特效操作只需要轻点几下鼠标就可完成!而在2007最新版中。更是新加入了“动感XP菜单”、“鼠标动态旋转文字”等48个极酷的特效。下面我们以插入一个特效到网页中的操作过程。来介绍如何使用《有声有色》。
1、启动《有声有色》,在软件界面的顶部为特效的分类按钮和软件功能按钮,其中包括极酷特效、经典特效、立体特效、极品特效、最酷特效、最新特效、动态链接、动态图像、网页常用、标题栏/状态栏、其它特效、精品特效、动态文字、动态窗口、时间日期、人物动作和游戏娱乐共十七种特效类型。除此之外,还提供了搜索特效、实用功能和界面设置三个按钮。在软件界面的底部为退出、关于、帮助和注册按钮。
2、单击“最新特效”分类按钮,选择“最新特效”类型,然后单击“羽化图片”按钮。会弹出“特效制作:羽化图片”窗口。在该窗口中,单击“图片文件”后的浏览按钮。可以在一个弹出的新窗口中选择要添加羽化效果的图片;单击“图像数目”选项中的上下箭头,可以改变要添加图像的数目;在“超级链接”选项栏里可以直接指定单击图片后指向的网页超级链接。在“提示信息”选项里则可以指定鼠标移动到图片上面的时候出现的提示信息。单击“增加”按钮,便可将特效添加进选中的图片了。设置完毕上述参数信息后,单击“复制”按钮可将特效代码复制到剪贴板中,这样你就可以在网页编辑软件中直接粘贴这些代码进去了。
3、接下来,我们还可单击“发布”按钮。发布网页特效。单击此按钮以后,会弹出一个“发布”窗口。在“特效发布”窗口中。分为“文件操作”和“特效操作”两部分。在“文件操作”选项中。有“增加”、“删除”和“清空”三个按钮。单击“增加”按钮。可选择要将特效加入到哪个网页中,也可选择多个网页文件,或利用“删除”按钮删除文件列表中不需要添加特效的网页文件。在“特效操作”选项中。单击“预览特效”按钮后,你就可以利用打开的“特效预览”窗口预览效果了。
4、另外,我们还可以使用“搜索特效”功能,根据“特效简介”和“特效名称”快速查找想要的特效,很方便哦!而在“实用功能”选项中,还提供了“系统功能设置”和“附加功能”两部分,你可以根据自己的需要选择相应的功能,比如内码转换、加密网页或压缩网页等。
网页特效专家
《网页特效专家》(下载地址:http://WWW.see200.com/XIAZA/WYTXZJ.HTM)是一款功能非常强大的网页特效软件,它的特效多达数百种,而且还有好听的背景音乐。更令人心动的是,它还可以让用户添加自己制作的特效。下面笔者仍以在网页中插入一个特效为例,说明它的使用方法。
1、启动《网页特效专家》,你会发现这个软件的操作界面看上去很复杂,实际上很多功能我们并不一定全部用到。首先在界面左侧“特效”栏中选择一种喜欢的特效,在这里笔者选择了“鼠标不断冒泡泡”特效,这时会在界面的主窗口出现网页特效代码。
2、全部选中网页代码,然后单击“复制”按钮。将这些代码复制到剪贴板中。再使用网页编辑软件打开要加入网页特效的网页,将代码粘贴进去就可以了。单击“本地预览”按钮可以预览我们选中的网页特效。
这款软件还有其它一些功能。比如背景音乐功能,只需选中“音乐”菜单相应的音乐类型即可。由于这些功能的使用方法都很简单,这里就不再详细介绍了。
网页特效秀
《网页特效秀》(下载地址:http://www.skycn.com/soft/14536.html)中整合了几百个JavaScript网页特效。而且每一个特效制作过程都是可视化的,我们只要点几下鼠标,敲两下键盘就可完成操作。另外它还提供了多种界面供用户随意选择,如果你是第一次使用它。也可根据提供的详细提示,轻松完成特效的加入。下面我们就来一起看看《网页特效秀》的使用方法。
1、启动《网页特效秀》。在软件上方有代码中心、代码收藏、实用工具、模板库和设置等五个按钮,我们经常用到的是“代码中心”这一部分。
2、在“代码类型”下拉菜单中。可以选择我们要使用的特效类型,共包括文本与链接特效、页面类特效、鼠标类特效、窗口类特效、图片类特效、日期与时间特效、游戏与娱乐特效、菜单类特效和其他类型特效等九种。
3、选择“页面类特效”中的“loading(进度条式的)”特效。在右侧会出现该特效的详细参数设置,比如loading显示的提示、速度、颜色和loading结束后载入的网页文件。
4、单击“效果预览”按钮,可以打开特效预览窗口。
5、单击“生成代码”按钮,可以打开网页特效代码,将这些代码复制到网页的
区域内即可。你也可以单击“插入到文件”按钮,打开“插入到文件”设置窗口。单击“浏览”按钮,打开要插入的网页文件,然后单击“插入到文件”就可以了。至此,笔者对几款常用网页特效软件的介绍就结束了。对它们有了初步的了解后,你就可以尽情体验它们所带来的乐趣,让自己的网页在瞬间变得酷炫缤纷了!
在线DIY个性化产品
Bush
随着DIY风潮的盛行,各类DIY产品开始出现在我们的视野范围内。但由于创意和技术的问题,并不是很多人都能拿出十分像模像样的DIY作品来,因此这种创造的欲望自然也就无法得到满足了。不过笔者最近发现了一个在线设计个性产品的站点,试用后感觉还可以,下面推荐给广大的读者朋友,让大家也一起过过DIY的瘾。
登录站点http://cn.hipicture.com/tw/tshirt_1.php?gid=TGA571248E4EFE。当你点击“另类、时尚、可爱卡通、动感”标签时,界面下方显示出的“前景、背景、物品”中的内容也会相应发生变化。首先选择喜欢的类别,然后再从该类别陈列出的物品中选择相应的物品。点击鼠标即可将其添加到中间的编辑界面中。
图形元素添加完备后,我们接下来再用文字来丰富画面。点击左下角的“加上文字”按钮,在弹出的窗口中。在“文字”区域输入需要的文字,在“大小”项下拉菜单中选择字体大小。在“颜色”项中调整出喜欢的颜色,最后从列出的字体特效中选择喜欢的字型,完成后点击“OK”按钮即可将其添加到物品上。
【工作室网页】推荐阅读:
网页设计工作实习报告04-10
网页设计美工工作总结报告03-29
网页设计师的工作职责说明03-24
创新工作室工作计07-10
名师工作室工作愿景11-25
名师工作室工作日志01-23
教师工作室工作总结06-04
创新工作室工作规划12-10
心语工作室工作制度03-06
数学工作室工作总结03-25