ebook-responsive-elearning-with-links-us
Create successful ePaper yourself
Turn your PDF publications into a flip-book with our unique Google optimized e-Paper software.
39<br />
3 Determining<br />
A Responsive eLearning Design Strategy<br />
3.3: Challenges and Solutions<br />
3.3.1: Design<br />
a<br />
Resizing JPGs and PNGs: Photos or vector graphics can be exported as JPGs or PNGs. There are a<br />
couple of options to resize JPGs and PNGs to fit different display sizes.<br />
Scaling: Scaling is nothing<br />
but resizing images based<br />
on screen size. Scaling<br />
raster (bitmap) images may<br />
lead to quality loss. It is<br />
therefore recommended to<br />
<strong>us</strong>e bigger images, and<br />
dynamically scale them<br />
down based on device size.<br />
Cropping: When images are<br />
scaled to a very small size,<br />
details can no longer be seen<br />
and their meaning can get<br />
lost. An effective alternative is<br />
to crop the image around a<br />
foc<strong>us</strong> area that holds the<br />
meaning. This means <strong>us</strong>ing a<br />
larger image, and then<br />
reducing its size by cutting<br />
non-essential areas.<br />
Combination: The third<br />
and final option is to<br />
combine both the above<br />
approaches to dynamically<br />
crop and then scale images<br />
depending on device size.
Change language