Coloured panels make things ‘pop’
Fusce at venenatis nisl, a consectetur diam. Donec tristique dui id pretium pellentesque. Aliquam sit amet nunc nulla. Etiam mattis elementum odio, faucibus tincidunt odio. Vestibulum pretium risus odio, eu elementum eros facilisis eget. Ut vulputate, mauris at facilisis faucibus, quam massa interdum mi, at pellentesque leo sem nec tortor. Suspendisse id placerat turpis. Maecenas nunc urna, tempor et eros vitae, viverra vestibulum risus. Mauris nisi dolor, accumsan sit amet placerat vel, accumsan non lorem. Donec dictum lorem libero, vitae viverra magna laoreet vitae. Integer id ultrices enim.
I want this to be really stand out, so I’m going to add a background colour. This is a thing that I’m trying to increase awareness about, but it’s lost in a big page of content.
Sed ac nisi tincidunt, semper eros id, malesuada orci. Duis posuere turpis at eros tempus, vitae pretium elit feugiat. Ut et lorem vitae ipsum aliquam pellentesque ultricies vitae dui. Phasellus pellentesque augue neque, non consequat purus eleifend et. Sed sodales felis ultrices turpis vulputate bibendum. Ut placerat tortor ac velit placerat rhoncus. Quisque vitae luctus neque. Nulla vestibulum imperdiet ex in pellentesque. Aliquam faucibus augue ut tortor semper, sit amet condimentum velit ornare. Suspendisse nulla ex, rutrum ac molestie quis, tincidunt ornare diam. Morbi vulputate vestibulum urna et facilisis.
Columns:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam convallis gravida commodo. Nullam blandit scelerisque rutrum.
Media and Text:
This year, we were determined to sail to Bridlington using a sofa. It did not go well…
Single Image:
Gallery:
Pull Quote:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam convallis gravida commodo. Nullam blandit scelerisque rutrum. Vestibulum auctor leo vel turpis venenatis, ut placerat risus egestas. Maecenas tincidunt eleifend ipsum eleifend auctor. Curabitur euismod condimentum lectus id finibus. Integer porta orci sit amet felis blandit consequat. Fusce volutpat non metus ac vestibulum.
The greatest glory in living lies not in never falling, but in rising every time we fall
Nelson Mandela
Aenean in ante id erat tempus tempor tempor id nisi. Etiam aliquam, metus eget accumsan tincidunt, purus erat ullamcorper nisi, id venenatis sapien enim eget mi. Ut mollis turpis ac urna ornare venenatis. Ut accumsan vehicula nisi, ac ullamcorper odio iaculis non. Quisque tristique diam at tempus ornare. Donec urna leo, rutrum eu velit nec, eleifend dapibus augue. Sed aliquet blandit felis nec fringilla.
Bullet points and Numbered lists (unordered and ordered lists):
Bullet Points
- eggs
- bread
- bacon
- sweeties
Numbered list
- get up
- get dressed
- eat breakfast
- clean teeth
- leave for work
Using Headers
What is Lorem Ipsum?
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry’s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
Why do we use it?
It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using ‘Content here, content here’, making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for ‘lorem ipsum’ will uncover many web sites still in their infancy. Various versions have evolved over the years, sometimes by accident, sometimes on purpose (injected humour and the like).
Where does it come from?
Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia, looked up one of the more obscure Latin words, consectetur, from a Lorem Ipsum passage, and going through the cites of the word in classical literature, discovered the undoubtable source. Lorem Ipsum comes from sections 1.10.32 and 1.10.33 of “de Finibus Bonorum et Malorum” (The Extremes of Good and Evil) by Cicero, written in 45 BC. This book is a treatise on the theory of ethics, very popular during the Renaissance. The first line of Lorem Ipsum, “Lorem ipsum dolor sit amet..”, comes from a line in section 1.10.32.
The standard chunk of Lorem Ipsum used since the 1500s is reproduced below for those interested. Sections 1.10.32 and 1.10.33 from “de Finibus Bonorum et Malorum” by Cicero are also reproduced in their exact original form, accompanied by English versions from the 1914 translation by H. Rackham.
Where can I get some?
There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don’t look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to be sure there isn’t anything embarrassing hidden in the middle of text. All the Lorem Ipsum generators on the Internet tend to repeat predefined chunks as necessary, making this the first true generator on the Internet. It uses a dictionary of over 200 Latin words, combined with a handful of model sentence structures, to generate Lorem Ipsum which looks reasonable. The generated Lorem Ipsum is therefore always free from repetition, injected humour, or non-characteristic words etc.
Links and buttons
A link in your text to who’s who
A link to Get in Touch with us
A link in your text to another site – like the BBC – should open in a new tab
Accordions
What is an accordion in web design?
An accordion is a list of headers that hide or reveal additional content when selected/opened. You may see them often on FAQ pages, where it makes it easy for users to scan the list of questions without getting distracted by answers and a lot of text, and giving them control by clicking on the questions that pertain to them.
Make your website content easy to read
How many times have you looked at a website and felt overwhelmed by too many words? Before we dive into website accordions, we need to review the goal of making your website easy to use and easy to read. It is true that too much content can be hard to read, but your website still needs to have a good amount of content for someone looking for more information and for Google to know what your website is about. Even if you have a lot of content, if the text is broken into small sections made up of the heading and then smaller, more detailed text, the content can be easily scanned and then read more completely as needed.
When to use accordions on your website
There are 3 general principles that should be considered when using accordions: reducing cognitive load, increasing readability, and clarity. Accordions are most appropriate when users will only need a few specific pieces of content within a page or if you have only a small space to display a lot of content.