Rollout Design

Rollout Design

Today I drafted a small responsive website design to kill time. It can accommodate about 3-4 simple pages of content. Called it Rollout Design and it:

  • is fully responsive, works with all device sizes
  • has some added effects when loading content
  • also will display and function correctly if JavaScript is disabled

Demo: https://seabadger.io/portfolio/rollout_design



Tagged with
Comment

Sudoku grid – responsive squares

Admittedly not the most challenging task, but I found it entertaining. Generally speaking CSS is not very supportive when it comes to square based grids. To be more specific, making a responsive one which scales nicely. At the end I even decided to rather go with JS to make the rubrics squares, but I also reviewed the other option of making an equal side grid.



Tagged with
Comment
Landscape from Cuba

Serving optimized, responsive images

Recently I’m fairly busy with Udacity’s Mobile Web Specialist nanodegree and diving deeper in photography, but let’s find some time to show the benefits of responsive images via a working and downloadable example. When serving images you want to make sure the image resizes nicely (responsive) and it’s as small as possible without affecting quality (optimized). Not saying I always do it, especially with CMSs it can be overwhelming to save those few bytes, but it’s still important both for your users and for your SEO.



Tagged with
Comment

New responsive WordPress theme – SeaBadgerMD

In the last month, in addition to getting more familiar with service workers and offline first, my main pet project was a new WordPress theme called SeaBadgerMD. It’s finally usable and while I plan to add some more features, I hopefully fixed all the bugs which would prevent using it. It’s based on MDBootstrap, which is a Material Design framework built on Bootstrap. Of course I use the Bootstrap grid system, so everything is responsive. If not, please let me know.



Tagged with
Comment