Menu Aztek logo Contact Us
3615 Superior Avenue, Suite 4404A
Cleveland, Ohio 44114
216.472.2121

Alex Crump

Total posts: 2
Last post: February 22, 2019

Web Design 101 - Key Terminology and Concepts

Web Design 101 - Key Terminology and Concepts

By Alex Crump on  February 22, 2019

Are you about to start a website redesign project with a web design agency or freelancer but you're not a web designer yourself? There's a good chance you're about to encounter a lot of new terminology and concepts that you may not know. Fear not—we've prepared an easy to understand blog series that gives you some extra background as the project lead for your new website.

  1. HTML5
    The current html specification ('Spec' for short). HTML 5 is the current 'version' of HTML that is officially adopted and widely supported by browsers. This version includes some really great semantic elements us web design nerds had looked forward to (like,, and.)
  2. CSS (Sass)
    CSS is what makes a page look like it does, as it's the rules for all the fonts, colors, spacing, etc. We use SASS/SCSS at Aztek, but so does most of the modern web development world. SASS is a pre-processor language that makes CSS more powerful and easier to write.
  3. JavaScript (JQuery, Vanilla JS)
    JavaScript is the stuff that makes things happen on a web page—scrolling images, popups, flyout menus, etc. That's all JavaScript. JavaScript can do lots of neat things, but be careful. It's easy to add lots of unnecessary download time to a page if you use too much.
  4. Responsive web design (RWD)
    This makes a website work across all devices. RWD is device agnostic. It's not a separate mobile version. RWD is preferred by Google over a separate 'M dot' website (and we haven't seen one of those in years). Even with RWD, you should not expect your website to look the same in all browsers across all device sizes. Think of RWD like water being poured into different size containers—it's still your water, but it take on the shape of the container.
  5. User interface (UI)
    The stuff you can see and click on, such as the menus, the buttons, the headings, etc.
  6. User experience (UX)
    Don't confuse UX with UI. UX is the experience your user has while interacting with your website or app. How does it make them feel? Is it easy to use? Fun? Confusing?
  7. Mobile first
    The idea that designers and developers should build for a mobile experience first and work up to the larger breakpoints. Smalls screens and mobile devices present more constraints and challenges, so better to solve the hard stuff first.
  8. Bootstrap
    A popular framework for building responsive websites. Bootstrap enables designers and developers to create a responsive website more quickly and confidently, knowing that lots of elements have already been "battle-tested" and are ready to use out of the box without reinventing the wheel.
  9. Billboard sliders
    Somehow, billboard sliders are still a popular feature. We advise against them because they slow the page down and data shows that nobody watches past the first panel. Instead, prioritize your content and don't hide important messaging behind a second slide where users may never see it.
  10. Popovers, page interrupts
    A really great way to annoy users and instantly tell them they're about to have a bad time on your website is by using popovers and page interrupts. Just ask yourself about the first thing you do when you're confronted with a popover. Do you frantically and angrily looks for the close button? Well, that's what your users do.
  11. Hello bar
    A common feature at the top of a page that's used to display a brief, often temporary, message in a relatively non-invasive way. This is a much better alternative to a popover interrupt feature.
  12. Utility navigation
    A secondary navigation. It usually contains less important links to pages like about us, careers, blog, resources, etc. You can use utility navigation to keep your main navigation simple and focused while still making other options accessible.
  13. How many items in a main navigation?
    The current trend leans toward fewer items because it reduces cognitive load for the user and makes the site feel easier to use. Three to five items is ideal, although it can be very hard to accomplish for some companies.
  14. How long should a page be?
    As long as it needs to be to communicate effectively. There is no hard and fast rule for exact length. It's more important to make pages feel less intimidating by breaking them up and making them easy to scan. If a page feels like it is trying to cover too much ground, try breaking it up into several pages.
  15. Page speed (Performance)
    How fast a page loads. Google rewards quick-loading pages because users like instant access to pages. The quicker a page loads, the more likely a user will stick around. Good load times are correlated directly to improved UX and conversion rates. We aim for load times around 2.5 seconds or less.
  16. Lazy loading
    The technique of not loading an asset until the user scrolls far enough to need it. For instance, if your page has lots of images and videos that are further down the page where the user can't see them yet, we can defer loading them until absolutely necessary. This makes your page feel like it loads quicker to users, which makes them happy.
  17. Element collage
    Visual direction deliverable for responsive design process. It's not an 'old school' full Photoshop comp or a specific page. It's literally a collage of elements one might find on their website. These collages are intended to give people a good idea of what the site will look like without spending too much time in a design program, as it's better to work in the browser (with real HTML and CSS). Photoshop is wasteful.
  18. Web fonts
    A font that can be used on a website. We take it for granted now, but there was a day that in order to use a font that wasn't Times New Roman or Arial, you had to make graphics of words in Photoshop. These were dark times for the web. Now you can get nearly any typeface you want from Google fonts, Typekit.com, or fonts.com. Be aware, some font services require a monthly subscription (and good fonts cost money).
  19. Web video
    Video is the most popular form of content for users to consume. Ideally, your video content will be hosted and served from a platform like YouTube. YouTube is the second-largest search engine in the world and is a great place for users to discover your content and find their way to your website.
  20. The fold
    A holdover term from the newspaper era. Getting content above the fold, which is the part of your site that users see without scrolling down, is the notion that important content must be seen first. This leads to misguided thinking that all content needs to get crammed above the fold which in turn makes everything an unreadable disaster. Also, every device has a different fold, so defining 'the fold' is a pointless exercise. The reality is that users scroll, even without realizing. They scroll and scan until they find the thing they want. Scrolling is okay. Say it with me, "scrolling is okay."
  21. Rich snippet (schema)
    A special markup that tells Google more about certain types of content (addresses, events, products, etc.). This can help your content show up in more places on search engine results because Google better understands what the content is about. It's also good for assistive technology like screen readers.
  22. Adobe (Photoshop, Illustrator, XD)
    The software we use to design and create the visual direction and assets. Some people like Sketch, but we're a windows shop and Sketch is for Mac people.
  23. Stock vs. custom photography
    Stock photography is lower quality, but it's also cheaper. However, I can bet you that your images are the same as ones found on other competitor websites. Custom photography is more original and higher quality, but it's more expensive—sometimes significantly so. On the flipside, it'll be exactly what you want and unique to you and your company.
  24. Accessibility, web content accessibility guidelines (WCAG), section 508 compliance
    This means that a website is accessible to users who may have a disability and require assistive technology such as a screen reader to navigate and consume your website content. It's good practice for every website to be compliant, but some websites (such as government websites) are required to meet this compliance by law.
  25. GDPR
    Laws passed in the European Union governing the user's right to privacy. Even if you're not doing business in the EU, it is still good practice to offer GDPR compliance on your website, as it will eventually become the industry standard. Consult with your attorney about what level of GDPR compliance is necessary for your company.

That's it for our first installment, Join us next time for Part II, Digital Marketing and SEO!

Categories:
A Guide for Attending Content Marketing World 2018

A Guide for Attending Content Marketing World 2018

By Alex Crump on  August 31, 2018

It's almost that time of year again, Content Marketing World is just around the corner! As the weather starts to change and kids start to go back to school it also means it's time to gather in Aztek's home city of Cleveland for one of the best marketing conferences out there.

With over 120 sessions, people from over 50 countries, more orange than you can imagine, AND Tina Fey as keynote speaker, CM World is one of the most engaging conferences of the year.

via GIPHY

 

If you've never been to Content Marketing World before you're in for a treat! We may be biased because we live here, but Cleveland ROCKS (yes, we did just do that). There's so much to do here, from the Rock Hall to the West Side Market, you won't be disappointed. If you're returning to the conference we've had some cool new things pop up, like Back Yard Bocce, a new children's museum, and Forest City Shuffleboard.

Many of us at Aztek have been to CM World before and always come back with great information and a renewed sense of propose for what we do. So if it's your first time, here are some tips to get the most out of this awesome three-day conference.

Come Hungry

CM World has a ton of options for food, and taking advantage of the food is a great way to network and break the ice with new people. In years past, there has been an orange color theme to the food. It always unites people when you remark, 'wow, even the rice Krispy treats are orange!' The frequent snacks gives the opportunity to mingle, network, and make new friends! Our Content Strategist, Alex Crump and VP of Digital Marketing, Anna Yunker, both made new Australian friends the last year they attended (hey Justin & Rebecca!). And our COO, Dave Skorepa, advised "The breakfast is good. Eat the breakfast."

Make Your Schedule Ahead of Time

There are a variety of speakers and workshops to go to, our COO Dave really hit the nail on the head with which speakers you don't want to miss:

"If Ann Handley, Andrew Davis, Jay Baer, or Kristina Halvorson speak, do not even think about attending a different session at that time."

Once you've gotten those out of the way, make sure you use the app to schedule what other sessions you want to go to. It can be overwhelming to know which sessions to attend. That's why we recommend taking some time to read through the descriptions and chose the best ones for you.

A few sessions we're excited to attend this year:

  • Content Strategy and SEO for B2B Lead Generation
  • How Killer content Creates Conversion and Clones Customers
  • Secrets of the Most Shareable Content.

Come Prepared

As we already said, we love Cleveland. So come prepared to take in all Cleveland has to offer. We have a great bike share program to help get you around the city (you can't miss the red UH Bikes). The Flats and Hinge Town neighborhoods are both great, fun spots to take advantage of for nightlife. A little further out from the city we have great parks and trails to run and hike. What's great about Cleveland is we have a little something for everyone.

When it comes to being prepared for the conference, make sure you have a reliable way to take notes. An iPad or old-fashioned pen and paper are what works best for our team. We also try to limit our tweeting and focus more on notes so that we will be able to go back after the conference and digest what we learned.

Also, bring a portable phone charger, you don't want to miss out on valuable information because you have to go into the corner to charge your phone.

Take Action

Make sure that once you get back to the office you are able to apply what you've learned to your everyday work. Whether it's a blog post, a workshop, a presentation, or implementing a new process. Putting into practice the new skills you found proves not only to you but to your team as well that you learned something valuable during your time at CM World!

--

Hopefully, these tips help you make the most of your time at Content Marketing World! Give us a shout if you will be there too! And if you want to stay up to date with CM World and some of the awesome speakers, check out the #CMWorld twitter chat every Tuesday at noon.

Categories: