[Learn] HTML/CSS

HTML, fully known as HyperText Markup Language, is one of the core technologies used in web developing along with CSS and JavaScript. It is called a m

When writing content in HTML, we usually start with a heading to create titles. We use the h1 tag to create the first heading in HTML. We can choose t

Because CSS is meant for styling contents created by HTML, it contains a variety of tools for developers to use.

In HTML and CSS, we can use various kinds of selectors to efficiently add CSS properties onto HTML contents. But, if we make all the selectors to sele

If you are trying to build a website using HTML and CSS, it is very crucial to know how to build layouts in webpages. Layout is the format in which te

Float is a CSS property used to place an element on either the left or the right side of a container which allows text and inline elements to wrap aro

Flexbox is a set of CSS properties for building 1-dimensional layouts in webpages. The main purpose of flexbox is that empty spaces inside a container

CSS Grid is a CSS property for building 2-dimensional layouts in webpages. The main purpose of CSS grid is that a container element can be divided int

Back in the day, designing and developing were distinct tasks. In order to build a website, there was a 2-step process. Designers would initially crea

According to the standard definition, typography is the art and technique of arranging type to make written language legible, readable and appealing w

Just like text, color is one of the most important parts of what makes an excellent web design. Its role is to get attention, convey meaning, tell a s

Images on website give more diversity to its overall atmosphere. As such, it is important to choose the right image for the website's personality.If y

Although icons are one of the supporting features of a website, they are one of the first things the users look at when they look through any website.

Over the years, many developers implemented the effects of flat design and shadows into their products by choosing one after the other. In the recent

Though creating border-radius in various contents may look insignificant, this process is actually very important for the website to look unique. By g

Whitespace is simply space given between elements to spread out from each other. Giving just the right amount of whitespace makes designs look clean,

As the name states, visual hierarchy is about establishing which elements of a design are the most important ones. We can set important elements on a

Difference Between UI and UX? UI and UX are familiar terms that people have heard often in various settings. But, what exactly do they mean? User In

Today, I attempted to clone-code a type of layout known as an accordion. An accordion is a vertically stacked list of headers that can be clicked to r

A carousel in UI Design allow multiple pieces of content to occupy a single component. Today, almost everyone uses handheld devices such as a smartpho

Although the table component is not used as commonly as other components, it is still important to know how to make one. There may be times when you m

A hero section is the area that is immediately shown when the user visits a website. This section of the website should be able to introduce the overa

When we want to build a good looking website, it is VERY VERY important to structurally build the entire web application layout. This is an important

Define WHO the website is for. Is it for yourself? For a client of your agency or your freelancing business?Define WHAT the website is for. In other w

Starting today, I will be clone-building a website known as 'omnifood'. Everything I do for this project will be fictinoal and will not be tranformed

I began by first building the hero section of the website. A hero section is very important because it is the first thing that users will see when the

After building the hero section, I moved on to create a header and a navigation component using the contents given prior to this exercise.In order to

The how-it-works section is a component that is built in order to guide users step-by-step on how to use the service provided on the website.