Posts Tagged ‘Wordpress’

Another year of blogging: A summary of my 2012 articles

Posted on: December 22nd, 2012 by Fransgaard No Comments

Another year of blogging is coming to an end and as per previous years (2010 and 2011) here is a summary of of this year’s articles. This year I am grouping the articles into these themes; Social Enterprise, Personal branding, User ExperienceSocial media in general, Instagram rants, Other articles and Personal thoughts.

Merry Christmas and Happy New Year. See you in 2013.

Social Enterprise

Personal branding

User Experience

Social media in general

Instagram rants

Personal thoughts

How to create a professional website using WordPress as a non-digital Graphic Designer

Posted on: March 27th, 2012 by Fransgaard 3 Comments

On Twitter, a talented graphic designer I know recently asked how he could learn HTML code so he could become a digital designer (as in digital art director/UX designer rather than a digital artworker/template designer/frontend developer).

While knowing HTML has its benefits, I don’t think it is a requirement as a digital user experience designer to be able to code HTML to a professional standard. Rather than getting bogged down learning HTML from the ground up, I believe it is much better understanding what can be done with HTML without being able to do it yourself. It gives a much broader foundation faster.

However, the question is a part of a broader series of questions I am regularly asked which can be summarised into a single question:

“How do I become self-sufficient in producing a professional digital presence?”

The quick options are setting up a blog, A facebook page, a flavours.me profile etc, but at the end of the day nothing beats having your own domain with your own website under your own control.

Instead of learning how to hand-code a website I recommend downloading and installing a self-hosted WordPress CMS system… Now now, don’t run away yet. Let me take you through the steps…

0: Secure support

Best option is find a friend who understands the web, not necessarily a professional, just somebody who “gets it”. You may not need that person, but it is nice to have somebody just in case.

Linkedin is full of helpful groups dedicated to WordPress.

1: Sort out server space to host your website

WordPress a server-side scripting language called PHP using MySQL database. Don’t worry about what it means, just remember the words “PHP” and “MySQL”. You need to find a host that has those words in its sales material.

I use www.one.com because:

  • They do domain and hosting in one go
  • Their setup process is fast and simple
  • Their welcome emails are simple and complete
  • Their support is amazing

There may be other equally good hosts, but since I have never had any problems with one.com I have never shopped around for other providers.

2: Learn to transfer files to your server space

Get an FTP program. I use FileZilla; Simple to use, does what it says on the tin.

Login to your new domain using the details you got from above and upload a file to your server space. A jpg picture is good, a simple HTML file is better. Here’s a simple test HTML file.

It is like moving files between two folder. Just one of the folders happens to be on a different computer than your own.

TIP: You can open the sample HTML file in a text editing program such as TextEdit (mac) or Notepad (PC). Try and modify the file and upload it again to see changes happening.

3: Install WordPress

Download the latest WordPress from WordPress.org and follow the instructions that comes with the Zipped file. More detailed instructions can be found here, but the attached instructions should be enough to get you up and running.

4: Understand WordPress basics

Don’t start any design work yet. Instead play around with the basics of WordPress by adding new pages and posts. Posts are blog-like posts with categories, tags and date stamps. Pages are less time-sensitive content such as About me etc.

Remember you can always delete any content later on.

5: Understand the power of plugins

Find plugin

Imagine functions you would like on your site. For example a tag cloud, a twitter stream a gallery light box etc. Go to the plugins section and use the add new section to search and find relevant plugins. Install a couple to familiarise yourself with how to make use of plugins.

Make sure to explore the widgets options as well. Some plugins have widget options giving you some control over where the actual plugin will appear on your site.

As with content you can always delete the plugin later on, but this exercise is designed to show you how big an arsenal of functions the wordpress community can offer.

6: First baby-design step.

ThemesOnce you feel confident using plugins the first step of designing your site is to find a WordPress theme that roughly does what you are looking for.

Start with a free theme. There are loads out there to download from here.

Note, some free themes add credits to the footer which I think is fine, but some also adds ads you do not have control over, which I find a bit more problematic. A few plugins do the same. keep eyes out for potentially unwanted content appearing on your site.

Also note some themes may have problem displaying some of your plugins. It’s all trial and error. More often than not though you won’t find any conflict.

Step 7,8,9….etc

Themes often offer the ability to change headers and colours. Make use of those to modify the design.

In time you might want to change something very specifically by editing the HTML or even the PHP code. I won’t go into details with that. All I’d say is make a copy of the Wordpress theme you want to modify so you can quickly switch themes if something goes wrong.

the good thing about WordPress is the ability to quickly turn things on and off.

Let me know how it goes.

Designing a website without designing a website

Posted on: September 13th, 2011 by Fransgaard 4 Comments

I have been a professional web designer since 1998 and can design and built the user interface of websites by myself. So historically I have done porfolios of static HTML pages based around the visual design with few PHP coding snippets here and there for contact forms etc.

But a few years ago I picked up Posterous as a mean to write longer Tweets and one thing led to another and I was suddenly blogging. And naturally I soon wanted to embed my blogging on to my site.

Which led me to WordPress, which as CMS systems go is very easy to deploy and manipulate. And I did. The first two WordPress’ed version of my site where fully designed from scratch and giving me grey hair when I deployed them. It was a long process but I was happy with the results.

Skip a few years and I rather suddenly decided to find a new job and I simply didn’t have the time to do a new fully designed and built WordPress theme.

So I cheated.

…at least I cheated in the eyes of designers. Had I not been a digital designer nobody would have winced but I am so they did. I deployed an existing WordPress theme and used my skills to do a range of structural changes but overall the visual identity of the theme was kept intact.

And I successfully landed a job.

As my portfolio is now less important I want to give my blog more prominence. But I am busy at work and I have things I’d rather do in my spare time… having already successfully cheated I have yet again opted to cheat (don’t hit me), but this time in a more structured way. So while commuting I wrote a list of what I wanted from my site:

  • Blog as main content
  • Disqus as commenting system for easy access
  • Social sharing crucial
  • Social proof
  • Easy access to my other online profiles with emphasis on Twitter and Instagram
  • “About me” page populated by Linkein (to avoid duplicating maintenance efforts)
  • “Contact me” form
  • Portfolio section
  • Links to blogs by colleagues, friends and blogs I like
  • …and I wanted my logo back on.

All these decisions were made completely without thinking about the visual design, a new approach for me for my personal site.

Last Saturday I browsed my WordPress links and rather quickly decided to use the ModernClix theme as a base as it had both Twitter stream and Flickr stream already embedded and it had an appealing design and treatment of typography.

I spend all of Saturday deploying and modifying the theme to fit the direction I want and as you can see it has moved away from the ModernClix theme but I still want to credit the theme as a big part of making a WordPress theme is to design every little aspect of it. By modifying an existing theme I can leverage a lot.

I wanted to write this article when I was done, but I think it makes more sense posting it now so you can see how far you can re-design an existing theme in a very short span of time.

Sure, I am missing the portfolio pages and there’s still a suite of things I want to do to the design, but it is there. It is up and running and provides a better blog-reading experience for my visitors which was indeed the main reason for the re-design in the first place.

Am I cheating?

I don’t think I am. I am making best use of existing work rather than re-inventing the wheel. So I don’t think it is cheating; it is being smart leaving me time to do what I want on my spare time.