Principles and Standards of Web Design

In the last few weeks we discussed the topics of heuristics, accessibility, user experience, and the importance of design within all of these things. I had never given much thought to the importance of heuristics and accessibility before. However, the articles provided throughout the week definitely allowed me to view web design in a different light. It goes far beyond choosing the prettiest font or the nicest colors. So many different factors need to be brought into consideration in order to efficiently satisfy a wide range of users with a variety of different needs and expectations. The use of Slack during these past few weeks, and throughout the course of the semester, has actually been really helpful in grasping a better understanding of the topics at hand by allowing me to see other people’s point of view and the additional knowledge they may have on some of these things.

Heuristics

This topic was based off the articles assigned for Assignment 12. We discussed the 10 Usability Heuristics for User Interface Design written by Jakob Nielson in 1995. These heuristics are still relevant today because they represent broad rules of thumb rather than specific guidelines. Therefore, they can still be used in order to efficiently design websites. One of these heuristics is “user control and freedom.” This heuristic is essentially meant to support undo and redo. I believe it is very important to provide users with control such as an “emergency exit” if they click something by mistake. I have definitely had bad experiences with certain websites where I have accidentally clicked on something and had to start the entire process over again and input all of my information again. Things like these can definitely cause users a lot of frustration and may even lead them to leave a website. Therefore, it is crucial to take into consideration user control and freedom when designing a website. Another heuristics that I believe is really important is “consistency and standards.” This heuristic states that “ users should not have to wonder whether different words, situations, or actions mean the same thing.” I never gave this much thought until I had to compare Academic Search Premier and Google Scholar in terms of heuristics for Assignment 12. I found Academic Search Premier a lot more confusing. There were so many different links and a lot of them seemed similar to each other which made it difficult to navigate through. “Error prevention” is also a very important heuristic. When designing a website it is important to add things such as confirmation messages. These things allow a user to see what they’re doing before they commit to an action. For example, this is very important for websites that allow for online shopping. If a user accidentally clicks on a “Checkout” button, they should be given a confirmation option rather than automatically completing the checkout process. These are only a few of the 10 Usability Heuristics but they each represent important factors that need to be considered throughout the design process.

Accessibility

We covered accessibility in Assignment 13. The articles provided for this topic definitely taught me a lot. For example, I didn’t know there were laws being passed that require websites to have accessibility options in order to ensure that everyone has equal access. This makes sense, because as seen in one of the linked resources, millions of people across the country alone have a wide variety of disabilities that make it difficult for them to navigate through the internet. With the way society is rapidly becoming dependent on the Internet, it is crucial to allow equal access for everyone. For example, things such as closed captions need to be provided for people who have a difficult time hearing. Alt text in images also needs to be used in order for a screen reader to be able to read it aloud for someone who is blind. This is something that had never even crossed my mind. When thinking of design I would always think of different concepts from my point of view and things that I would change on a website or do differently. However, I never once thought of the way someone else might be viewing it who is not able to navigate through a website the same way as me. These articles definitely shed light on these things for me and the importance of providing efficient accessibility options to this demographic of people. I was glad to learn that web designers and developers are being pushed to provide these things for these users in order to ensure that everyone has the opportunity to access and navigate different websites without any unfair limitations.

User Experience

User Experience was covered in Assignment 14. User experience “encompasses all aspects of the end-user’s interaction with the company, its services, and its products.” Providing a seamless and satisfactory user experience is key, especially since user experience can easily make or break the image of a company. In the linked video by Tobias Komischke, we saw a lot of these examples of different companies. He pointed out one website that confused him a lot by the way they worded their login information fields. He figured it out, but not everyone has the patience to sit and figure out what to do. With poor design, comes poor user experience. If a user has a poor experience, they may become frustrated and leave the site or simply never use it again which can greatly affect a company. One of the things Tobias Komischke mentioned that really stood out to me was “a user will always have an experience, no matter if you design for it or not.” I had never thought of things that way before but it holds so much truth to it. This is why it is important to take so many different factors into consideration during the design process and not just simply a one sided way of thinking. The linked articles also introduced us to different user experience research methods such as A/B testing. A/B testing is “a method of scientifically testing different designs on a site by randomly assigning groups of users to interact with each of the different designs and measuring the effect of these assignments on user behavior.” Research methods like these help stay away from that one sided way of thinking and expand opportunities for successful website design. This was evident in the Obama campaign websites. The changing of a simple photograph had a tremendous effect on their numbers which I personally believe is pretty amazing and ties into what Tobias Komischke mentioned. There are certain things we may not even design for that end up having an effect on a user’s experience.

Semester Summary

Throughout the course, we have learned a lot despite our short time-frame. First we discussed the difference between web design and web development. I found this topic really interesting because I definitely used to use the terms interchangeably but they are ultimately different. Essentially, web designers can be thought of as the architects of a website, and web designers as the builders. Therefore, one cannot exist without the other.

We were also introduced to the process of sketching. I found the assignments that pertained to this really fun to do but they also taught me the importance of mapping out the basic layout of a website and focusing on the details later. We also learned about different image formats and how to resize and compress different images in order to manipulate them for our design purposes. I found compression slightly confusing at first but I realized how useful it can be especially when it comes to things such as a loading times on a website. A huge image can take forever to load and slow down the loading time. The compression website we were provided with was really cool because it managed to compress an image by so much without any noticeable difference in the quality.

Later on we were introduced to basic HTML5 tags and semantics in order to create skeletons of our medium blog posts. We were then introduced to CSS in order to style our HTML. We were also paired in groups in order to provide feedback on our code. I found this exercise really helpful because it allowed me to see that there is not one single way of doing things. I also liked that each assignment was built upon the previous one because it really helped tie everything together when it came time for prototyping. In one of our assignments we were required to create a YouTube homepage prototype. All of the things we learned from sketching to learning how to use “float” in CSS were really helpful in bringing the final prototype together.

We then ended with the previously mentioned topics of heuristics, accessibility, user experience and design. Throughout each week, we learned the fundamentals of web design and through the assignments, managed to put this knowledge to use. I definitely feel like I learned a lot, not only from the assignments, but from the additional resources and articles that were provided.

References