Styling First-Letters with CSS ::first-letter
Styling first letter in a block of text is a good way of increasing user attention span. It can be done with the ::first-letter CSS pseudo-element.
Creating Attractive First Lines with CSS ::first-line
When your copy content goes long, it is a good idea to make it visually attractive. The CSS pseudo-element ::first-line can be used to style the first line appearing within an element.
Using WebP Images with Fallback
If your application involves showing a lot of images then probably it makes sense to add WebP support. Using the HTML tag is the most robust solution to display WebP images with fallback.
Creating a Page with Sidebar and Main Content Area using HTML & CSS
Popularly used in admin pages, a page with a left sidebar to hold menu options, and a section to hold the main content is one simple design that looks good.
UI Tip : Replace your JPEG-PNG Logos by SVG ones
A SVG format logo will look far better than a jpeg or png format. SVGs bring high quality at a small file size.
UI Tip : Use Favico.js for Better Notification Management
Favico.js is a Javascript plugin that animates the website's favicon to inform user of new notifications.
UI Tip : Using Animated Favicon to Attract User Attention for an Inactive Browser Tab
While the user is on a different browser tab, you can get his attention by animating the favicon of the website.
Animating a Lightbox with CSS & Javascript
Lightboxes are one of the common things implemented in websites, so animating them is a good idea to impress your visitors.
How to Move an Element in a Circular Path with CSS
Moving / animating an element along a circular path can be achieved by animating the CSS transform property.