Kuromi news is a website aimed at delivering updates for everything Kuromi based. We share the latest images, tweets, and send a weekly email newsletter to all of Kuromi's fans.
On our landing page, you will see a brief description all about Kuromi and who she is, and why we love her so much! Looking down just a little further is a live feed of tweets from the official Project Kuromi twitter account! The gallery section is updated regularly with the newest pictures of Kuromi, from merch to TV appearances! Finally, we offer a newsletter service, allowing users to get weekly recaps of all of the weeks Kuromi news!
- Header Menu
- Seen all across our site, this navigational menu is fully responsive to all screen sizes and allows for easy navigation between our pages.
- This feature eliminates the need for back buttons and confusing menus.
- Landing page content
- Latest News
- The Footer
- Gallery
- The gallery is regularly updated and filled with the latest Kuromi images!
- All images in the gallery can be viewed in their full resolution in a new tab when they're clicked on.
- The images also all have alt text for those with visual impairments.
- Images have a text description with link that appears when hovered over
- The signup/newsletter page
There is a bug on mobile devices where it becomes impossible to scroll back up to the top of the website after reaching the bottom of the twitter feed, this could be fixed by either changing the scaling more or more optimally by adding a "return to top" button overlay on the screen.
The site was rigorously tested on a variety of devices and browsers. Some of them include
- Chrome desktop browser
- Microsoft edge desktop
- Firefox desktop
- iOS Safari
- iOS Chrome
Alongside testing on various browsers, the built in chrome developer tools were also used extensively to test screen sizes from 320px wide to 2560px this is reflected in the responsiveness section of styles.css
- HTML
- No errors were returned when passing through the official W3C validator
- CSS
- No errors were found when passing through the official (Jigsaw) validator
- The site was deployed using GitHub pages
- It was built using the master branch and is available live at https://jessdk.github.io/DiplomaProjectOne/
Thank you to everyone over on the slack channels, and to all my friends I used as rubber ducks for this whole project! This tutorial was used for helping to create creating the gallery https://blog.logrocket.com/responsive-image-gallery-css-flexbox/ The text sections on the landing page are slightly edited versions of the ones available at https://hellokitty.fandom.com/wiki/Kuromi