My Thoughts on Web Page Designs

For those that have been reading Technically Easy for some time, you may have noticed that I modify my blog design every few months. Since switching over to WordPress, however, I have kept the same template, with a few modifications. In the past week, I have been creating a new blog design from scratch, and have thought about some of the design issues that I have seen online.

In this post I will talk about my thoughts on Web page designs, and what I think are common issues with many designs in use today.

Thinking the Web is One-Size-Fits-All

While designing my new template I thought about the size of each page in the template. My current theme, which I downloaded, has a fixed width of about 980 pixels. It is a common idea that can be seen on many web sites and blogs: the fixed width.

When designing web sites, many choose to limit how much of the screen width is taken up by their site. They limit it to under 1024 pixels because that is what many people are using (1024×768 pixels). Some may even say 800 pixels should be the maximum width to take into account those using 800×600 resolution on their monitors. I say, don’t limit the width of your template, since millions of people don’t use those resolutions.

I am writing this post on a laptop that has a resolution of 1440×900 pixels. Most web sites I visit only take up a portion in the center of the screen, with the rest filled in by the background image or colour. I prefer sites that take up my entire, or close to the entire, width of my screen. Think about the number of computers sold today that now include a widescreen monitor. How about laptops that contain a widescreen LCD? Most are sold with these types of screens, so creating fluid layouts that stretch the full width is probably a better idea than limiting the size of each page.

With my new template, I have created a fixed width sidebar, but a fluid content section. This allows the content to stretch with the various resolutions used by my visitors.

Is Your Site or Blog Readable?

While browsing through various free WordPress templates, I noticed some very sharp looking designs. One thing I did notice about some of these templates is the size of the fonts. Some were probably too small.

When designing templates, we have to keep in mind not everyone that will visit your site has perfect vision. Many will have difficulty reading small fonts, so it is important to use large fonts for your content. The last thing you would like is for someone to leave your site because they couldn’t read your content.

With my design I try to use a large font for the content. I also try to put enough space between the lines of text to help increase the readability of the content. For the sidebar, I created my template using a smaller font. The reason for this is that my sidebar will only be about 360 pixels in width, so a large font will make things look too crowded.

Nice Images – Are They Needed?

Images add some colour and flair to any web site or blog. People would include an image in each blog post, or a larger image in the header of their site. Blog posts that include images are easy to read and provide a nice splash of colour to the text. For header images, you must be careful. I have seen some sites that have gone overboard on the size of the image in their header, which can take a long time to download.

While header images are nice, I would try to keep them small. You want as much content to be displayed without scrolling down as possible, and taking up much of this space with a large header image isn’t beneficial. Most commercial web sites usually have just their logo image in their header, instead of a huge 300KB image.

I always hate designing headers for Technically Easy, but I usually just display a small logo, the name, and a navigation bar at the top. Nice, simple and small, just the way I like the headers.

Don’t Go Crazy with Widgets

This is mainly a blog point, but I think it is important. When I first started Technically Easy, I joined several socal networking sites, and then proceeded to add their widget to my blog. The more widgets I added, the more unorganized the blog looked, and the longer it took to download.

I have visited many blogs that have this issue. Their sidebar is so cluttered with widgets, that I find it difficult to find any links to the content of their blog. Not to mention the slowness of their blog in both downloading and navigating. While some widgets may be nice, do you need them all?

It’s great that someone named Joe visited from California, but your readers don’t care. With Technically Easy I try to keep the number of widgets to a minimum, while providing mostly navigational links (besides some ads) in the sidebar. The sidebar in the new template will look very similar.

These are just some of the thoughts that came to my mind as I began designing the new template. While it won’t be as nice looking as some of the templates available online, I will try to keep it simple so it downloads quickly, and makes it easy to read the content.

Have Your Say

  • What do you think about the topics discussed above?
  • Do have thoughts about what you like and don’t like in current sites or blogs?

8 Responses to “My Thoughts on Web Page Designs”

  1. Some great points here. I think the most important thing to remember when designing themes or websites is ‘targeted’ and ‘functional’.

    Different websites cater to different audiences. A technical blog like this one is targeted to readers who are here for the quick and dirty. They want to know stuff and aren’t interested in being wowed by design or medium. Photography and music sites however are different, their target audience is different, and as such, need a more stylized, visually interesting website.

    All websites need to be, first and foremost, functional. They need to meet the need of their target audience. Meeting the need of the audience is the biggest aspect to think about when adding any design element, widget, plugin, etc. Do my readers NEED this? If not, cut it.

    I just finished up designing a new flex-width wordpress theme for a client. It was an interesting challenge and I’m still not 100% satisfied with the header because, while on average widths it looks good, the wider someone sets their resolution or the wider their screen the more whitespace is in the header. The rest of the content does a beautiful job of filling space across the page but when designing a header, particularly one with images it gets harder to deal with flexibility.

    My own blog has a fixed width although, with a little tinkering I could make it flexible. In this case I actually prefer the fixed width, the whitespace either side rests my eyes from the ‘color’ of the rest of the site and the header and footer maintain an aesthetically pleasing balance.

    In the end, each website has different needs, each client has different preferences, and no single site suits everyone. The opportunity to have such a diverse range of designs is one of the things that make modern internet so interesting. Anyone dating back to the late 80’s early 90’s might remember, things have looked a lot worse. lol

    Speaking of plugins that fill a need, have you considered adding the ‘subscribe to comments’ WordPress plugin? I’m one user who appreciates the added ease of keeping track with such a nifty little tool. 😀

  2. WiiGirl says:

    I’ve toyed with creating my own template for one my websites, but never really understood the ‘float’ options and the whole concept of the site development.

    With regular HTML it’s fine, basic tables, etc. What are people’s recommendations for creating your own template?

    • Paul says:

      The float options can be complex if you haven’t used CSS and DIVs before. It was a learning experience for me since it seems browser render the pages differently.

      I think for most people, they start out with a downloaded template and then modify that until they are happy. Once they modified a pre-built template, they may have more knowledge and build their own from scratch. That worked for me.

  3. Kevin Paquet says:

    I don’t know if my blog looks good or not for my readers, but one thing that I’m trying to emphasize on it are the widgets that should remain very simple and not irrate the readers.

  4. Margaret says:

    I am totally with you on the floating size issue. That’s the single thing I am not happy with about the template I’m using, however I am not talented enough to tinker with that and change it — it’s the percentage thing, yannow. If I could somehow do a formula that included (screenw-sidebar) to formulate it, that would be very good.

    I did make some changes to it so that the sidebar would accommodate two 125×125 ads side by side. Even that was done with Lyndi’s help.

    I can’t wait to see the new digs. It will be sad to see this comfortable look go away, but I understand the need to stir things up a bit!

  5. Lisa Irby says:

    This is a good post, Paul. I always struggle with the fixed vs. fluid decision when doing my sites. Some good points here. Looking forward to seeing your new design.

    • Paul says:

      I struggled with the fixed versus fluid design myself. I decided to go fluid with the new template to fill the screen without regard to the resolution.

      I am hoping to switch to my new design in a few days.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.