Personal Blog Website Overview
Below is a summary of the personal blog website template:
- Languages: HTML, CSS, and JavaScript
- Year: 2022
- Author: Unknown
- Website Type: Portfolio Website
- Target Audience: Students or Newbies to Web Design
Introduction to Source Code
A personal blog website is a very popular type of website on the Internet. It is used by individuals who want to write about a certain field such as website design, personal finance, technology knowledge, general knowledge, etc. Or this can also be a place for individuals to present their own work profiles for future job applications.
Surely if you want to become a good website interface designer, you must know how to design a personal blog website like that. However, not everyone who is new to the field of website design understands how to design a reasonable and beautiful website.
For that reason, today I will introduce to you a pretty nice personal blog website interface that you can use for reference even if you are new to website design. The reason is because it is designed with basic languages including HTML, CSS, and JavaScript, and it does not even use popular libraries like Bootstrap or jQuery.
This is a user-friendly and responsive website template on devices with different screen sizes. Hopefully it will help you get familiar with designing a personal website interface.
Personal Blog Website Components
- Navigation and Introduction Sections: Includes website logo, navigation bar, light/dark mode toggle and short introduction about the website owner
- “Latest Blog Post” Section: Introducing the latest articles from the website owner
- “Topics” Section: Presents topics that website owners will cover such as databases, web performance, etc.
- “Tags” Section: These are tags that are attached to articles that have topics that correspond to them
- “Let’s Talk” Section: Contact the website owner via social media
- “Newsletter” Section: Get notified about new posts from the website owner
- Footer Section: Contains elements such as website logo, website introduction, copyright, other navigation links.
- Dark/Light Mode: Switch between light and dark modes
Below are some images of this website template:
- On large screen size:
- On small screen size:
You can download the source code below:
You can refer to the previous source code here: https://featlas.com/source-code-11-the-front-end-code-of-cryptocurrency-website/