As I was building my first site, Theme Party Queen.com, one of the most frustrating things to learn was how to get my graphics looking just right.
I wasted more time than I care to remember figuring out how to position them, how to add or get rid of a border, making image links and learning about wrapping text around my graphics. Early on, I did not even know where I could find royalty free graphics and clipart. Eventually I learned what I needed to know but boy was it frustrating!
When you are building your first web site, the learning curve is gigantic. Searching all over the net to learn what you need to know about graphics will only take you away from the more important tasks like writing content.
The next few pages are dedicated to helping beginners learn the basics about web page graphics:
![]() |
How To Position Images Learn all about positioning graphics so you can get them exactly where you want them on your pages. Find the exact code for all of your positioning challenges including wrapping text and objects around images and lining them up in a row or column. |
![]() |
How To Size Images As you build out your site, you will need web page graphics ranging from tiny 16 pixel by 16 pixel (for favicons, buttons or table images) all the way up to large http graphics that are the entire width of a page. Learn how to get your graphics to the perfect size for the intended spot on your site. |
![]() |
Creating Image Links If you are going to go to the trouble of placing web site images on your site, you might as well make them into image links whenever possible. Learning how to make image links and using them often will greatly improve site navigation for your visitors and help your monetization efforts. |
![]() |
Why Tag Images? If a webmaster has used the html image alt tag properly, you will see a small box of text appear when you hover your mouse over an image. A huge number of visitors find my site because I purposely add a keyword-rich alt tag to every single web site image that I place on my sites. Learn how here. |
![]() |
Shopping Images Not all website graphic sources are created equal. Read my recommendations on where to find free web site images, on buying images inexpensively and on where to find a great selection of clipart. Also, watch a video tutorial on scanning images. |
![]() |
Photoshop Drop Shadow Tutorial Look at the web site images in the header above. When I created them, I added a gray shadow, aka a drop shadow, around each image. Learn how to add a professional touch to your webpage graphics by watching a drop shadow tutorial video. |