NewsTally Favicon

NewsTally Info

Visit NewsTally

About NewsTally (newstally.online)

NewsTally, hosted at newstally.online, is a modern news aggregation platform designed to deliver quick and concise news updates across various categories. It prioritizes a mobile-first experience, ensuring users can access news seamlessly on any device, from smartphones to laptops.

Key Features

  • Mobile-First Design: The website is optimized for mobile devices, with a full-width layout on phones and tablets. On larger screens (1024px and above), the content is constrained to a 375px width for a consistent mobile-like experience.
  • Vertical Scroll-Snap News Feed: News articles are presented as short cards in a vertical scroll-snap layout, allowing users to swipe through stories effortlessly. Each card includes an image (40% height), headline (12% height), and description with source/date (48% height).
  • Loading Skeleton: While news data is being fetched, a skeleton UI is displayed to improve perceived performance. This mimics the layout of news cards with a shimmering animation, ensuring users aren’t left with a blank screen.
  • Caching for Speed: News data is cached in the browser using localStorage for 5 minutes, reducing load times for returning users and improving the overall experience.
  • Bottom Navigation: A sticky bottom navigation bar provides quick access to sections like Home, Live, Quick, Trending, and Cricket, with the active tab highlighted.
  • Google Sheets Integration: NewsTally fetches its content dynamically from a Google Sheet using the Google Sheets API, ensuring fresh updates without manual intervention.
  • SEO Optimization: The site includes meta tags, Open Graph, and Twitter Card tags for better search engine visibility and social media sharing.
  • Progressive Web App (PWA) Support: With a manifest file and service worker, NewsTally can be installed as a PWA, offering an app-like experience.
  • Social Media Integration: The header includes links to NewsTally’s social media profiles on Facebook, Twitter, YouTube, and Instagram.

Technical Details

  • Framework: Built using HTML5, CSS3, and vanilla JavaScript, with no dependency on heavy frameworks.
  • Styling: Uses inline CSS for simplicity, with a clean design featuring a gradient header (blue shades), white card backgrounds, and a gray overall background.
  • Icons: Leverages Font Awesome for icons in the navigation and social links.
  • Analytics: Integrated with Google Analytics and Google Tag Manager for tracking user interactions.
  • Performance: Images are lazy-loaded, and news data is preloaded to enhance performance.

User Experience

NewsTally focuses on delivering a seamless user experience:

  • The vertical scroll-snap layout ensures users can focus on one news story at a time, mimicking a social media feed style.
  • Each news card is clickable, redirecting to a detailed view (`opennews.html`) with the full article.
  • The bottom navigation is fixed, making it easy to switch between sections without scrolling to the top.
  • The loading skeleton and caching ensure minimal wait times, even on slower connections.

Why Choose NewsTally?

NewsTally stands out for its simplicity and efficiency. It’s ideal for users who want quick news updates without the clutter of traditional news websites. Whether you’re interested in general news, live updates, trending stories, or cricket, NewsTally has a dedicated section for you. Its mobile-first approach, combined with PWA support, makes it a convenient choice for on-the-go news consumption.