Small Business Website (revisited)

Small Business Website (revisited)

Improvements, new features and new content I have made some improvements to the layout on the “contact us” page. Also, I have modified bakery opening hours section at the footer of the website so that I could integrate JavaScript logic to it, which checks for the current date and time, and highlights today’s day in the opening hours section of the footer, and also displays a message if the shop is open right now or if it’s closed. Modularity Navigation…

Read More Read More

What are container queries – will they change the way we design responsive pages?

What are container queries – will they change the way we design responsive pages?

Introduction Container queries are queries that allow the styling of elements based on the width and height of their parent container instead of just relying only on the viewport dimensions. Miriam Suzanne is the author of the proposal on container queries. Her website and codepen collection are very helpful resources to follow how this new feature is developed. Currently, the container queries are available only via Google Chrome Canary and only under the experimental flag. The progress of layout and…

Read More Read More

UXD and Me

UXD and Me

Introduction In this article I am going to talk about User Experience Design concepts and how I am going to apply them to my project. Writing this article should help me in developing better understand of User Experience Design in general and help me to progress in developing a website for my major project. I will start by introducing my website idea, followed by discussion about User Experience Design concepts combined with thoughts on how they can be applied to…

Read More Read More

3 examples of sites with beautiful typography

3 examples of sites with beautiful typography

https://www.rolex.com/ https://www.cartier.com/ https://aviarylondon.com/ All 3 websites have interesting and potentially unique typography. Cartier has a heading font which has some elements of the products it sells. Spacing between letters, contrast, line height all look great. Rolex also has an interesting font which is used for headings, it’s very wide, but again, it looks great and suitable. Overall website design is really nicely done. Text has a good contrast, it catches eye. Aviary website in overall is very stylish, but at…

Read More Read More

What I learned this week

What I learned this week

Applying various CSS styles font-family – property specifies the font for an element font-size – property sets the size of a font color – property specifies the color of text background-color – property sets the background color of an element background-image – roperty sets one or more background images for an element padding – space around an element’s content, inside of any defined borders border – property specifies what kind of border to display margin – space around elements, outside…

Read More Read More

What I learned this week

What I learned this week

File and folder naming and structure I’ve created folder for additional html pages and folder for images Named folders and files in lower-case, no spaces Referencing images from images folder and that alt is an alternate text for an image Learned about basic navigation by creating links to other pages file.html – A link to a file in the same folder folder/file.html – A link to a file in a folder one level below ../file.html – A link to a…

Read More Read More

Cosstores.com

Cosstores.com

Minimalist style with pastel colours. Top navigation menu divided into two parts. Small logo on the same line with navigation menu. Very minimal front page. Bottom menu with less frequently visited pages. Embedded videos from fashion shows. Categories with images. Professional photos on every page.

Nationaltrust.org.uk

Nationaltrust.org.uk

Great colour scheme, professional photos with similar colours. Each carousel image moves slightly to the right, great animation. In the middle of each carousel image there is a button which takes you to a different page. Almost every link on the front page has an image associated with it. Back to top button Top navigation menu uses a little space. Logo without text. Small search button, which expands when clicked. Buttons to download mobile apps. Bottom navigation menu with links…

Read More Read More

Feelunique.com

Feelunique.com

Great colour scheme, pastel colours. Image carousel shows latest products and offers. Logo, top navigation menu and search bar use a little space. Icons instead of text for account management, wish list and basket. Most popular brands are listed on the front page. With one click can add product to wish list (heart). Top menu is very well designed, with products divided into lots of smaller categories. Offers signup, help, social media links, selecting different country options available on the…

Read More Read More

Portable steamer

Portable steamer

Portable steamer is great when traveling or even for office. It can easy fit into drawer or a suitcase. It is very lightweight even when it is filled with water. The weight is equally distributed between the top and the bottom, and thanks to that, hand does not to get tired when using it for a long time. Location of the steam release button makes it easy to control it with index finger. Also, the steam release button has a…

Read More Read More