Web Design 101: What is Responsive Design?

By OSI Web Designer: Jorge Dominguez

 Viewing-platforms

If you are looking to read a funny blog this is probably not the one. My intention is not to make you laugh but instead inform you. By reading this I hope to entertain (not make you laugh) and at least provide some words of wisdom… coming from me- a web developer with over 3 years of experience.

I hope to help student organizations and anyone else looking to build a website, understand a topic that might not be too interesting but essential.

As the Tech/Web Developer of the Office of Student Involvement, also known as OSI, I am here to help organizations with promoting themselves by helping them make a website! Registered organizations through the Office of the Student Involvement have the option of getting a website developed and hosted under DePaul servers. I am also able to provide a yourorg.depaul.edu URL to student organizations.

There are many student organizations that come to me with little to no knowledge on web development. I personally enjoy helping out organization who might not have any experience or knowledge on how to create a successful website. This is where my web development experience comes into place. I am able to show them my past work and educate them on what constitutes having a great website. It is very helpful to me when organizations already know what they want on their website in terms of content. The only hard part for them is figuring out how to layout the content and deciding on the design of their website.

When people think of the design of a website they mostly think of the color scheme, look of the buttons, font-type, font-color, and overall appearance. In reality… there is more to a website than just that.

There are two main types of website templates used in today’s world and that is static and responsive design.

 

A static template is a template with elements that are set to a certain size defined in pixels.

 

A responsive design template increases or decreases the pixel count as well as rearranges elements into different sizes that fit on the screen of the device the website is being viewed.

…For example, with a responsive design template the website automatically adjusts to mobile version when viewed on a smartphone and a desktop version when viewed on a desktop computer.

Responsive design is pretty much the future of websites and many modern websites are currently using this type of design. Since technology is becoming more portable, software and applications are also being designed to keep up with such devices. For these reasons I tend to recommend responsive design templates to student organizations when creating their websites.

I remember the first time I experienced a responsive design website like it was yesterday. It occurred when working on a homework assignment and I visited the Chicago Sun Times website. I was looking up an article on my laptop and accidentally clicked on the minimize button on the right corner of the window. After the website was minimized I noticed that the grid layout had changed to a continuous scrolling page. The main menu was minimized to a select list and the pictures in the web page were minimized to fit the width of the screen. I could not believe what I was seeing and continued to select and expand one side of the window. I then noticed that the content of the website increased and the grid layout changed to include more columns. I was really intrigued and proceeded to research this feature- (I had to know what this was). That is how I eventually stumbled upon learning about responsive design. One major benefit I discovered was that creating a responsive design website eliminates creating two separate websites, one mobile and a desktop version, to make it compatible with mobile devices.

The only down side of responsive design is that it is not supported by older versions of internet explorer. Although true, many of those older versions are also not being supported by newer computers and updates are no longer being pushed by Microsoft. This will eventually force people using old software to update to the newest version. As time passes by and old technology becomes obsolete, responsive design is looking to be the standard for websites.

…Jorge Dominguez works for the Office of Student Involvement as the Tech/Web Developer, creating websites for student organizations and maintaining the main departmental website. Apart from working for the office he is also a member of Sigma Lambda Beta and a Senator for 4th & 5th Year Students in the Student Government Association. During his free time he dances for Ritmo Dembow, a DePaul recognized dance group, in which he enjoys learning how to dance salsa.

Advertisements

One thought on “Web Design 101: What is Responsive Design?

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s