html tutorial, internet tutorials

  Lesson 13: Creating Website Logos and Buttons  

     Free Online Logo Builder     

I´d like to introduce you to a great free service that allows you to create simple logos with ease: . They also have a lot of sample buttons, arrows, spacers, bullets, special fonts and cliparts that you can use for your website. But you must be careful, because not everything on is free for use. Make sure you read their terms of usage.

The only sad thing is that this website is polluted with annoying popup ads on every page you visit, so you should switch your popup blocker to hardcore mode in order to block these ads, once you are on their site.

At Flamingtext, you can create a website logo in four simple steps:

  1. Select a logo style
  2. Add your text and (optionally) modify certain parameters
  3. Click the "Create Logo" button
  4. If you like it, download the logo to your computer. Otherwise, hit the back button of your browser, make some changes and re-create the logo until you like it.

In the video, I´ll guide you through the process of creating a logo and then show you how to save the logo file on your computer, directly in your website´s image folder.

Video button not working ? Click Here

     Free ClipArts and Images     

Sometimes I use a ClipArt image to create a logo. Combined with some text, ClipArts can help to design nice looking logos fast (like the one at

It´s hard to find places that truely offer something for free. Most free stuff is connected with conditions. One site I found useful is They offer a large selection of free cliparts that you can use on your personal and even commercial websites. The only condition (as I´m writing this) is that you can use only a maximum of 10 cliparts. But that should be enough anyway.

Visit and search for suitable cliparts for your website. To download a clipart, simply right click on the clipart image and select "save image as". Save the clipart to the images folder of your website. Btw - the video links in this tutorial are made using a clipart from ChristiaNet.

You can also use the images included in the website templates package I gave you and edit them as you like. I don´t know which software program you are using to manipulate graphics, my favorite one is GIMP, a free tool. One feature I like very much is the easy option for compressing .jpg files. Remember that the basic skills you should have in editing graphics are tought in the extra lesson: Basic Skills in Editing Graphics.

Creating a logo can be as simple as combining your website´s name with a good slogan in a nice font style and color. You can put it on a white or colored background or use an image as background and/or combine it with a clipart from ChristiaNet.

     Labeling Your Buttons     

The buttons you can download from the internet and most of those buttons of the website templates included in this tutorial are not labeled yet. Using your favorite graphic tool, you just need to add a little bit of text in the style and color you like to the button of your choice and save it in your website´s image folder.

Remember, if you don´t know how to add text to graphics yet, the extra lesson Basic Skills in Editing Graphics teaches you how.

Another way is to use the online button builder at Flamingtext. The video shows you how.

Video button not working ? Click Here

     Finishing Your Website Template     

In the previous lesson, you´ve learned how to translate your webpage layout into HTML, so you should already have a simple template. To complete it, simply add your logo and the buttons (if any) and save it again. This template you will use in the future to build the pages of your website by inserting content into the appropriate places.

The next lesson teaches you the correct file name for your homepage and also which other webpages your website should have in addition to the homepage. You will also learn a simple, yet very effective way to protect your email address from being harvested by spambots.

previous lesson top of page next lesson

    Web Design

  • Design and market your own professional-looking website with easy-to-use tools.

  The Lessons  

Skills & Tools
HTML Basics
The Head Section
The Body Section
Anchors & Links
Font Styles
Cascading Style Sheets
Website Layout
Domainname Registration
Website Logos & Buttons
Main Webpages
Legal Documents
Web Hosting Providers
Publishing Your Website

Editing Images


FAQ / Support


Cheap Website Hosting
DailyRazor offers a full featured hosting plan for only $ 1.66 per month. Best choice for people on a low budget for hosting one website.

Multiple Site Hosting
Some webhosts allow you to host several different websites under one hosting account. This makes your hosting costs per site very cheap. My favorite webhosts:

CSS Tutorial
"Styling with CSS" is a comprehensive and easy guide to web design with CSS for beginners. Highly recommended book that should be on your shelf.
Buy it from Amazon.

Home   :::    Contact   :::    Advertise   :::    Submit Tutorials   :::    Links   :::    Sitemap
Terms of Use, Disclaimers, Privacy Policy
Page copy protected against web site content infringement by Copyscape