Tag Archives: web design

awful

When it’s time for a redesign

Earlier today a tweet popped up on my #highered feed with a document about the need to redesign an institution website (Warning it’s a PDF). It was created by a group called Plattform Higher Education, which is a company based on marketing and communication needs for higher ed institutions. I really suggest you reading it yourself. It’s only one page after all but here are the bullet points.

  1. You’re three or more clicks from the contact form
  2. Your website’s look and feel doesn’t fit with your institution’s identity.
  3. For content updates to the site, you have to rely on a website designer.
  4. Your website features outdated content and images.
  5. Web analytics reveal a high bounce rate.
  6. A designer hasn’t touched your site in more than three years.
  7. Your institution has a website but lacks a mobile-specific site.

These are all really good things to look into. But I would like to suggest an 8th bullet point that pointed to your site needing a redesign.

8. It looks like shit

I’m not trying to be mean or sound like an ass but as I continue my job hunt I regularly come across department webpages that face this exact issue. In truth many face issue eight because they have fallen into issue sixes clutches. That should not be an excuse though. Your webpage should be there for a simple task. To help your students. You can’t expect your website to be of much help if it looks bad. You wouldn’t use a flyer to attract students to your program that was drawn with crayons would you?

Poor design leads to lost information. I could put all the information a student would need on a website but if it’s poorly designed and “looks like shit,” the student may not be able to find what they need or they may just give up and leave the website and end up calling or coming into the office, thus taking up more of your limited time. You can’t just “throw something together” and expect it to work.

A blog post I found earlier today characterizing some of the biggest mistakes in web design was really glaring at how common some of these errors are in higher education websites. It’s really something that needs to be properly addressed. Whether it’s through an institution-wide template or something. Allowing departments to exist with bad websites only will reflect badly on the institution as a whole.

I don’t want the impression to be though that I think that department pages that differs from the main university page are worse. Far from it, in many cases the department page is better.  But largely I’ve found it to be more poorly put together.

So I suggest to all people in higher education, sit back and take a real look at your website. It may just be time that you need a redesign. And don’t think about the money first, as by improving your website you may be getting more students and thus making the money back.

dashicon

Customizing the WordPress 3.2 Admin Dashboard

Working on websites for companies has really made me think a lot about customization. For many client that extends beyond what their users see but also their own backend.

With the release of WordPress 3.2 came a newly designed backed. To me this is bar far one of the best things about this new release (it was even the reason why I started running this site on the release candidate) . This newly designed dashboard though comes with a simplified code as well making customizing it a lot easier. I’be found two very useful customization options already; changing the admin logo as well as the active menu section arrow.

WP Beginner had put out a great tutorial for changing the admin logo and from that I was able to include the changes to the menu.

The original tutorial still works but in WordPress 3.2 the logo was shifted over and shrunk done to 16×16. So if you followed the original tutorial to the letter your logo has now been badly cropped.

Here is the code that you put in your WordPress theme’s functions.php file


//hook the administrative header output
add_action('admin_head', 'my_custom_admin_style');

function my_custom_admin_style() {
echo '
<style type="text/css">
#header-logo { background-image: url('.get_bloginfo('template_directory').'/images/custom-logo.gif) !important; }

#adminmenu li.wp-has-current-submenu a.wp-has-current-submenu, #adminmenu li.current a.menu-top, #adminmenu .wp-has-current-submenu .wp-submenu .wp-submenu-head {
border-bottom-color: #851212;
border-top-color: #F42D2D;}
#adminmenu li.wp-has-current-submenu a.wp-has-current-submenu,#adminmenu li.current a.menu-top,.folded #adminmenu li.wp-has-current-submenu,.folded #adminmenu li.current.menu-top,#adminmenu .wp-menu-arrow,#adminmenu .wp-has-current-submenu .wp-submenu .wp-submenu-head{
background-image:-ms-linear-gradient(bottom,#851212,#F42D2D);
background-image:-moz-linear-gradient(bottom,#851212,#F42D2D);
background-image:-o-linear-gradient(bottom,#851212,#F42D2D);
background-image:-webkit-gradient(linear,left bottom,left top,from(#851212),to(#F42D2D));
background-image:-webkit-linear-gradient(bottom,#851212,#F42D2D);
background-image:linear-gradient(bottom,#851212,#F42D2D);}

#adminmenu a {color:#F42D2D; }
</style>
';
}

So really all you need is a new 16×16 image instead of the 30×31 size image WP Beginner says to use. Really nice way to customize the feel of your admin screen.

Next is the menu color.Admin Menu Color

The image to the right is a good example of how the colors can be changed. Just like the icon changing the color of the selected menu section gives a nice personalized aspect to the dashboard. Along with the above code is  changing the link color to match the new menu color.  It can be customized further.

Also if you prefer you can use an image as the background instead of the gradient.

#adminmenu li.wp-has-current-submenu a.wp-has-current-submenu,#adminmenu li.current a.menu-top,.folded #adminmenu li.wp-has-current-submenu,.folded #adminmenu li.current.menu-top,#adminmenu .wp-menu-arrow,#adminmenu .wp-has-current-submenu .wp-submenu .wp-submenu-head{
background-image:url(your-image-location);
}

I suggest using an absolute url path from http to prevent a fail to load occur.

Other stylings are possible with the right CSS but unless you know what you’re doing you don’t want to go overboard with the styling

iIcon

A fresh start

Well I must say after over a year of saying I will get a new theme it’s finally happened.  I think my new job definitely helped in getting me motivated to sit down and do some coding. First I have to say I had help along the way. Smashing Magazine, Digging into WordPress, the WordPress Codex, and Forrst all proved to be valuable resources that without I would’ve taken even longer. But most of all is the FreelanceFolder‘s The Client Machine which this theme is based as a child theme. It’s back-end makes using this site as a freelance center much more easily. Also if you came here from www.kazenoryuu.com I’m sure you noticed that the url now reads as www.donbwhite.com I figured it was a good time to change and pick up a more professional tone in my web presence as well as to tie in with my twitter handle @donbwhite.

This blog will take a more professional tone as well with more focused post topics related to highered, student affairs, web development and design and less on ranting about stupid Hawaiian drivers and other stuff like that.

I have a friend who can….

Jumping into the wild and exciting world of web design and consulting does not come without its challenges. More often than not prospective clients don’t even realize that they are making major mistakes which hurt their business. It amazes me that websites that would’ve been hip and cool in the age of GeoCities (roughly 1995-1998 give or take) are excellent websites that represent their company in a professional manner. There is a valuable lesson that many businesses need to learn:

  1. Comic Sans is not a professional font choice and should be avoided at all costs.
  2. Never use background music. It’s just kind of pathetic
  3. User Experience on your website is very important.

If I were asked what the importance of the website for a company or business with a physical location I would have to say number 2. Why not number 1? Well if your business looks like crap and smells as bad then no amount of web magic can help. Thus it’s number 2. Yet as it’s number 2 it means it’s very important in the grand scheme of things. And as such you need to involve someone who’s knowledgeable even if it requires an extra dollar or two.

I have a friend who knows how to make websites for cheap/free is one of the most annoying comments I hear.

I’m not here to sit and judge that and firmly believe that this “Friend” knows nothing about web design. Heck they may even be a professional web designer doing it on the side for you But the problem is the job is free so they might not be giving you the best product available cause it’s a side project and not a job. You’d be low on their priority list for help, repairs, and advice as you would be placed after their actual jobs and responsibilities.

These are important things to consider when designing, re-designing, or doing whatever with your company’s website.

Themes & Tethering

I felt that I had a number of good ideas for posts the past week or so but I decided not to do post them largely because they were topics that I would prefer to be done in Custom Post Types and my current theme doesn’t cover that and I wish to wait until I have my custom theme up and running before the stuff. I’m finding myself stuck a lot of stuff. I make the mock-up but then I keep looking but overall I don’t care for it so I have to start over or I look at the overall design and feel like something is missing or just not working. It’s troublesome so I think I may take an hour (yes I have writing to do as well which is why only and hour) tomorrow and look at the design with fresh eyes and figure out what it is that works and what doesn’t and finally finish it.

I also I need to finish up the website for my friend Jason’s Photography company. I realized a few things that would be better to show off sections of the site so I just need to get that implemented. In the end though I think it will work out really nicely.

I have been shamelessly drooling over the new iPad 2 from Apple that was released last week. I honestly plan on buying this version of the device. Unfortunately the financial situation I’m in is totally not agreeable to making such a large purchase. I only plan on getting the 16Gb Wi-Fi only version of the decide though. A few months ago with the help of a friend of mine I rooted my HTC Droid Incredible. Honestly other than making a few backups I haven’t done much with it, since I like HTC sense. I downloaded a nice app though yesterday called Wireless Tether which turns my phone into a Wi-Fi hotspot which will be useful with my laptop in certain situations but also when I get the iPad I can use my phone as it’s internet when I’m out and about.

I hope I get positive feedback from jobs I applied for (and want) soon cause getting to work would definitely help my over all mood.