*******Click the link above*******
For this blog assignment I started
to think about the different websites I have used throughout my time in
education. A couple websites that stuck out to me were, i-Ready, PBSkids,
edconnect, scholastic, and Insectropolis, just to name a few. However, when
thinking about the purpose of this assignment I decided to revisit these
websites after I completed the readings for this week, to determine what
websites were good and/or bad examples of designs. One website that struck me
as visually unappealing and overwhelming after revisiting it and having an
understanding of website design was Insectropolis. This website was created to publicize
the different aspects that the bugseum of New Jersey has to offer in hopes that
it would inspire viewers of the website to stop by for a visit. In the
following paragraphs I will discuss the different features of the website and
how they follow or do not follow the different principles of design that we
learned about in this week’s readings.
When
talking about the design of this website I want to start out with mentioning the
various design principles that I thought fit well with the design of this
website and helped it have some visual fulfillment,
- Trapped Negative Space: When navigating
throughout this website the designers did a good
job of properly trapping the
negative space toward the outside edges of the layout. When I first went onto
the website I thought that maybe the outside edges of the layout were
specifically for the homepage. However, when navigating to the various
different pages throughout the website the outside edges all remained the same
size. I think this provides the website with enough outer space that the viewer
doesn’t seem overwhelmed when navigating throughout the website and having an
array of information stretch across the screen. The outside edge creates the
perfect width of the page that enables the designer to effectively place the
information on the page without overwhelming the viewer.
- Centering Everything: Another design rule that I
thought the designers of this website implemented well was that the text that
was written on the website was aligned to the left which helped to give it a
nice straight line and allow the eye to have an understanding of where the next
eye entry point was expected to go. Although I think there are features of the
text alignment that could have been implemented better in the design (discussed
later in alignment) the idea that the text wasn’t centered on this website really
helped to have the website visually appealing for the viewers. Additionally,
there was uniform alignment of the text throughout the site. When navigating
throughout the website the text remained to be aligned to the left within copy,
leads, headlines, and even captions/cutline.
- Asymmetrical Balance: Although sometimes I would
imagine asymmetrical designs to be chaotic and unorganized I think for this
website it works particularly well. The placement of the different navigational
tools, images, text and tags help to make this website flow nicely. That being
said, it brings me to my last design element that I believe went well with this
website design.
- Proximity: I enjoyed that with this website all
the navigational tools were bunched together, different events were advertised
in the lower left hand side and a slideshow was presented at the top of the
page followed with information that highlighted why people should visit the bugseum.
The proximity continues throughout the entirety of the website and I found that
I never was confused on where to look for a particular topic. The tabs of:
About the Bugseum, Our Exhibits, Plan Your Trip, Education, Event Calendar, and
Photo Gallery all help and greatly organize the different areas of the website
that might be of interest to the various visitors on the website.
- Bulky Borders and Boxes: The first design
feature that I found to take away from the aesthetic value of the website was
the variation of borders and boxes that were used throughout the website. It
seemed like when revisiting the site after having read about different design
features I started to really hone in on what made me feel a little overwhelmed
when navigating throughout the website initially. I found that not only were
the borders varied across the site but in addition there were moving features
and bugs that helped to distract the user. I found that the bugs might have
been placed strictly to have the viewer understand by first glance what this
website was about. However, I found that the bugs might have been too much on
the website with everything clustered initially and since the bugs were
animated it helped to really be distracting for me and I imagine other viewers
as well.
- Backgrounds: The idea of bulky borders and
boxes helps to bring me into my next rule of design that did not fit nicely into
the design of this website. Although this feature was not terrible I think
there could have been changes made that would have made it even better.
Initially when visiting this website, I was not a fan of the brown background,
to me this takes away from a lot of what the website has to offer. I think that
because of this it is conveyed that the website is really busy and I feel as if
there were to have been a lighter brown shade it would have fit better with the
flow and visual appeal of the website.
- Too Many Fonts: Another design feature that I
did not like was not only the various text types that were used but also the
different text colors as well. I think overall, this took away from what the
text was trying to say. In the internet browser that I used to view the website,
Mozilla Firefox, there was a feature at the top of the webpage that allowed me
to view the website in reader view. This feature allowed me to simply read the
text that was on the webpage in the simplistic black and white formatting. This
put the text into a standard and classic size font but also made the text just
black which helped me in reading what it was that the website had typed up. Although
designers sometimes find a need in making their websites visually appealing if
it is not carefully thought out, it can take away from the overall message that
is being conveyed.
- Alignment: The next design feature that I
thought was negatively portrayed in this website design was the alignment. Like
I mentioned earlier I did enjoy that the designers did not center the text and
rather aligned it to the left-hand side. However, the reason I think the
alignment was bad was when reading the principles of design article it was
stated to “always find something else on the page to align with, even if the
two objects are physically far away from each other” (northernhighlands.com).
Therefore when simply looking at the homepage the navigational links that are
used to navigate throughout the site (About the Bugseum, Our Exhibits, Plan
Your Trip, Education, Event Calendar, and Photo Gallery) are aligned to the
left hand side of the page. However, when referring back to what was mentioned in
the Principles of Design article it would have created a strong visual alignment
& unity if the text for the navigational links would have been aligned to
the right instead.
- Contrast: I find that the contrast for this
website is negatively portrayed because for the most part a lot of the information
on the website looks visually similar. The text size is all relatively the same
and is all represented in the same text color (blue, green, brown). The
Principle of Contrast states, “If two items are not exactly the same, then make
them different. Really different” (northernhighlands.com). Which was not
emphasized throughout this website. Additionally, because there were so many
different text types and sizes used throughout the website I found it very hard
to identify what it was that was important information and what the designer
really wanted me to focus in on as the viewer.
- White Space: Last but not least, I found the
lack of white space in the design of this website really took away from what
the website’s viewers perceived when exploring this page. An important statement
from a reading this week was, “white space is not your enemy” (Hagen &
Golombisky, 2017). I think as designers we need to take an initiative for
implementing the white space into our designs rather than working to get rid of
it. Although the outside edges of the layout were negative space, that was
primarily the only area where white space was utilized. In order to develop a
more visually appealing website for viewers, it is imperative that designers
implement white space much more frequently and include animation, images, text
more infrequently in order to create an effective website overall.
Throughout this week’s reading it
really helped me to see why it is important to become familiar and knowledgeable
about the different principles and rules of design in order to create a
web-design worth looking at. Overall, I really enjoyed this week’s readings and
being able to understand what it is that makes a viewer particularly interested
in a design.
References
Hagen, R., & Golombisky, K. (2017). Layout sins 13 amateur
errors. In White space is not your enemy
(3rd ed., pp. 33-44). Boca Raton, FL: CRC Press.
Principles of Design [PDF]. (n.d.).
Retrieved February 2, 2017, from http://www.northernhighlands.org/cms/lib5/NJ01000179/Centricity/Domain/40/digitalartsdocs/principles-of-graphic-design.pdf
