Jr Designer thread - Wordpress edition
Out of context: Reply #7
- Started
- Last post
- 8 Responses
- cherub0
Still trying to make wordpress my bitch, but damn layout is hard.
Ok. I found some resources if any jr designers are reading this and need a refresher on layout.
https://www.datocms-assets.com/2…
https://www.ramotion.com/blog/we…
Some random thoughts:
I had assumed that the logo/clickable title would always be the topmost thing, and centered. But based on that bottom pic, It appears the logo shares space with the top nav, on the same row in the header (which is itself can be split into a top, middle, and bottom header) with the logo and/or title not being centered but offset to the left. Because that's where the eye goes first when westerners first land on a page, top left.So the surprise there was that I thought the logo would only share row space with the h1 page title, not the navigation. Also, some of that stuff in the image looks left justified, not centered. On mobile it will be centered due to space, but still. That was unexpected.
And the reason all this matters is because of breakpoints. The whole web page is either columns stacked side by side or, likely, rows stacked upon each other, and when the viewport is scaled down each element inside that particular row as the rendering engine FLOWS left to right, it will wrap to the next line when it runs out of space.
The breakpoints are gonna make building the side nav VERY fun. :(
And a last note about the side nav that I wished someone had told me- it's an invisible area on the left, not necessarily with an outline that you can see. Its called sidebar but not really a bar.
Of course only complete wp beginners will get anything out of this, that's why I made the thread.
Like I said, go easy. I'm doing my best.