Point out links

1. Use descriptive links

Write meaningful links that indicate what’s behind the next click. You can also turn relevant words or sentences inside a paragraph into a link. Put the most important keyword into the link and avoid links like “here” or “more”.

2. Indicate the link’s destination

Inform your site visitors if a link opens a PDF or launches an audio or a video file.

3. Colour your links

Unvisited links should be blue (#0000ff). Visited links should be purple (#820682).

4. Change your link colour

  • Weebly.com
    On Weebly.com you can edit the link colour on the “Design Options” record. The hover status doesn’t need a special colour. Use blue for the hover status.
    Go to the Weebly Support CenterIf you want to use other colours for your links make sure they are different enough. Your site visitors must be able to quickly understand what’s clickable.
  • Wix.com
    On Wix.com you first need to click inside the paragraph to edit the link.
    Click on the hyperlinked text and change the link colour in the menu bar.
    Unfortunately Wix.com uses the same colour for visited and unvisited links. You cannot define a different colour for visited links.Go to the Wix Support Center
  • WordPress.com
    On WordPress.com only the colour customisable themes will allow you to change the link colours. Normally you must use the link colours the design templates offer you. If you don’t have the custom CSS upgrade you will not be able to change the link colours inside the template.

Related links

Change the colours in your WordPress theme

On wordpress.com you can change the background and choose an alternate colour scheme.

Change the background

  1. Go to Appearance › Background in your blog’s dashboard.
  2. Upload a background image or insert the hex code of your background colour.

If you want to use a background image instead of a plain background colour, you can find some sources for background images here:

Custom Background

Change the colour scheme of the template.

  • Go to Appearance › Theme Options and choose the colour scheme you like.

Colour scheme in the Bueno Theme Options

If you want to use your very own colours you will need to purchase the custom CSS upgrade. But this upgrade only makes sense if you are familiar with CSS.
For help with CSS try:

It didn’t work?
Visit the WordPress Support Center

Related links

Change the colours in your Weebly theme

At Weebly.com it is a little bit tricky to change the colours if you don’t know CSS. The way I am showing you is not the best way to change colours inside a CSS code but it’s the easiest one if you are not familiar with CSS:

  1. Open your Firefox Browser and install the Rainbow Colour Tool: addons.mozilla.org/en-US/firefox/addon/14328/. If you don’t use Firefox please download and install it first.
  2. Go to www.weebly.com, log in, choose your website, open the Weebly Editor and click on the “Design” record to open the theme.
  3. Activate the Rainbow Colour Tool Rainbow Colour Tool and click on the design element you want to change, for example the background. The Rainbow Colour Tool shows you the hex code of the element in a pop-up.
  4. Click inside the pup-up and copy the hex code.
    Copy the Hex Code on Weebly with the Reinbow Colour Tool
  5. Click on “Edit HTML/CSS” inside the Design record and open the CSS record.
  6. Search for the hex code you copied seconds ago.
    Click CTRL+F or ⌘ F (Mac) to open the search window. You can also go to “Edit” > “Search”. Paste the copied hex code in the search box and search for the colour. The search function will detect all elements inside the CSS code that use the colour you want to change.Search for the hex code with Click CTRL+F or ⌘ F (Mac)
  7. Replace the colour of the search result with your colour.
    Pay attention when replacing a #FFFFFF or #000000 code. These are white and black respectively. You may not want to change all white and black elements on your website.The CSS code also contains the text colours. You can find them by searching for code elements such as a{…}, p{…}, h1{…}, h2{…}, h3{…}.
    a{…} means a link. p{…} means paragraph, h1{…} means header number 1, h2{…} header number 2 and h3{…} header number 3.There is an easy way to change the text colours on Weebly. You don’t need to change them now inside the code. We will do this later while I’m introducing you to the typography specials on the web.
  8. If you don’t find the hex code it means that the colour is not defined inside the CSS document. It’s probably defined inside an image. The images are in the “Files” record. To change the colour inside an image click on the “Files” record. Search for the image you want to change and click on the image inside the “Preview” section. The image will now open in a new window.change colours inside an image weebly
  9. Open the context menu of the image and save it to your desktop.Save image as jpg or gif on your desktop
  10. Go to www.pixlr.com/editor, upload your image and change the colours. Don’t change the size and the name of the image. It’s important to replace the original image of the Weebly theme exactly with your new image.
  11. Save it to your desktop and use the same file format as the original file.
    Design templates usually use images with the .gif or .jpg format. With the Pixlr Editor you cannot save an image as .gif.
    If your original image is a .gif you can convert your .png file to a .gif with http://tools.dynamicdrive.com/imageoptimizer. If your template uses images with the JPG format your can directly save it as a .jpg.edit your image with pixlr.com/editor
  12. Go back to www.weebly.com, navigate to the “Files” record and click on “Upload Files” to replace the image inside the template with your own image. The images you want to replace must use exactly the same name, size and format as the original image.Click on "Upload Files" to upload your image

It didn’t work?
Visit the Weebly Support Center

Related links

Which tool offers the best themes?

Weebly.com

http://www.weebly.com offers over 100 themes with the following design options:

  • Different page layouts (landing page, large header, small header, no header).
  • Change fonts for site title, paragraph titles, paragraph text and links.
  • Custom header image, multiple header images and the possibility to add text to the header image. Each page can have it’s own header image.
  • Site title with custom logo upload.
  • There’s also the possibility to fully customize the theme by editing the HTML and CSS code.

Explore the free Weebly themes

Wix.com

http://www.wix.com offers a wide range of free available HTML and Flash themes. You can customize the themes by drag and drop and edit almost every single design element on the website without knowing CSS.
It’s also possible to have a blank template if you want to crate your website from scratch.
Wix offers also a directory of professional Wix designers.

Explore the Wix themes

WordPress.com

http://www.wordpress.com offers over 200 free available themes. The design options depend on the theme you choose. Use the Search and Filter option in the Theme Showcase to find out which theme offers the features and styles you need.

Many themes allow the following customisation options:

  • Change the background and modify the colour scheme.
  • Upload a custom header image. If you want to upload a custom logo you will need to put it in the header image.
  • Add widgets to your site’s sidebars.
  • Custom menus to customise the site’s navigation.
  • If you want to change more design elements or use different fonts you will need to purchase the Custom Design Upgrade. This upgrade only makes sense if you know CSS.

Explore the free available WordPress.com themes

Related links