The issue
Here is a excerpt from a student email…
Mr. Rogers,
I’m taking the basic Web Graphics class this semester and I’m seeing subjects in the class expectations that remind me of what [will be expected of me in the final Capstone class]. I’m writing this because I had some areas in HTML that kind of still seem cloudy in my mind. I bought a HTML 5, Word press and Flash books from books a million to read this semester.
Being so new to all this stuff kind of has me running around in circles. Is there any advise or a road to follow for someone like me to prepare me for the capstone class and better yet the job market. Thank You for your guidance.
My response…
Maybe I’m wrong, but I think you’re concerned with how to solve a design problem. The first step in web coding is simply looking at a particular design issue and figuring out how to solve it using HTML, CSS, and Javascript. Look at a page and break it down.
Remember the basics:
- HTML simply puts an object (HTML element) on the page
- CSS tells that HTML element what to look like and where it is on the page (layout)
- Javascript controls behaviors, i.e. allows you to manipulate the elements and CSS to do stuff dynamically
Problem solving 101
What I recommend you do is take a page from a magazine (start with a simple one like an ad). Most ads have some images and text. How would you reproduce that ad using HTML, CSS, and Javascript (note: a static page won’t need javascript because it doesn’t change. Right? Javascript is only needed when you are programming the page to change something).
Try to recreate a magazine page using simple images and text in HTML and CSS and then get back to me. What issues did you have during that process? Then we’ll have something to talk about and can figure out where the gaps are in your understanding. My guess is you know how to do it. You just need practice. That will build confidence.
Process
- You see a page in a magazine
- What images are there? How can you get a copy of the images? Can you scan it? And in what format? What do you know about image formats? What format is best for pictures? What format is better for charts? Where are the images located on the page? How big are they (dimensions)?
- What is the background color of the ad?
- What text does it have? What is the font family? Is the text bold, normal, slanted? What color is it? What is the size?
- etc., etc., etc.
Each of these questions will tell you whether to control the page through HTML, CSS, or Javascript. You first have to figure out what you are trying to do. Since I don’t know where your cloudy areas are, I don’t know how to address them. I do know that if you understand the basics, you can figure out the rest.
Conclusion
A Tai Chi teacher once told me, “If you want to understand Tai Chi, practice the form.” Reading will not make you a better designer. It will give you ideas. It will help you understand how other designers solved their problems. It will help you understand the technology. Creating web sites will make you a better web designer and coder. Get busy solving problems and coding. :o)
Don’t try to understand everything before you start coding. As you code, as you try and solve problems, you will go to resources to help you solve that problem.
Resources: