Web Design Basics


For this project, we used several programs to create a splash page using HTML and CSS coding. First, we did a paper mock up of the basic design. Then we went into Adobe Illustrator to make a cleaner design. Finally we used Adobe Dreamweaver to put the elements into code, after learning many different techniques for coding the page.


Paper Mock Up

Illustrator Mock Up

Splash Page

Sample HTML and CSS Code

What I Learned

During this project, I learned about several different techniques for coding HTML and CSS. I had a little bit of previous knowledge in coding, but this really helped me develop more important coding skills. I had lots of fun designing my page, and even making my own original artwork in Photoshop. We used Illustrator to make a nice mockup, but after going into code I soon learned it would be more complicated than I thought. I had some problems and had to make ¬†modifications to my design once we started coding, but I’m still happy with ¬†how it came out. I went for a simple layout with a blue and grey color scheme. A resource I used for my splash page was a slicing tutorial to get a bunch of pictures out of the Illustrator document.

Leave a Reply

Your email address will not be published. Required fields are marked *