목차
回复内容:
웹 프론트엔드 H5 튜토리얼 零基础如何迅速学习HTML(或HTML5)?

零基础如何迅速学习HTML(或HTML5)?

Jun 07, 2016 am 08:41 AM
html html5

由于从事新媒体推广工作,现在在移动端流行“高大上”的HTML5。作为代码零基础的我,该如何迅速学习HTML(或HTML5)?不要求学会做游戏应用这些,只想学会做简单的滑动页面、跳转即可。
或者可以提供一些快速有效的入门书籍或者视频、技巧也可以,谢过各位大神~

回复内容:

从题主的问题来看,

“由于从事新媒体推广工作,现在在移动端流行“高大上”的HTML5。作为代码零基础的我,该如何迅速学习HTML(或HTML5)?”

所以下面分两种情况来分析:


1.如果题主零基础的情况下想去学代码的话,就得把HTML5、CSS3、JavaScript三个一口气都学了,这样就不需要各种求供应商和技术了。

这种情况下建议题主在网上学习+课本学习同步进行

网上学习强推网易云课堂上浙大的翁恺老师的计算机课程。

其一,翁恺老师本身就是高校里面的人气教师,讲课简明生动,很适合初学者入门【之前学过一些计算机课程,因为太过晦涩,对程序语言甚至有点心理阴影,所以初学者学的课程还是要谨慎选择】。

其二,翁恺老师在网上授课已经有蛮多经验了,也不会出现什么讲课中途遮住了PPT,代码看不清等等诡异的问题。。。

其三,网易云课堂上的三门课程都已经整理完毕,方便学习,平台也比较稳定。而且这些课程完全免费,每门课都有几万人在学【卖不了吃亏也买不了上当=、=

HTML5入门:HTML5入门 - 网易云课堂

CSS3:CSS3 - 网易云课堂

JavaScript:JavaScript - 网易云课堂

书的话,还是推荐一些经典的吧:

《Head first HTML&CSS》:入门级必备,难度合适

《JavaScript DOM编程艺术》:同样入门级教材

《HTML5权威指南》:内容全面,进阶阶段可看

《JavaScript高级程序设计》:JS圣经,殿堂级教材

建议交错搭配学习,加深理解,不过这样学习来比较费时间就对了

2、如果只需要能制作出简单的H5页面,就可以绕过代码这关,善用各类H5制作平台,应该都能轻松上手。

Maka:MAKA.im | 简单、强大的HTML5创作工具

印象中是最早开始做H5页面的平台之一,目前只有web端没有移动端,但网页上各类模板齐全,动态效果和交互也做得不错,只要自己填充内容就好,简单易上手。

初页:初页 - 优质H5手机页、微信海报

和maka不同,专门做移动端的,也有一些预设的模板,支持添加文字、图片、音乐等,方便在手机上直接制作,胜在速度。

秀制作:秀米 XIUMI

来自微信公众号排版常用的工具秀米出品,可以和秀米配合使用,目前也只有web端。

Epub360意派:Epub360意派-专业级H5微场景设计平台

模板不多,但自由度较高,适合有设计感的设计师来操刀制作,发挥交互功能,不过只能免费制作10个,而且作品还自带logo,有ipad版和web版。

书就不必了,先从www.w3schools.com入门,之后各种杂七杂八的问题百度足矣。 去幕课网看视频 学习代码和学习英文不一样, 你需要花费10%的时间去 “学”, 再花90%的时间去 “习” ,特别是前端相关技术,你连续做15-30个小案例,基本就能做基础的开发啦, 个人推荐你使用 “学和习” 整合解决方案: 课程库 极客标签 其实你这个问题在网上有很多答案。我建议你先Google或者百度它。
World Wide Web Consortium (W3C) 是我最推荐去的地方。HTML5在HTML5
实在需要点书的话我觉得你可以看一下这个问题:有哪些关于前端开发技术(HTML、CSS 和 JavaScript 等)的值得推荐的书籍? - 书籍推荐
把这里面的前几个答案看完你或许会有新的收获。
但是我觉得单单HTML或者HTML5的知识不够应付一些实际情况。HTML+CSS+JS最好一块儿学。
英语不好且没有编程基础的话,我和前面的各位一样推荐:w3school 在线教程 codecademy.com
w3schools.com 先说一个免费的网站,慕课网有完整的教程。
每个例子都去实践。把HTML+CSS+JavaScript部分基本学完。例子也学完。
但是感觉还是不能开发什么东西。然后百度前端技术学院!可能不是开放时间。不过没关系。里面内容可以去实践。
一个一个人物敲过去。应该就有还不错的水平了。继续学习吧。 建议题主直接从视频教程看起
先看html+css 然后html5+css3
推荐:html5 教程 非常适合初学者学习
有时间的话,题主最好再学下js、jq、ajax等
希望对题主有帮助 推荐个网站:Vxplo,可以在线制作你想要的互动效果,还有教程。 lynda.com提供了很多不错的课程。
HTML Essential Training很适合入门,另外还有一些HTML5的前沿技术API的专题,建议从基础开始,循序渐进。
课程是视频形式,且作者会根据需要更新自己嗯课程,但又不像普通的公开课视频,一个课程的每个视频都不会超过10分钟,不会出现像公开课看久了枯燥的状况。
关于下载的问题,一般在kickass.to可以搜索到
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.

핫 AI 도구

Undresser.AI Undress

Undresser.AI Undress

사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover

AI Clothes Remover

사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool

Undress AI Tool

무료로 이미지를 벗다

Clothoff.io

Clothoff.io

AI 옷 제거제

Video Face Swap

Video Face Swap

완전히 무료인 AI 얼굴 교환 도구를 사용하여 모든 비디오의 얼굴을 쉽게 바꾸세요!

뜨거운 도구

메모장++7.3.1

메모장++7.3.1

사용하기 쉬운 무료 코드 편집기

SublimeText3 중국어 버전

SublimeText3 중국어 버전

중국어 버전, 사용하기 매우 쉽습니다.

스튜디오 13.0.1 보내기

스튜디오 13.0.1 보내기

강력한 PHP 통합 개발 환경

드림위버 CS6

드림위버 CS6

시각적 웹 개발 도구

SublimeText3 Mac 버전

SublimeText3 Mac 버전

신 수준의 코드 편집 소프트웨어(SublimeText3)

HTML의 테이블 테두리 HTML의 테이블 테두리 Sep 04, 2024 pm 04:49 PM

HTML의 테이블 테두리 안내. 여기에서는 HTML의 테이블 테두리 예제를 사용하여 테이블 테두리를 정의하는 여러 가지 방법을 논의합니다.

HTML의 중첩 테이블 HTML의 중첩 테이블 Sep 04, 2024 pm 04:49 PM

HTML의 Nested Table에 대한 안내입니다. 여기에서는 각 예와 함께 테이블 내에 테이블을 만드는 방법을 설명합니다.

HTML 여백-왼쪽 HTML 여백-왼쪽 Sep 04, 2024 pm 04:48 PM

HTML 여백-왼쪽 안내. 여기에서는 HTML margin-left에 대한 간략한 개요와 코드 구현과 함께 예제를 논의합니다.

HTML 테이블 레이아웃 HTML 테이블 레이아웃 Sep 04, 2024 pm 04:54 PM

HTML 테이블 레이아웃 안내. 여기에서는 HTML 테이블 레이아웃의 값에 대해 예제 및 출력 n 세부 사항과 함께 논의합니다.

HTML 입력 자리 표시자 HTML 입력 자리 표시자 Sep 04, 2024 pm 04:54 PM

HTML 입력 자리 표시자 안내. 여기서는 코드 및 출력과 함께 HTML 입력 자리 표시자의 예를 논의합니다.

HTML 정렬 목록 HTML 정렬 목록 Sep 04, 2024 pm 04:43 PM

HTML 순서 목록에 대한 안내입니다. 여기서는 HTML Ordered 목록 및 유형에 대한 소개와 각각의 예에 대해서도 설명합니다.

HTML에서 텍스트 이동 HTML에서 텍스트 이동 Sep 04, 2024 pm 04:45 PM

HTML에서 텍스트 이동 안내. 여기서는 Marquee 태그가 구문과 함께 작동하는 방식과 구현할 예제에 대해 소개합니다.

HTML 온클릭 버튼 HTML 온클릭 버튼 Sep 04, 2024 pm 04:49 PM

HTML onclick 버튼에 대한 안내입니다. 여기에서는 각각의 소개, 작업, 예제 및 다양한 이벤트의 onclick 이벤트에 대해 설명합니다.

See all articles