Introduction
Welcome to the first part of my XHTML tutorial. There’s a lot to know and learn, so I won’t burden you with long explanations of why I’m doing this. Suffice it to say that I’m hoping this will help people learn the basics of web development at their own comfort and pace. To that end, I’ve split each lesson into separate parts, allowing you to take a break and let what you’ve been reading sink in before continuing on. I hope this serves to provide a more enjoyable learning experience.
I have also provided a glossary of various web-related terms in case you don’t know what something means. Throughout posts, some words will provide a link to their entry in the glossary in case you are lost. You can also click on the “Glossary” link in the navigation bar at the top of the page to get there. If you don’t know what something means, or have a recommendation for an entry I’ve missed, feel free to let me know.
Read More ⇒
Filed under: (X)HTML, Tutorials, Web Design by Ziv
1 Comment »
Lesson 2, Part 1
Setting a Goal
Before we can begin writing a web site, we have to have a goal in mind. What is the purpose of our web page? Who will be viewing it? What kind of information will we need to display, and how will we need to display it?
Let’s Do Some Role-playing
A Biology professor has contacted you because she is in need of a web page for a course she is teaching. She has heard that you have experience in building websites, and wants to employ your services. You meet with her in her office and discuss what she wants so far:
- A heading banner at the top of the page, and the same text in the browser’s title bar
- An introductory paragraph under the heading
- A list of the teacher’s contact information
You tell her you’ll get to work on it right away, shake hands, and leave.
Read More ⇒
Filed under: (X)HTML, Tutorials, Web Design by Ziv
1 Comment »
Lesson 1, Part 5
So, Where Do We Start?
To finish up this lesson, we are going to build a very simple web page, and analyze the different parts of it. You’ll learn some new fundamental tags, and what they do.
To begin, start up your editor of choice. If you are using Notepad++ (N++ from here on) as I recommended in Lesson 1, Part 4, go to the Language menu at the top and select HTML. This will set the syntax highlighting to recognize HTML tags. You don’t have to do this, since once you save the file the program will automatically switch to the appropriate setting. However, if you want the highlighting enabled right away, you should do this now.
If you don’t know what Notepad++ is, I recommend you go back to Lesson 1, Part 4 and read about it.
Read More ⇒
Filed under: (X)HTML, Tutorials, Web Design by Ziv
No Comments »
Lesson 1, Part 4
One Last Matter Before We Start…
At this time I would like to address just one more thing that I think is worth mentioning.
As I said before, coding in Ye Ol’ Notepad is not much short of a nightmare. I’m not sure how good the basic text editor for Mac users (TextEdit, if I’m not mistaken) is, but if it doesn’t offer syntax highlighting, I say don’t use it. Syntax highlighting makes life so much easier, and will increase your productivity significantly.
Read More ⇒
Filed under: (X)HTML, Tutorials, Web Design by Ziv
3 Comments »
Lesson 1, Part 3
At the end of Lesson 1, Part 2, I had you open the source code for that page. If you still have it open, that’s great. If not, you can just open this post’s code. For our purposes, which page you use won’t make a difference.
Tag! You’re it!
As I mentioned in the previous section, commands in HTML are known as tags. These tags are what allow the browser to understand what you want it to do.
Read More ⇒
Filed under: (X)HTML, Tutorials, Web Design by Ziv
No Comments »
Lesson 1, Part 2
What makes XHTML different from programming/scripting languages?
Basically, XHTML is different in that it is read straight through by the browser, and is processed as the browser reads it from top to bottom. Programming languages, on the other hand, need to be checked for errors by the compiler (the program that translates the code into something the machine can understand), and they allow for jumping around between the code based on certain conditions.
Read More ⇒
Filed under: (X)HTML, Tutorials, Web Design by Ziv
1 Comment »
Lesson 1, Part 1
What are HTML and XHTML?
HTML stands for HyperText Markup Language. XHTML stands for eXtensible HyperText Markup Language. Unless noted, I will use the acronyms HTML and XHTML interchangeably. There’s no reason to risk confusion with the differences at this point.
(eXtensible) Hypertext Markup Language? What in the world does that mean?
The acronyms mean that they are markup languages used for writing hypertext (that is, web) documents. What’s a markup language, you ask? Markup languages are sets of code that allow you to set different rules for the text you type. Still confused? You’re not making this easy for me, are you? Okay, I’ll give you an example:
Read More ⇒
Filed under: (X)HTML, Tutorials, Web Design by Ziv
No Comments »