Website design refresh

Posted on by

It has been nearly 3 years since I first launched the freestyle developments website and it was long overdue for a design and code refresh. Today I finally relaunched the site.

For me, the biggest change has been to move to a HTML5 doctype. The site now utilises many of the new HTML5 tags, such as header, footer, nav, section, article, aside and time as well as some of the new HTML5 forms attributes. Many thanks goes to @rem and @brucel for their fantastic HTML5 book, which I gleaned a lot of useful information from.

I’ve also given it a bit of a visual refresh, to use some CSS3 properties that I’m now regularly using on sites I build: drop shadows, rounded corners – that sort of eye candy. It means that my CSS no longer validates with no errors, but I’m hoping people in the know will be able to see past the vendor specific CSS property prefix errors e.g. “-moz-”, “-webkit-”.

I’ve gone for a Jello Mold layout to give me the flexibility of a fluid layout within parameters I control. I love fluid layouts, but their biggest enemy is widescreen displays, which makes reading text difficult due to the long line lengths, which is minus points for accessibility.

Assuming your default font size is 16px, my site is fluid between 700px and 1280px. Outside of these browser widths the site is rigid. It means that the site never gets so small that the content is unreadable, and never become so wide that the line width is a hindrance to legibility. Another nice thing about the Jello Mold is that between the max and min, the site re-sizes itself in an organic way, which really has to be experienced to be appreciated (give it a go now, go on).

I’ve also updated my CSS to use the YUI reset sylesheet. I don’t agree with absolutely everything that YUI are doing with their CSS stylesheets, but they have some really interesting ideas and valid points. Either way, it is nice to have part of my styles coming off a CDN and is a bit more up to date than the reset I used to use.

In accordance with my post on the EM unit and browser zoom, I’ve updated my stylesheets and removed all references to pixels in favor of EM’s like I have been doing with all my new website builds for a while now. I don’t set a font size for any of my pages html or body elements, allowing the user to choose the size of my website by setting their default font size for their browser, which is 16px for most browsers.

Anyway, I think that is all I have to say for now. Enjoy the new site and all the interesting tech that comes with it. If this all sounds good to you, and you’re looking for a freelancer like me. Get in touch.

2,564 thoughts on “Website design refresh”

  1. Строительный журнал https://sota-servis.com.ua о ремонте отделке и строительстве. Актуальные статьи кейсы лайфхаки и рекомендации специалистов. Будьте в курсе новинок и принимайте грамотные решения для своих проектов.

  2. Онлайн строительный https://reklama-region.com журнал для профессионалов и частных застройщиков. Полезные статьи разборы материалов новинки рынка и практические рекомендации. Все о строительстве ремонте и дизайне в удобном формате.

  3. Актуальные новости https://ktm.org.ua Украины онлайн. Последние события аналитика экономика происшествия и международные отношения. Только проверенная информация и важные обновления в режиме реального времени.

  6. Сайт для женщин https://bestwoman.kyiv.ua статьи о красоте здоровье отношениях и стиле жизни. Полезные советы тренды и идеи для вдохновения. Все что нужно современной женщине в одном месте.

  7. Строительный журнал https://tozak.org.ua с полезными статьями и актуальными обзорами. Освещаем современные технологии материалы и тренды в строительстве и ремонте. Практические советы идеи и решения для создания комфортного и надежного пространства.

  8. Онлайн сайт для женщин https://elegance.kyiv.ua статьи о красоте отношениях семье и саморазвитии. Советы идеи и вдохновение для повседневной жизни.

  12. Женский онлайн портал https://stepandstep.com.ua все о жизни стиле и здоровье. Статьи о красоте отношениях семье и саморазвитии. Полезный контент для женщин любого возраста.

  13. Женский журнал https://a-k-b.com.ua все о стиле здоровье и отношениях. Практические советы тренды и вдохновение для повседневной жизни.

  14. Туристический портал https://swiss-watches.com.ua для путешественников: направления маршруты советы и лайфхаки. Подбор отелей билетов и экскурсий идеи для отдыха и полезные рекомендации. Планируйте поездки легко и открывайте новые страны с комфортом.

  15. Онлайн курсы рабочих https://obuchenie-rabochih.ru профессий — это быстрый старт в новой карьере. Практика поддержка наставников и современные методики помогут вам освоить специальность и найти работу.

  16. Онлайн женский журнал https://zhenskiy.kyiv.ua статьи о красоте здоровье моде и любви. Советы тренды и полезный контент для женщин любого возраста.

  17. Нужно масло или смазка? гидравлическое масло hlp 46 краснодар официальный дилер масел Devon и смазок Efele в Краснодаре предлагает широкий ассортимент продукции для промышленности и автосервиса. Гарантия качества выгодные цены быстрая доставка и профессиональная консультация по подбору.

  19. Продажа стройматериалов https://mir-betona.od.ua в Одессе по доступным ценам. В наличии всё необходимое для ремонта и строительства: от базовых материалов до профессионального инструмента. Быстрая доставка и гарантия качества.

  20. ParfumPlus https://parfumplus.ru это сервис доставки оригинальных духов по всей России. Мы помогаем удобно и безопасно заказать любимые ароматы не рискуя столкнуться с подделками. В нашем каталоге представлен широчайший выбор женских и мужских духов туалетной воды нишевая и люксовая парфюмерия популярные бестселлеры и новинки мировых брендов.

  21. Нужен коммерческий транспорт https://neotruck.ru продажа грузовиков от официального дилера с гарантией качества и сервисным обслуживанием. Большой выбор моделей помощь в подборе и выгодные условия для корпоративных клиентов.

  23. Санкт-Петербургский Фестиваль https://tattoo-weekend.ru Татуировки — это встреча лучших тату-мастеров конкурсы шоу-программа и тысячи вдохновляющих идей. Отличный шанс познакомиться с трендами и найти своего мастера.

  24. Заказывали тут https://happyholi.ru мебель на заказ. Работа супер прайс адекватные а сроки не затягивают. Нам понравилось.

  25. Советую сайт https://happyholi.ru мебель на заказ. Качество супер прайс адекватные а доставку не затягивают. Рекомендую.

  26. хирург на дом перевязка вызвать врача на дом терапевта москва

  29. невролог выезд на дом хирург снятие швов на дому

  30. Collaboration boost: before going live with a brand partnership I buy tiktok likes to ensure the sponsored content performs well—protects my reputation and gets me rehired

  31. Trust indicators help—best legit hookup sites have transparent ownership clear policies and responsive support teams.

  32. Latest Liberian business news https://forbesliberia.com market analysis economic trends and technology developments. Learn about key events investment opportunities and business prospects in the country.

  34. Когда бизнес развивается менедж топ ру онлайн позволяет устранить хаос в рабочих задачах документообороте и рабочем взаимодействии между командами. Платформа собирает ключевые процессы в одной системе чтобы руководитель контролировал реальную картину по персоналу задачам согласованиям и финансам без бесконечных таблиц вручную. Это удобное решение для компаний которым необходимы контроль прозрачность работы и развитие бизнеса без лишней рутины и ежедневных потерь времени каждый день.

  36. Пока бизнес растет купить bpm систему saas снижает хаос в процессах файлах и рабочем взаимодействии между командами. Система сводит ключевые процессы в одной системе чтобы руководитель контролировал реальную картину по персоналу задачам согласованиям и финансам без бесконечных таблиц вручную. Это сильный инструмент для компаний которым важны контроль прозрачность работы и развитие бизнеса без лишней рутины и ежедневных потерь времени каждый день.

  38. Фундамент под ключ https://fundament-v-spb.ru любой сложности: ленточный плитный свайный. Профессиональный подход современные технологии и точный расчет для долговечности и безопасности здания.

  41. Фундамент под ключ https://fundament-v-spb.ru любой сложности: ленточный плитный свайный. Профессиональный подход современные технологии и точный расчет для долговечности и безопасности здания.

  44. На сайті 500pokupok.com зібрано багато статей із оглядами товарів підбірками та рекомендаціями. Зручний ресурс для тих хто хоче зробити правильний вибір перед покупкою.

  45. портал новин inews.in.ua висвітлює події в Україні та світі а також теми технологій. Тут можна знайти новини про гаджети техніку ІТ та актуальні тренди.

  46. На сайті 500pokupok.com зібрано багато статей із оглядами товарів підбірками та рекомендаціями. Зручний ресурс для тих хто хоче зробити правильний вибір перед покупкою.

  47. портал новин inews.in.ua висвітлює події в Україні та світі а також теми технологій. Тут можна знайти новини про гаджети техніку ІТ та актуальні тренди.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>