Summer Camp: How to build a website like an engineer

 

3 Can you catch up with Dylan's pace by working one hour per day?

I believe some of you guys must have some got experience already or have self-learned the HTML5/CSS3 tutorials online. How is it going so far? We usually start with W3Schools to learn how to compose our first web page because it has all kinds of tutorials at hand, such as HTML/CSS/Javascript/SQL/PHP, etc.

Once after you read through the tutorial, you need to create your own page from scratch or copy from the source code of other web pages available online and modify it. Once you start to code by yourself, you may encounter various kinds of problems and keep debugging for quite a while before you give up.

That's why we'd like to offer some help when you are stuck somewhere, especially if you are creating some similar pages, such as the web page from the Chapman University or the Dragon web page, it's easy to compare with the source code from the browser and figure out how to revise the code to make the same effect. chances to work as internship with software companies to learn the basic skills, but they may not be exposed to the entire application development cycle.

Here is how Dylan got his progress by working one hour per day in the passed week and built some real nice effect according his interest: Dylan's Dragon V2. He hasn't tuned to fit in various browsers size, best to see it in full screen mode.

Some specific trouble shooting skills involved would be:

  • Tune the margin, padding with percentages for each div
  • Add an extra wide value for the video div and make it "max-width: 100%"
  • Remember to add "position: absolute" for each div if not "fixed" or "relative"
  • Reverse to the previous stage by control Z when the new code gets screwed up

Most of the time, you need to play trial and error to tune the style until it becomes all- browser compatible. So where you right now? Once you get started, it should be easy to beat a 13-year-old, true? How far are you from the sample Dragon web page? Try it and see how much you can improve. Let me know if you have any questions.