The design of your weblog web page units the tone for all the assets you publish. A structure that’s cluttered, scattered or visually ineffective doesn’t paint the best image.
The mixture of graphics, pictures, textual content, search engine optimization, UX and UI isn’t straightforward to drag off utilizing solely a free WordPress theme or web page builder, both.
So we scoured the net to search out a few of our favourite weblog put up design examples in an effort to offer some sensible takeaways. Have a look.
1. Vox
Vox, an impartial media firm, leverages its main model coloration tactically all through its weblog web page, starting with its brand within the high left nook to the yellow CTAs and header highlighting.
Using a yellow border brings form to the general design as properly, creating separation between content material and white house.
Vox can be capable of weave in varied content material varieties, alternating between articles, podcasts, show advertisements, movies, publication CTAs and sponsored content material. Even the two-and three-column formatting, together with various thumbnail picture sizes, helps so as to add hierarchy and emphasis.
The corporate clearly tries to stick to title size and meta description finest practices. It additionally makes in depth use of question-based headlines and its well-known “explainers.” In whole, these options result in a well-structured, click-worthy and optimized web page for each readers and search engines like google.
2. MailChimp
Electronic mail automation supplier MailChimp absolutely leans into its model picture and illustrative design fashion on its weblog web page.
Utilizing a muted palette of pinks, yellows, blues and greens, MailChimp pairs every weblog put up with a customized illustration, usually in an summary fashion. Its clear and accessible typeface additionally works properly in opposition to distinguished detrimental house.
One key web page structure characteristic is the subdivision of content material themes through H2 headers. On this case, MailChimp has categorized its particular person weblog posts beneath subjects resembling:
- Find out how to make automations give you the results you want.
- Find out how to create on-brand designs.
- Find out how to flip buyer insights into actions.
With only a fast scroll, readers can perceive what material is featured on the corporate weblog and select a vacation spot web page that most accurately fits their pursuits.
3. QuickBooks
The QuickBooks useful resource middle guarantees “assets to assist begin, handle and develop your small business.” And, true to its phrase, there are many guides, listicles and tutorials to assist budding enterprise house owners perceive the core ideas of entrepreneurship.
The accounting software program agency covers loads of floor on a variety of subjects, all intently associated to each section of enterprise a reader may have to know. These embrace taxes, planning, bills, payroll, expertise and rather more.
With content material specified by rows, and the usage of a constant set of 4 picture tiles, the QuickBooks weblog is easy and complete on the identical time. The corporate additionally makes use of a star score system to highlight fashionable articles, attractive new readers to dive into trending, sensible content material backed by social proof.
4. Canva
In fact the world’s favourite graphic design device units a excessive bar for weblog design. Canva’s thumbnail and banner photos converse loudest, with a good looking two-, three- or four-tile show divided by material.
The pictures are additionally hovered animations, including extra depth, motion and interactivity to every put up. Favoring hi-res pictures and clear illustrations, Canva gives a strong weblog with useful design, advertising and marketing and branding assets for people and companies alike.
5. Figma
Collaborative interfacing device Figma delivers detailed, colourful imagery in opposition to a easy weblog column format and white house. What Figma will get proper is how a lot every illustration can talk about its model and its content material.
For instance, Figma’s use of directional cues like arrows, cursors and geometric shapes attracts the reader’s eye to key messages inside its photos. These messages join intently to the title of every weblog put up, making a cohesive theme throughout your complete web page.
The corporate publishes a wide range of weblog content material varieties, too, together with product bulletins, Q&As and academic posts, making certain the weblog isn’t one-note.
6. Assume With Google
Few organizations have entry to the kind of advertising and marketing analysis and client insights Google does. That’s why Think With Google is such a treasure trove of recent knowledge, enlightening concepts and burgeoning traits shaping in the present day’s economic system.
Loaded with glossy, flat animations and thinly weighted line drawings, the weblog web page of Assume With Google could at first look seem restrained or plain. However every weblog put up is stuffed with extra knowledge visualizations that assist inform a dynamic, analytical story.
And Google doesn’t cease at typical articles. It additionally posts distinctive, horizontal options referred to as “visual stories.” These property comprise graphic design, animation, video interviews, audio and much more knowledge — all packaged in a clickable, paginated format that makes SlideShare look archaic.
Need to witness the newest in weblog put up design expertise? Look no additional than Assume With Google.
7. Adobe
Adobe, the inventive software program powerhouse, is not any stranger to hi-fi digital advertising and marketing.
It continues to push the boundaries of content material creation, social media and graphic design — in its personal model and vis-a-vis the businesses that use its companies. Adobe’s weblog structure seems to be extra way of life than it does B2B SaaS.
With a concentrate on multifaceted imagery — like enjoyable, digital illustrations, fashion-forward pictures and, at instances, esoteric designs — Adobe permits visuals to dominate its running a blog technique.
The corporate additionally consists of embedded movies of its merchandise, touting the newest developments in its expertise choices, like augmented actuality. That is along with its many partnerships with high establishments just like the Smithsonian, Google and the London Marathon, lending collective energy to its weblog subdomain by model affiliation.
Subscribe to
The Content material Marketer
Get weekly insights, recommendation and opinions about all issues digital advertising and marketing.
Thanks for subscribing! Preserve an eye fixed out for a Welcome e-mail from us shortly. When you don’t see it come by, examine your spam folder and mark the e-mail as “not spam.”
8. Axios
Do you’ve gotten two minutes?
That’s all you want — if that — to get the gist of an Axios put up.
Information outlet Axios may be very clear in its mission, editorial pointers and strategy to content material — outlined in its Axios Invoice of Rights. Exemplified by its Good Brevity® tagline, the corporate is the grasp of no-frills, urgently terse running a blog.
It famously sections its weblog put up template into bullets, with headers that progressively dive deeper into the subject. When you simply want fast highlights, you possibly can glean what you want in seconds. If you wish to perceive extra a couple of present occasion, learn just some extra bullets. If you wish to be absolutely conscious of the world’s happenings, learn until the top of the put up.
This structural selection deliberately permits readers to tune out at their very own tempo. We’re all time-crunched and attention-fractured, and Axios understands this higher than most.
The only weblog on this record will get the job carried out.
9. TikTok
TikTok is greater than only a video platform. Its weblog is a good way to remain within the loop with the service’s newest information, product updates and attention-grabbing tales in regards to the TikTok group. The design is easy and user-friendly, and readers can filter content material by nation and language for a customized expertise.
Plus, the corporate makes use of an infinite scroll weblog design, permitting customers to scroll by your complete weblog archive with out having to navigate to new pages. This characteristic is aligned with the latest Google updates for mobile: Search engine outcomes on cellular screens will now not have “see extra” buttons on the backside of pages. As an alternative, Google will robotically populate extra outcomes with every scroll.
10. Grammarly
Grammarly’s strategy to running a blog is to be as clear and complete as attainable — whereas utilizing extremely concise language. Then, throw in custom-made illustrations, step-by-step guides and plenty of examples for good measure.
Customers will more than likely by no means run out of issues to learn on Grammarly’s weblog. The person posts are sometimes extremely long-form, authoritative and optimized for search. From exploring widespread grammar errors to sharing the way to categorical love when writing, the weblog has one thing for everybody.
However in some way, even with a various vary of subjects all geared towards totally different audiences, Grammarly has mastered the artwork of constructing all of it look cohesive — and it’s all due to its constant use of design components. The illustrations are so intelligent that even with out studying the title, customers can inform what the put up is about.
11. Moz
Moz, an search engine optimization software program supplier, makes use of its weblog web page to not solely publish nice content material however to advertise particular person authors as properly.
Placing their staff — and exterior consultants — entrance and middle, Moz basically makes use of a micro-influencer technique. Previous and current Moz workers like Rand Fishkin and Dr. Pete wield appreciable affect within the search engine optimization house, and their posts usually get hundreds of feedback from a big, lively advertising and marketing viewers.
Moreover, Moz makes nice use of recurring sequence, like Whiteboard Friday and Daily SEO Fix, to drive new and returning visitors to its website.
A closing notice: A two-column weblog template with customized illustrations makes the weblog web page straightforward to scan and scroll. There are few bells and whistles — simply nice research, updates and opinions on search engine optimization.
Designing Your Weblog Posts
Weblog themes are available in many sizes and shapes. WordPress, HubSpot, Squarespace and Wix are a few of the hottest running a blog platforms and content material administration methods, offering the inspiration for the highest themes on the net.
Newer applied sciences like Webflow, Foleon and Contentful provide next-generation web page builders that seamlessly combine interactive content material and customized templates, remodeling any article right into a extra advanced, participating advertising and marketing asset.
Relying in your viewers and your targets, you may as well embed extra options into your weblog template, resembling:
- Pop-up advertisements.
- Publication signups.
- Share buttons.
- RSS subscriptions.
- Writer bios.
- Advisable studying carousels.
- Numerous different CTAs and banners.
In some circumstances, these components will seem on the left or proper sidebar, on the backside of the web page or interspersed all through the weblog put up. To stick to Google’s Core Web Vitals, don’t add, plug in or embed an excessive amount of imagery or coding that slows down total web page velocity.
When unsure, preserve it easy.
What are a few of your favourite examples of weblog design?
Editor’s Observe: Up to date March 2023.
