Category: Responsive Design

How to use Chrome DevTools like a Pro

As the name implies Chrome Developer Tools is a tool that allows web developers to interfere and manipulate applications via the browser. With this tool you can: Manage interface problems Debug Javascript Code with using breakpoints Optimize your code To open DevTools, you can right-click anywhere on the page and...

The Human Factor: Why is There So Much Bad Design?

Bad design is everywhere, while there’s still a lack of good design. Why’s that? Are there not enough experts? Are they being misdirected somehow? Is it human nature? Let’s take a closer look together. Yesterday, I wanted to take care of a straightforward task. I tried to correct the time on my micro...

Design the Smallest Spaces: Atomization is the Future

Modern design needs to work everywhere, not just on the desktop. In order for that to work, it has to be as compartmentalized as much as possible. In the following article, I’ll show you the best way to atomize your design. In the Past: Design was Space-Consuming Edenic times. Designers used to design for a rect...

Atomic Design: How to Design a Modular Website

Often, technical terms in web design aren’t more than empty words. The term “Atomic Design” is one of them. All it does is allow its inventor to spread his philosophy with a memorable name. Nonetheless, it is worth looking into the content. Atomic Design: This is What’s Behind the Word The term...

Responsive SVG: What’s Possible, and What Isn’t?

Responsive layouts are indispensable in web design. On the one hand, there are ever-shrinking displays on smartphones, and on the other hand, there’s the size increase of desktop displays. Between that, there are phablets, tablets, as well as netbooks, notebooks, and what not. Thanks to CSS, technically optimiz...

Tool Tip: Sizzy Accelerates Responsive Designing

Sizzy is a web app and a Chrome extension that provides a fast way of testing your responsive designs. And by that, I mean really fast. There are a bunch of tools that show you previews of your websites on all kinds of devices. However, I have yet to find one that’s faster than Sizzy. Different Live Previews at ...

How to use Media Queries in JavaScript

If you thought responsive design was reserved for CSS layouts only, you’ll be pleased to hear media queries can also be used in JavaScript. Continue reading %How to use Media Queries in JavaScript% ...

Your Web Image is Unnecessarily Bloated

Images make up a majority of web content.But a lot of websites and applications that we browse aren’t always delivering the most optimal image format, size, quality and dimension. As a developer, it seems inefficient to serve a 2,000kb JPEG image when we could compress images to optimize the performance without degra...

Simbla 2017: Dynamic Pages Straight Out of the Website Builder

The website builder Simbla sets itself apart from the competition in several aspects. To the customer, the most noticeable one is the database connectivity. The new feature “Dynamic Pages” is another highlight from Simbla’s scope of functions. Readers of Noupe Magazine have known the Simbla Website Bu...

Modern Web Design: Common Mistakes You Should Avoid

Web design and development have changed a lot over the past years. Mobile internet is mainly responsible for this, changing when and where we use the internet. Many things that were common ten years ago are now considered outdated. This even applies to a lot of things that were completely up to date two to three years ...