When trying to think of a good website to talk about, websites of startup companies first came to mind. These days when someone builds a company from the bottom-up, a big part of its branding is the company’s website.
If a company wants to survive and thrive, it most likely needs an easy accessible website that reflects its brand and personality that make people want to look more into the brand.
I know when I am shopping for new products, etc., if I see a really well produced website, I am intrigued and want to look into the product more. This is why I chose stoneycloverlane.com because it’s a bracelet business that was created by two teenage sisters that also has a great website.
Right away when you see the website, it screams the brand’s personality. I like their use of colors and illustrated elements throughout the site, definitely elements I can envision using in a site of my own.
The thing that I loved the most about the site was how the navigation section is at the top of the site and not horizontally across the entire width of the page.
When you hover above the navigation buttons, an illustrated highlighter mark appears, which is a pretty cool hover technique to use instead of just using a different color for the hover.
When inspecting the CSS for the entire website, I found that the website uses fancyBox, which is “a tool that that offers a nice and elegant way to add zooming functionality for images, html content and multi-media on your webpages,” according to the fancyBox website. When inspecting the navigation element, the CSS is styled so that the hover becomes a GIF.
When looking for different websites, I also realized that a lot of businesses use large rectangular and square photos for further navigation on their sites. Here are a few examples:
When scrolling down on these sites, there is a navigation bar at the top and square and rectangle clickable elements follow. It is definitely an interesting trend in website design that both retailers and journalism publications are using. I would also like to use this element on a site.
When inspecting the element for the placement of the different navigation squares when you scroll down, it seems they were able to center and position them based on how they manipulated the margins and padding, which can easily be duplicated for another website.