2024年网页制作入门知识 篇1
开门见山吧。1、软件选择
常用的有dreamweaver, expression blender等,建议先学习dreamweaver,dreamweaver自带的代码提示功能与可视视图。对于小白来说,是个容易上手的工具。2、书本与网络教程
书本先熟悉html标签与css语言的用法,书本上的实例,跟着做。有时间经常做练习。对于一些理解困难的问题多做笔记,去网上查,一些博客分享的案例都写的很详细。网上有一部分免费的课程,如腾讯课堂、YY教育学习平台等。还有一些问答平台。如在头条的悟空问答里提问,里面有不少高手。3、案例分析
在网上多看看如头条、阿里、腾讯网站的布局。网页布局是一个个DIV盒子组成,分析DIV的层级结构,学习制作页面的规范,如DIV的命名、注释等。规范对网站的维护与团队协作起到了很重要的作用,提高了效率。还有一点,你跳槽了,工作交接到另一位小伙伴手上,不至于另一个人接手看不懂。4、借助工具
借助浏览器自带的检查工具。一些浏览器都自带检查工具。如谷哥浏览器的“检查元素”、IE的“检查元素”、火狐的“查看元素”等。如谷哥右健的“检查元素”,可以清晰的 看到代码层级、标签元素、对应的CSS样式,可以让你马上检查出问题的所在。5、向高人请教
项目比较急的情况下,自己研究费时间、到网上找答案不全面。这个时候就要找你的同事、朋友请教了,注意对别人客气一点,有求于别人嘛。把问题用笔记本一次性全部记录下 来,再向别人请教。解决问题的方法与结论做详细的笔记,免得一个问题反复的问别人,大家都很忙的。6、总结经验
在做项目的时候,定期总结,碰到的一些难题,刻意的多做几次,有利于加深理解。下次做同样的项目,问解就很快的解决了。这样提升了效率,不至于每一次都去百度上找答案。7、加强JS的学习
建议先学习原生的Javascript后面对熟悉各种框架非常有用。如Jquery ,Vue, Angular等。
最后保持持续学习的心态。欢迎大家补充!
2024年网页制作入门知识 篇2
最近因为要做一个小型的网站,需求很简单有点像公司内部的管理网站,和室友一起倒腾,发现了一些坑。我自己之前没有接触过python 但是发现真的非常好上手。
我们没人会前端,所以最怕修改网页,一开始选择了Flask框架,我搞了半天遇到各种坑(还要修改css 麻烦),中间件也不好用,劝大家用django,资料多,非常好用。
那么开始说重点,需要做的哪些东西。
http://python.usyiyi.cn/ 是主要的资料,里面是中文的资料建议一点点看下去。
1-项目环境搭建。
1.1第三方库准备
开发环境是mac os 和ubantu 推荐大家下载一个第三方的软件叫 "Anaconda" ,安装非常简单,直接运行脚本就好。
安装完了,可以到命令行运行 pip list。可以看到已经安装的python第三方库 。
此时我们是没有django的库的。
1.2IDE的安装
IDE 使用eclipse,讲一个工具Pydev,安装自行百度,点点就行。
然后 到Eclipse了 New->Project->Pydev->Pydev Django Project,一路next 。发现eclipse 找不到Django 环境,回来点击 click here to configure an interpreter 然后把python interpreter 中的名为python的删掉,那是系统默认的,改成anaconda目录 下 bin/里面的python。默认是2.7.11吧。忘记安装目录?一个命令 sudo find / -name anacon* 搞定~。找到以后加进去,到了图一这一步就结束。
(图1)
2-数据库配置和使用
2.1数据库连接文件配置
我选了mysql,当然在这之前mysql的帐号密码应该自己确定了吧。mysql配置应该简单。但是如果要支持远程访问,比如你把数据库放到云上,别人机器上,毕竟开发不是一个人的事,我自己遇到的坑是"关于 mysql 配置文件中的 bind-address",自行百度,解决方案是删除就好。(推荐几个mysql 连接的桌面软件,用Navicat ,或者mysql workbench 都是不错的)。(后来发现这里输入密码和帐号没什么用还是要去修改在与项目同名的app里面的setting)。现在在mysql自己创建一个database 取名随便。我叫test,其他字段应该不用解释了如图2。
(图2)
2.2创建APP(模块)
然后我们在工程里根目录右击->Django->Create App->输入名字就好。因为网页主要是MVC模式,创两个吧。一个叫db 专用于管理数据库(models 层) 第二个专用于后台逻辑。名字随便取因为可能要对应多个模块。django里面增加一个app 就需要在与项目同名的那个app的setting中Installed_app里面加入app名(如图4)。我们加入以后目录结构(如图3.)
(图3)
(图4)
2.3用django模型层建表
数据库正式开发,数据库创建,在db的models.py中 对应数据库中每个表写class,就是定义好字段,因为Django的目标是要程序员完全脱离数据库的操作。那么我们先不建表,cd 到你的工程目录去,用命令行 用打入 manage.py migrate 命令。效果如图5。
(图5)
如果你的配置是没错的,此时django 已经在你的数据库中建了很多表,都是django自带的,我也没有用起来,唯一用的是django自带的数据库管理界面,类似于Navicat,还支持搜索功能,自己去文档里 http://python.usyiyi.cn/django_182/intro/tutorial02.html 学吧。
然后在db的models里写一个表的代码。然后效果如图6 还是用了Manage 脚本。from __future__ import unicode_literalsfrom django.db import models# Create your db here.class Message(models.Model): user_id = models.BigIntegerField(blank=True, null=True)
(图6)
到这里表都结束了,实际开发中,我数据库都是先建好的,那我全部都要写每个类是不是很麻烦,有没有偷懒的办法呢?
答案是用./manage.py inspectdb
用了就知道,他会反向生成表的代码, 然后直接复制进models里面就好了。
3-url 解析
3.1url匹配处理函数
在Django中 一般url解析分为两层。
第一层负责解析APP的名,像我在test 里urls.py里写的(如图7)。第一个参数表示响应的url,第二个参数表示处理的模块。
(图7)
第二层是解析到具体的模块中的某个函数来响应对应的url。
比如在view app 中的urls.py(需要自己创建) 写的(图8)url(函数中第一个参数为匹配路径,后一个是对应函数名)里面的home对应view app中的views.py 里的函数home
(图9)
3.2静态网页配置
其实到这个时候已经可以实现响应了。(到这里还要解决一个问题 'Index/home.html')在哪里呢?我们此时创一个文件夹叫templates html都应该放在这里,Index 是一个模块的名字。你可以在templates下面建很多个文件夹,对应很多的APP模块。(html就不属于本文范畴了)此时目录结构为
(图10)
搞定了后别忘记在test的setting 里加上一句代码
(图11)
"就是DIRS"里面.想想也是,不然 Django怎么知道我们的html放在这里呢。
4-逻辑层(也就是最后一步了,怎么样把数据库的东西查出来,放到html中。)
4.1数据库中的数据
往表里插两条数据
(图12)
4.2动态显示数据
看下代码:html部分
(图13)
里面的{%%}是django 自带标签的自己看文档学一下就会。
(图14)
里面的Message.objects.all() 表示从Message表中取出所有数据。还有什么复杂查询自己看文档,一般都是filter exclude,django 还支持sql语句直接写,函数名叫raw().
context就是返回给页面的一个对象里面放了很多值。在python里叫字典(dict)
4.3启动服务器
最后我们用命令行来到我们的目录,敲./manage.py runserver (要支持所有端口 和外网访问加0.0.0.0)。然后出现
(图15)
4.4查看网页
再到浏览器敲127.0.0.1:8000 django默认端口 (图16)
4.5实际开发中问题
结果出来了。遇到具体问题就是查一些文档和stackoverflow。发现一个时区问题,建议和我改成一样。把test里面setting中的时区部分改成这样。否则你会有八个小时的时差,
(图17)
。还有啥问题可以和我讨论的可以留言。小弟也是刚做完这个项目从零开始。码字不易~小问题就不在这里说了。
界面日志界面
管理界面
评论界面
使用的技术python、JavaScript、CSS、htmlMySQL 数据库jinja2 模板引擎Vue.js 界面框架Nginx Web服务器gunicorn WSGI服务器Supervisor 监控服务进程工具Fabric 自动部署工具
学习过程
刚开始跟着作者的教程编写这样一个博客网站的时候感觉很困难,因为自己对web上的很多概念不了解,对web服务器是怎么运行也不清楚,所以不知道作者为什么要这么写代码。后来去学习了Django,知道了什么是ORM,什么是模板等一些概念后,并且能够使用Django搭建一个网站,再跟着作者学习就轻松了一些,希望我的学习过程对你有启发。当然,如果你只想快速的搭建一个网站,可以使用Django、Flask等免费开源的网站框架,而不用自己一步一步的去实现它。
2024年网页制作入门知识 篇3
、一流的网站制作师需要掌握什么软件如果仅仅是设计网页,熟练掌握photoshop、IIIustator、flash等这些平面设计或者动画设计软件就行,有些又称网页美工,而制作网页,就需要使用dreamweaver、dw、PageAdmin系统等一些网页制作方面的软件了,当然,对代码的熟悉,明确网站主题和内容,熟悉HTML/CSS/JS等网页基本元素也是必要的。其实很多朋友纠结的这个问题,无非是没有准确定位好自己将来的目标,自己现在的基础等等,不管是网页设计还是制作,都是一套系统的学习流程,如果真的想学,去这个群,前三位:464。中间三位:245。最后三位:307。当然了,既然是学习,三天打鱼两天晒网的心态是断然不行的。不做好努力的准备,浪费了自己的时间,也浪费了别人的时间,难道不是吗?二、为什么说掌握html就能掌握网页制作html究竟是什么,说的简单一点,你打开一个网页、然后再网页任何一个地方点击鼠标右键、然后选择“查看源文件”、点击过后将以记事本的形式打开、里面的就全是HTML代码。可以说,学习网页制作,代码师核心,不管你是天才,还是普通人,这一项必须要学。网页制作是动手性很强的知识,所以学习html也需要系统的规划,不是说简简单单找几本资料就可以了。三、关于html可以说这是最基本的知识,也是最难掌握的。如果HTML知识掌握得好,可以用记事本就可以熟练编写网页(当然,不推荐这么做,因为有现成的工具可以帮助编写HTML,但拥有这种能力是很好的)会对日后使用编辑主页,编写ASP或PHP代码有极大帮助。四、说说你不知道的设计师的地位因特网正在改变世界,它促成了网络经济雏形的形成,特别是电子商务正由新概念走向实用化。由于因特网具有传播信息容量极大、形态多样、迅速方便、全球覆盖、自由和交互的特点,已经发展成为新的传播媒体,所以全球几乎各个企业、机构纷纷建立自己的Web站点。并且由此产生了一个新的工作岗位——网站设计(Website Designer)和网站管理者。这也就是为什么很多年轻人追寻这个行业,简单来讲,就是高新。五、为什么很多同学学了很久还是不会做?这个问题是大部分想学习网页制作的同学都面临过的一个问题,学了很久,到头来还是和零基础差不多。这就是没有定位清楚自己的水平。如果你什么都不懂,上来就去背一些代码,上来就学习如何编写之类的,假以时日之后,你还是什么都不会。所以老老实实的定位自己,从基础的开始,还是那个概念,系统,学东西就要系统,没有一套系统的头脑,做什么都是很困难的。六、最后——合适的工具尽管选择什么样的工具并不会影响你设计网页的好坏,但是一款功能强大、使用简单的软件往往可以起到事半功倍的效果。网页制作涉及的工具比较多,首先就是网页制作工具了,目前选择比较多的就是dw,除此之外,还有图片编辑工具,如firework 、Photoshop 等;动画制作工具,如Flash等;网上有许多这方面的软件下载,你可以根据需要灵活运用。