We will have the troubleshoot exercise next week. You will be given 50 minutes to complete the exercise, fixing the problems in the file giving. That includes fixing the html code and the css code. I will use the horizontal template I’ve been using in this class to create the exercise. Below is a list
(More)…
Here I took screenshots of the style.css file we use for Project 2. This file can be find in the article Two Basic CSS Templates. Note the css file I explain here is the horizontal navigation. The css file of the vertical navigation is slightly different. Another related article you should read is CSS Basics.
(More)…
First before we get started with CSS, review Basic HTML tags. One thing you want to remember is HTML tags are pre-defined, but you can give any ID or Class to a HTML tag. Now let’s learn some CSS! 1. What is CSS? CSS is Cascading Style Sheet. It defines how html elements look like,
(More)…
In this tutorial, we will put content on our home page. At the same time, we will learn how to use Dreamweaver. If you have not yet have the index.html and style.css in a p2 folder on your desktop, please make sure you follow through the previous tutorial: DW Tutorial 2. 1. Adding some real
(More)…
In this tutorial, we will set up a “Site” (a project) and get the files we need (index.html and style.css) for project 2. 1. Site Management A “site” in DW, basically means a project. Set up a site helps us keeping all the files in the same folder. It also helps us keep the links
(More)…
In this tutorial, we’ll have a basic understanding of Dreamweaver. 1. The “Welcome Screen” When you first open Dreamweaver (Applications -> Adobe Dreamweaver CS6), you will see the welcome screen. The middle welcome screen give you options of opening recent files or new files. On top of the screen is your Toolbar. On the right, you
(More)…
Here’s a powerful website that helps you with picking colors for web design: Kuler by Adobe at http://kuler.adobe.com/ Before using the website, you need to create an account with Adobe. You can do so by clicking on the upper right “Register.” After you created an account with Adobe, here are the things you can do:
(More)…
Fetch is a FTP software (File Transfer Protocol) that allows you download/upload files between your computers and the server that hosts your website (ex: bluehost.com). To use Fetch, of course, you need the software on your computer. We have Fetch already installed on our lab computers. To have Fetch installed on your own Mac, you
(More)…
Step 1: Open Text Edit on your Mac. You will see the text styling toolbar on top of the window. Step 2: Go to Text Edit -> Preferences
So here we are, creating our first html file, our very first web page. We will use Text Edit on a Mac to do it step by step. If you have not changed the settings on your Text Edit, please make sure you do. Step 1: Create a folder on your desktop. Name it “p1″.
(More)…
