Tag Archives: web design

How to: learn about CSS by creating a ‘tweetable quote’

This is the fourth in a series of posts introducing HTML. The first part tackled making a ‘Tweet this’ link in a blog post, and the second introduced Twitter’s Web Intents sort-of-API. The third post outlined a little hack for embedding images in those tweets.

If you haven’t read those, you might find it easier to start there.

You can also get all four tutorials in a small ebook.

Sharelines

Stage 4: Styling your ‘Tweet this’ quotes with CSS

At the top of every post in this series has been a ‘Sharelines’ section with quotes in white text against a blue background, each one preceded by a Twitter icon bullet point.

All of those stylistic elements are created with CSS: Cascading Style Sheets. And this post will explain how to learn more about CSS by using them to style your ‘tweet this’ links.

In order to do that I need to explain how CSS works alongside HTML, and why we need both. Continue reading

Customising your blog – some basic principles (Online Journalism Handbook)

customised car

A customised car. Like a customised blog, only bigger. Image by Steve Metz - click to see original

Although I cover blogging in some depth in my online journalism book, I thought I should write a supplementary section on what happens when you decide to start customising your blog.

Specifically, I want to address 3 key languages which you are likely to encounter, what they do, and how they work.

What’s the difference? HTML, CSS, and PHP

Most blog platforms use a combination of HTML, CSS and PHP (or similar scripting language). These perform very different functions, so it saves you a lot of time and effort if you know which one you might need to customise. Here’s what those functions are:

  • HTML is concerned with content.
  • CSS is concerned with style.
  • And PHP is concerned with functionality.

If you want to change how your blog looks, then, you will need to customise the CSS.

If you want to change what it does, you will need to customise the PHP.

And if you want to change how content is organised or classified, then you need to change the HTML.

All 3 are interrelated: PHP will generate much of the HTML, and the CSS will style the HTML. I’ll explain more about this below.

But before I do so, it’ll help if you have 3 windows open on your computer to see how this works on your own blog. They are:

  1. On your blog, right-click and select ‘View source‘ (or a similar option) so you can see the HTML for that page.
  2. Open another window, log in to your blog, and find the customisation option (you may have to Google around to find out where this option is). You should be able to see a page of code.
  3. Open a third window which you will use to search for useful resources to help you as you customise your blog. Continue reading

Rue89: “Advertising is out of reach”

Over at sister blog JournalismEnterprise.com there’s an interview with Rue89 co-founder Pierre Haski. Rue89, a French news website, “doesn’t live off advertising. The cash flows from 4 sources:” Website design (50%), advertising, third-party services, and contributions from users (the tip-jar model). “The ad money is “out of reach” for a mid-sized player such as Rue89 and “it’s unclear if it will be in the future”.”

Read the full post (by Nicolas Kayser-Bril) here. We’re always planning other interviews – if you want to conduct one for JournalismEnterprise.com, let me know.