Exploring Pinterest

This week, I was asked to create a Pinterest Mood Board for my Web Graphics Software class Client Project. As per the instructions, I pinned 20 different items that I can use to draw inspiration from when creating the final project. Read on to hear about my experience using Pinterest as a inspirational tool.

First of all, the process of using Pinterest is fairly simple. One simply has to create an account, create a board, search for what they wish, and start pinning. I had no trouble figuring out what I was doing as the process is pretty self-explanatory. I love that the site gives the user such a broad selection of items and categories to follow, as my interests and not limited to computers, web design and the like. I can also pull inspiration for drawings, paintings, home improvement and so on. The only issue I had with the site was the jumpy navigation, though in the site’s defense, this jumpiness very well could have come from the mouse I was using at the time.

I believe that Pinterest has the potential to be an extremely useful tool for designers, painters, artists, or even just the average person given how broad the interests provided are. This particular board I created could come in uncannily handy in the future as I am prone to using flat, minimalist designs for websites and apps alike. I think I’ll be flocking to Pinterest more often in the future when my muse starts to play hide and seek. Pinterest can even be used by business to even further the reach of the advertising, content sharing, and general appearance to the public as many, many people use the site daily.

Overall I see Pinterest as a very intriguing site full of creative users sharing information, inspiration, and great ideas.

Until next time!

Desktop vs Mobile: The Importance of Proper Page Layout

This week, I took a look at two different companies that provide their users with both a desktop site and a mobile version of the company site. These site versions varied in size, content available, layout, imagery, and in some cases, function. Read on to see what I found.

The first site I visited was Bungie.net. Being very familiar with this site, I know the company has a tendency to favor wide, boxed layouts with expanding navigation panels.   This was the case with the desktop site. The main focus of the page is the image reel that acts as the company news panel. Beneath the reel is a scrolling set of boxes each featuring other news via Bungie’s Twitter, Facebook, their customer support, store access, and so on. The more active user intensive navigation bar rests at the left side of the site, providing access to feature more likely to be used by an individual who is both registered on the site and who uses the social gaming features the site provides. Bungie’s mobile site, however, seems to be strongly focused on catering to those aforementioned registered members. The mobile site focuses on being logged in and the features that are most commonly used by logged in members, such as game stats, character status, clan information and the like.

The second site I explored was the Dell website. The desktop website has a simplistic layout but depends heavily on the navigation panel at the top of the page. The home page merely gives a way for customers to log in, however, it does provide nearly direct access to customer support. The mobile website seems more focused on the shopping side of the company, and gives expandable menus to categories such as laptops, desktops, deals, tablets, etc. Support links are located at the bottom of the mobile site rather than right in the center as in the desktop version.

Obviously, the different screens sizes provided to the public today require companies to shuffle and reorganize page layout and content to give the user a comfortable and clean experience. Some websites succeed in making their mobile sites just as comprehensive and navigable as their desktop version while others focus on providing heavy site users simply with content they need access to. Page layout is very much a vital portion of website design no matter what the screen size is. Users expect easy navigation and access to content without a struggle. Having a bad mobile site can cut site traffic down to an extreme. These are all things one should take into consideration when putting together a website for themselves or a client.

Until next time! Have a great week!

About CSS and Why it is Vital to Website Design

Today I am going to talk a little about one of my person favorite parts of web design: Cascading Style Sheets. Now, if you’ve spent a lot of time designing sites you probably know that CSS is the preferred way of giving a website a more aesthetically appealing look.

Essentially, a cascading style sheet contains the selectors and elements that choose the element to be modified and define the properties and values that will applied to the element respectively. The cascading style sheet is then linked to the HTML website page using the “link”element. This allows all of the element changing properties and values to be connected to the HTML elements on the website, giving them the designer’s desired color, style, and arrangement.

Fortunately, since CSS saves so much time and helps create cleaner HTML code by allowing the style of the webpage to be set outside of the main HTML pages, most browsers have a solid level of CSS support and may only seem a bit buggy at times. This allows web developers to keep their HTML coding mostly clean and free of pesky inline and embedded styling.

The W3C recommends using and external CSS page rather than inline or embedded styling to improve content accessibility and create overall cleaner HTML pages. They also recommend external CSS for simplicity’s sake when styling sites with many, many separate pages than needs to stay consistent in style and setup.

CSS3 is the newest set of standards for CSS overall. This new set of standards is completely and totally backwards compatible with the older versions of CSS. CSS3 introduces several new features that are still are being adapted and implemented by most leading browsers. For example, images can be used to create borders now using the new “border-image” property. CSS3 has also introduced box-shadow properties. CSS3 brings all kinds of new style options to the table of developers everywhere.

For more information on CSS and CSS3, as always I recommend taking a look at W3Schools tutorials and explanations right here, and you can also view the W3C CSS working group’s progress here.

Until next time, readers!

Web Design and Sites that Don’t Quite Make the Cut

When building a website, there are several factors that a designer should take into consideration if they want users to stay on their webpage for more than five seconds.  Too many links? Who wants to sort through 50 links to find the one page they want?  Bad contrast?  The user can’t tell what they’re looking at and they don’t want to spend five minutes squinting at the monitor trying to read one word.  Images scattered everywhere?  The user becomes distracted, gets frustrated, or eventually just wonders off.

I think you get what I mean by the design of a website is absolutely CRITICAL.  The design can make or break a website just as easily as the content within.  I took a look at a couple of local sites that aren’t necessarily horrible, but they are indeed violating a few rules of web design.  Let’s take a look.

The first website I looked at for the design was the Labette Health Hospital website.  Like I stated previously, not horrible but definitely could use some improving.  There are links EVERYWHERE, and some of them are the same link in two or three different places.  Now I don’t know about everyone, but most of the individuals I associate with would only go to that website for one reason: paying bills.  At least they made that link somewhat easy to find.  The next thing I found off about the site was the contrast used on some of the links.  The side bars and links at the top of the page all consist of white font on pale green boxes that… well, they make the words difficult to decipher.  If a person doesn’t want to be on the site in the first place and they can’t read the links, they’re probably going to navigate away from this site pretty fast.

The next website whose design I critiqued was the USD 505 Chetopa-Saint Paul Schools website.  This is a site I’ve had personal experience with and could tell was not great before I even started going to school for web design.  They have a cute little image slideshow at the top that would be neat for showing school events and student activities…. if they images were the proper size and resolution.  Unfortunately, all of the images in the show are blurry and/or out of focus, but let’s move on.  The site’s navigational features dominate the page and completely hide the news and contact information below.  In fact, I had no idea that the news and contact information existed until today.  Overall, the site has a really “unfinished design” feel that makes me want to turn tail and run.

As I stated before, web design is quite possibly the most important factor to consider when one is building a website.  It can mean the difference between 5 visitors or 500.  Some sites fail to follow the principles of good web design and it shows in their visitation stats.

Until next time!