XML Expr
This week's highlight is the new header section of the blog. It's a responsive header.
https://xmlexpr.blogspot.com/
220561901913020919
false
false
true
true
false
user_r100
https://www.blogger.com/profile/09729361485633901245
//blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizihHpchmJoGeEVuJGCATZpHw9BgxolQLkV-Mw0hXTuIjdZQ8e_AeFQZdY6r5UrGWerl4b3Qx4aYsVx2w9y474FJvlyZDZiNcCLLNNQly7M3NZ8Xz1g2dsxQh3yuQJln2e6JTJtzci506US-j64gEDelPT-QYo7_TFH1kTp6AapPzrZQ/s220/channels4_profile.jpg
2685790861813406802
https://xmlexpr.blogspot.com/2025/10/weekly-blog-design-004.html
Weekly Blog Design - Responsive Header
October 18, 2025
2025
October
17
11:07 PM
This week's highlight is the new header section of the blog. It's a responsive header.
The header design is recreated from Google Analytics Android app. The highligh of this design is how the search bar fill the entire screen on focus.
On mobile screen, the header doesn't show site logo, so it relies on breadcrumb links for the blog navigation, which is only shown on the single item page (post page, blog page).
Mobile screen navigation (smaller screen).
On a wider screen, the blog title link is expanded.
Mobile screen navigation (wider screen).
Improving from here, I think I'll try mixing in the Blogger dashboard header design. Their design is compact on mobile screen with the site logo and the search icon that expands into a full width search input.