DDs I featured from the Typography galleries
DDs I featured from the Typography galleries
DDs I featured from Designs & Interfaces
CSS Tricks: ListsLists are awesome So let's talk about themCSS Tricks: Lists by pica-ae
The basic list format is avaiable everywhere on dA, you do not need a premium membership to create a list. Of course you could just use or a symbol like ~ to indicate a new list item, but an actual HTML coded list has a lot of benefits over that.
Especially when you have single points that exceed a single line a HTML list, a line break appears at a spot you cannot control and therefore you will end up having no indentation and it will just look messy.
You don't have to be a Premium Member to use the HTML for lists, see :faq104:
You do need it, if you want to use Journal Skins aka personal CSS.
So, let's get started.
Basics About Lists
There are two kinds of list: ordered and unordered.
Ordered means you will get a numbered list from 1 to how many items your list has.
Unordered means you will get bullet points in front of every item.
Ordered listCowherbThat news announcer hears the girl crying. I
CSS Tricks: Fonts and Text BasicsToday I want to talk about fonts in journal skins You probably saw this one coming And maybe you also saw coming that this will be a rather long tutorial There is just a lot to say about this! Actually this will only be the first one about fonts and text. This one will cover the basics of working with fonts.CSS Tricks: Fonts and Text Basics by pica-ae
I will start by talking a bit about web-safe fonts and the concept behind a fallback hierarchy. Further down you'll find a selection of properties that can be styled with examples and explanations.
So, let's go!
The standard web safe fonts
A font is defined as web safe when it is installen on a great number of user's computers. They are also called system fonts, and can vary depending on your PC. Fonts on a Mac OS are not necessarily the same as fonts on a Windows OS.
Here's is a little example: on the left side is an image, an image created in PS on the right side. If both sides look the same, or at least very similar, it means they a
CSS/HTML Tricks: Article LayoutHello!CSS/HTML Tricks: Article Layout by pica-ae
Another tutorial for news articles and journals on dA!This one is meant to help you add structure to your news articles (and personal journals) and thus enhance the reading experience for your audience.
I have already written a tutorial on the topic of HTML Literature, but only showcased what is possible there. It is almost the same as :faq104:
This tutorial will try to explain why you should use additional HTML in your articles and how it helps improve their quality.
Also it turned out to be quite long, so skip to your liking.
For further reading please refer to CSS Tricks: Limiting .text width, which explains the necessity of limiting your text width.
Why is structure important?
Nobody likes reading a wall of text. If you look at an article and all you see is a grey blur,
CSS Tricks: Background ImagesToday's CSS Trick will be about using background images in Journal Skins.CSS Tricks: Background Images by pica-ae
There are three types of images that are mostly used in journals skins: big background images, seamlessly repeatable patterns and icon/logo-like images.
Images can be used for all elements of a journal: in the header, footer, behind text, next to text etc.. Any journal element has the ability to contain an image
I cannot stress enough that the main objective of a journal is making written content enjoyable to read. It is all about readability and making it as easy for the reader as possible. Very often I come across pretty journal skins, that have a complete lack of readability. In one of my previous CSS Tricks I already mentioned the dangers of text lengths and how to limit the .text width to improve readability.
Problems with using images:
Despite being big an images turns out to be too small for a journalAn image does not repeat seamlesslyText becomes non-re
CSS Tricks: Responsive dA?If you are at least slightly into web design and/or using mobile devices to browse, you should have come across the term "Responsive Webdesign". Basically it means that a website is set up in a way so it gives the best browsing experience no matter on what device you are viewing it.CSS Tricks: Responsive dA? by pica-ae
One term that is often mentioned along with it are "Fluid Designs". This usually refers to web sites that use % instead of px values to define sizes inside the layout.
This necessary trend in web design made me think about the deviantART.com layout. Because it is a design that has been working responsive for several years! You can test this by going to any place on dA and changing your browser window. You will notice how the ratio of all elements in width remains the same no matter how wide the browser window.
Now that we know that dA is responsive, we will soon find out that there is a responsive element inside dA, which reacts in first instance to the page on dA you are and in second instance to the brows
CSS Tricks: Limiting .text widthHello!CSS Tricks: Limiting .text width by pica-ae
Today I wanted to share a little CSS Trick with you Many other people have done this before, awesome people like Ikue, thespook or ginkgografix, and now it's me too
This first trick is very simple in execution, but I want to spend some time explaining why you should do it. That's why this journal has become a bit long
All about improving Readability!
When it comes to designing long copy texts, there are quite some challenges in order to create something easy to read and enjoyable to look at. One of the issues that may occur is text, that is running too long. The longer a line of text gets, the hard it is for the reader to follow the flow of text.
In some case you may have to even move your head from the beginning of a line to its end. And once you move your head, it becomes a lot harder to find the next line of text.
You may not even notice this while reading. But you will notice that your eyes get tired and you may
|Visit CSS Tricks Hub for an overview of the CSS Tricks Tutorials!|
|I am just starting to improve my Prints that are avaiable to purchase |
Please bare with me, as i hope to start selling dA Prints soon
In the meantime...