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,552 thoughts on “Website design refresh”

  1. В этой статье-обзоре мы соберем актуальную информацию и интересные факты, которые освещают важные темы. Читатели смогут ознакомиться с различными мнениями и подходами, что позволит им расширить кругозор и глубже понять обсуждаемые вопросы.
    Получить дополнительные сведения – вызвать врача нарколога на дом москва недорого

  3. Этот текст призван помочь читателю расширить кругозор и получить практические знания. Мы используем простой язык, наглядные примеры и структурированное изложение, чтобы сделать обучение максимально эффективным и увлекательным.
    Раскрыть тему полностью – вызов нарколога на дом в москве

  4. Мы собрали для вас самые захватывающие факты из мира науки и истории. От малознакомых деталей до грандиозных событий — эта статья расширит ваш кругозор и подарит новое понимание того, как устроен наш мир.
    См. подробности – выход из запоя в стационаре

  5. Этот обзор предлагает структурированное изложение информации по актуальным вопросам. Материал подан так, чтобы даже новичок мог быстро освоиться в теме и начать использовать полученные знания в практике.
    Раскрыть тему полностью – лечение запоя в стационаре санкт петербург

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

  17. В данной статье вы найдете комплексный подход к изучению насущных тем. Мы комбинируем теоретические сведения с практическими советами, чтобы читатель мог не только понять проблему, но и найти пути её решения.
    Не упусти важное! – вывести из запоя капельница на дому

  18. В этой публикации мы обсуждаем современные методы лечения различных заболеваний. Читатели узнают о новых медикаментах, терапиях и исследованиях, которые активно применяются для лечения. Мы нацелены на то, чтобы предоставить практические знания, которые могут помочь в борьбе с недугами.
    Что ещё нужно знать? – доктор вывод из запоя

  19. Читатели получат представление о том, как современные технологии влияют на развитие медицины. Обсуждаются новые методы лечения, персонализированный подход и роль цифровых решений в повышении качества медицинских услуг.
    Подробнее тут – выход из запоя на дому самара

  20. Этот текст призван помочь читателю расширить кругозор и получить практические знания. Мы используем простой язык, наглядные примеры и структурированное изложение, чтобы сделать обучение максимально эффективным и увлекательным.
    Лучшее решение — прямо здесь – врач нарколог выезд на дом москва

  21. Этот текст призван помочь читателю расширить кругозор и получить практические знания. Мы используем простой язык, наглядные примеры и структурированное изложение, чтобы сделать обучение максимально эффективным и увлекательным.
    Более подробно об этом – прокапаться на дому от алкоголя цена

  22. В этом обзоре мы обсудим современные методы борьбы с зависимостями включая медикаментозную терапию и психотерапию. Мы представим последние исследования и их результаты чтобы читатели могли быть в курсе наиболее эффективных подходов к лечению и поддержке. Получить больше информации – выведение из запоя екатеринбург

  23. Этот информационный материал собраны данные, которые помогут лучше понять текущие тенденции и процессы в различных сферах жизни. Мы предоставляем четкий анализ, графики и примеры, чтобы информация была не только понятной, но и практичной для принятия решений.
    Читать далее > – выведение из запоя стационар санкт петербург

  24. Эта информационная статья охватывает широкий спектр актуальных тем и вопросов. Мы стремимся осветить ключевые факты и события с ясностью и простотой, чтобы каждый читатель мог извлечь из нее полезные знания и полезные инсайты.
    Исследовать вопрос подробнее – прокапаться от алкоголя цены

  25. Эта статья погружает вас в увлекательный мир знаний, где каждый факт становится открытием. Мы расскажем о ключевых исторических поворотных моментах и научных прорывах, которые изменили ход цивилизации. Поймите, как прошлое формирует настоящее и как его уроки могут помочь нам строить будущее.
    Читать далее > – цены на вывод из запоя на дому

  26. Мы собрали для вас самые захватывающие факты из мира науки и истории. От малознакомых деталей до грандиозных событий — эта статья расширит ваш кругозор и подарит новое понимание того, как устроен наш мир.
    Получить дополнительные сведения – выведение из запоя в стационаре наркология

  27. В данной статье мы поговорим о будущем медицины, акцентируя внимание на прорывных разработках и их потенциале. Читатель узнает о новых подходах к лечению, роли искусственного интеллекта и возможностях персонализированной медицины.
    Расширить кругозор по теме – из запоя на дому

  28. Эта публикация обращает внимание на важность профилактики зависимостей. Мы обсудим, как осведомленность и образование могут помочь в предотвращении возникновения зависимости. Читатели смогут ознакомиться с полезными советами и ресурсами, которые способствуют здоровому образу жизни.
    Все материалы собраны здесь – вывод из запоя на дому самара цены

  30. Откройте для себя скрытые страницы истории и малоизвестные научные открытия, которые оказали колоссальное влияние на развитие человечества. Статья предлагает свежий взгляд на события, которые заслуживают большего внимания.
    Подробнее можно узнать тут – вывести из запоя на дому

  31. Этот обзор предлагает структурированное изложение информации по актуальным вопросам. Материал подан так, чтобы даже новичок мог быстро освоиться в теме и начать использовать полученные знания в практике.
    Прочесть заключение эксперта – вызвать врача нарколога на дом

  32. В этом обзоре мы обсудим современные методы борьбы с зависимостями, включая медикаментозную терапию и психотерапию. Мы представим последние исследования и их результаты, чтобы читатели могли быть в курсе наиболее эффективных подходов к лечению и поддержке.
    Посмотреть подробности – вывод из запоя на дому самара

  36. Этот текст призван помочь читателю расширить кругозор и получить практические знания. Мы используем простой язык, наглядные примеры и структурированное изложение, чтобы сделать обучение максимально эффективным и увлекательным.
    Получить дополнительные сведения – выезд нарколога на дом москва

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

  48. Эта разъяснительная статья содержит простые и доступные разъяснения по актуальным вопросам. Мы стремимся сделать информацию понятной для широкой аудитории, чтобы каждый мог разобраться в предмете и извлечь из него максимум пользы.
    Читать полностью – вызов капельницы на дом

  49. Публикация приглашает вас исследовать неизведанное — от древних тайн до современных достижений науки. Вы узнаете, как случайные находки превращались в революции, а смелые мысли — в новые эры человеческого прогресса.
    Узнать из первых рук – нарколог на дом в москве похмельная служба

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>