Alisen Hazzard

the Blog

Tag: web-design

Easy CSS Layout - Two Column Photo Album

July 15th, 2014

Tags: Web Design, CSS

There are many effective ways to style photos on a website using responsive design. I have experimented with Masonry (a JavaScript grid layout), Flexbox, and other grid-based layouts for the structure of my photo albums, but these techniques don't work for some sites. Here is a floating two column structure. The limited amount of code needed is also a plus.

Keep reading

First Steps for Developing a WordPress Theme

September 20th, 2014

Tags: Web Design, WordPress

If you can build a static website with HTML, CSS, and Javascript, it’s a short road to cross to building a WordPress theme. Other skills are involved, including some understanding of PHP (which WordPress is built on) and familiarity with the WordPress admin interface. These will certainly expedite the process of developing a theme.

Keep reading

Getting Started with Search Engine Optimization (SEO)

July 22nd, 2014

Tags: Web Design, SEO

Once you have a website up and ready-to-go, the next step is getting it noticed by search engines and the people using them. Search Engine Optimization (SEO) may seem like a daunting thing to undertake on your own, but there are some simple ways you can start increasing your visibility through your content and code. This is a large area of discussion with many different opinions, especially since the algorithm search engines use isn’t constant or publicly available, but based on current understanding of the algorithm, here is a basic guide to increasing the chances of your website appearing higher in result pages.

Keep reading

Google Web Fonts

July 9th, 2014

Tags: Web Design, Typography

I just love using Google Fonts to change the type when I'm designing a website.. Usually, I try to leave this until later in the process, because I get obsessed with switching between fonts, or I pick a font too early and it doesn’t represent the finished site and then have to go back and find a new one (sigh...)

Keep reading

Portfolio Website Design Process

March 22nd, 2015

Tags: Web Design, Wireframes

Before I started this portfolio and blog project, I used Balsamiq to create a wireframe. I hadn't used this software before, but I found it highly beneficial to my outlining process, and I ended up really liking the program and the tools it offers.

Keep reading

Simple Flexbox Website

August 8th, 2014

Tags: Web Design, Flexbox, CSS, HTML

Using Flexbox to structure the layout of a website includes two parts: a parent element that acts as a flex container, and one or more child elements which receive the flex properties of the parent. First, the parent element receives the flex property display: flex, and then it’s fast and easy to style the child elements. With a few quick media queries to adjust for different screen sizes, your layout is ready to go!

Keep reading

Skillcrush Webinar with Ada Birnir

June 27th, 2014

Tags: Web Design

My mornings usually start with a cup of coffee and Designer News (or Reddit, depending on how alert my brain is), and I love reading morning emails from the team at Skillcrush. Skillcrush is a community for learning online, specifically in the technical field, and they send great emails like “Joining the Git Community” and “Tech Terms” of the day. Their blog is filled with fun articles and helpful posts for ladies in tech.

Keep reading

Three Cheers for Treehouse

July 2nd, 2014

Tags: Web Design

I’ve been following the Web Design Track at Treehouse, which incorporates the fundamentals of CSS and HTML, and also introduces web design foundations, an intro to Photoshop and Illustrator, and SEO and Sass basics. The track is thorough, walking you through the process of designing a website from start to finish, including purchasing a domain name and hosting your website on a server.

Keep reading

Tips on Usability from 'Don't Make Me Think' by Steve Krug

July 30th, 2014

Tags: Web Design, Usability

According to Steve Krug, the author of Don’t Make Me Think: A Common Sense Approach to Web Usability, the No. 1 rule of web design is to make the user think as little as possible. Not because the user will leave the site or think it’s poorly designed, but because the user will think it’s their fault if they don’t understand what to do on a website. I think it’s fair to say this is not how we’d like our users to feel upon visiting (or leaving) our sites.

Keep reading
Portfolio Website Design Process
Installing MAMP and WordPress Locally
First Steps for Developing a WordPress Theme
Getting Started with Search Engine Optimization (SEO)

UX Usability Photoshop CSS Web Design WordPress SEO Typography Illustrator JavaScript Wireframes Writing Flexbox HTML Github Web Development